testing-patterns
Write Better Jest Tests
متاح أيضًا من: 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.
تنزيل ZIP المهارة
رفع في Claude
اذهب إلى Settings → Capabilities → Skills → Upload skill
فعّل وابدأ الاستخدام
اختبرها
استخدام "testing-patterns". Create a factory function for user data
النتيجة المتوقعة:
```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,
});
```
استخدام "testing-patterns". Show me a custom render function
النتيجة المتوقعة:
```typescript
export const renderWithTheme = (ui: React.ReactElement) => {
return render(
<ThemeProvider>{ui}</ThemeProvider>
);
};
```
استخدام "testing-patterns". How should I structure my tests?
النتيجة المتوقعة:
Use describe blocks to group related tests: describe('ComponentName', () => { describe('Rendering', () => {...}); describe('User interactions', () => {...}); describe('Edge cases', () => {...}); });
التدقيق الأمني
آمنSecurity 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.
درجة الجودة
ماذا يمكنك بناءه
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.
جرّب هذه الموجهات
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.
أفضل الممارسات
- 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
تجنب
- 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