testing-patterns
Write Better Jest Tests
Auch verfügbar von: 0xDarkMatter,0xDarkMatter,CleanExpo,ChrisWiles
This skill provides ready-to-use Jest testing patterns including factory functions, custom render utilities, and mocking strategies that help developers write maintainable, DRY tests following TDD principles.
Die Skill-ZIP herunterladen
In Claude hochladen
Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen
Einschalten und loslegen
Teste es
Verwendung von "testing-patterns". Create a factory function for user data
Erwartetes Ergebnis:
```typescript
interface User {
id: string;
name: string;
email: string;
role: 'admin' | 'user';
}
const getMockUser = (overrides?: Partial<User>): User => ({
id: '123',
name: 'John Doe',
email: 'john@example.com',
role: 'user',
...overrides,
});
```
Verwendung von "testing-patterns". Show me a custom render function
Erwartetes Ergebnis:
```typescript
export const renderWithTheme = (ui: React.ReactElement) => {
return render(
<ThemeProvider>{ui}</ThemeProvider>
);
};
```
Verwendung von "testing-patterns". How should I structure my tests?
Erwartetes Ergebnis:
Use describe blocks to group related tests: describe('ComponentName', () => { describe('Rendering', () => {...}); describe('User interactions', () => {...}); describe('Edge cases', () => {...}); });
Sicherheitsaudit
SicherSecurity review completed. All 42 static findings are false positives triggered by the static analyzer misinterpreting: (1) markdown code formatting backticks as shell commands, (2) TypeScript generics like Partial<X> as cryptographic patterns, and (3) the word 'APIs' as network reconnaissance. The skill is legitimate Jest testing documentation with no security concerns.
Qualitätsbewertung
Was du bauen kannst
Setting up test infrastructure
Create custom render functions and factory utilities that wrap components with required providers like ThemeProvider, reducing boilerplate in every test.
Writing maintainable unit tests
Use factory functions to generate consistent test data, making tests easier to read, maintain, and update when data structures change.
Following TDD methodology
Apply the red-green-refactor cycle by writing failing tests first, then implementing minimal code to pass, ensuring tests drive development.
Probiere diese Prompts
Help me set up a basic test file for a React component. Show me how to create a custom render function that wraps the component with a ThemeProvider.
Create a factory function called getMockUser that returns a user object with default values for id, name, email, and role. Show how to override specific properties using Partial type.
Show me how to mock a module like 'utils/analytics' in Jest. Include how to access the mock in the test and how to mock return values.
Walk me through the TDD workflow for adding a new feature. Start with writing a failing test, then show the minimal implementation to pass it.
Bewährte Verfahren
- Always use factory functions for props and data to keep tests DRY and consistent
- Test behavior through the public API rather than implementation details
- Use descriptive test names that explain what behavior is being tested
Vermeiden
- Avoid testing mock behavior instead of actual component behavior
- Do not duplicate test data across tests - use factory functions instead
- Avoid testing implementation details that may change refactoring