[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-cf2145ff-6751-49b8-a186-fa6b877d611a":3,"$fdUxaU_BuLRci85AwRIliF4BdThHulmXSSpWLAOufKw8":43},{"id":4,"title":5,"description":6,"categoryId":7,"moduleId":8,"tags":9,"prompt":10,"icon":11,"source":12,"sourceUrl":13,"authorId":14,"authorName":15,"isPublic":16,"stars":17,"runs":18,"createdAt":19,"updatedAt":19,"module":20,"category":27,"packages":34},"cf2145ff-6751-49b8-a186-fa6b877d611a","testing-patterns","jest测试模式、工厂函数、模拟策略和TDD工作流程。在编写单元测试、创建测试工厂或遵循TDD红绿重构周期时使用。","cat_coding_review","mod_coding","sickn33,coding","---\nname: testing-patterns\ndescription: \"Jest testing patterns, factory functions, mocking strategies, and TDD workflow. Use when writing unit tests, creating test factories, or following TDD red-green-refactor cycle.\"\nrisk: unknown\nsource: community\ndate_added: \"2026-02-27\"\n---\n\n# Testing Patterns and Utilities\n\n## Testing Philosophy\n\n**Test-Driven Development (TDD):**\n- Write failing test FIRST\n- Implement minimal code to pass\n- Refactor after green\n- Never write production code without a failing test\n\n**Behavior-Driven Testing:**\n- Test behavior, not implementation\n- Focus on public APIs and business requirements\n- Avoid testing implementation details\n- Use descriptive test names that describe behavior\n\n**Factory Pattern:**\n- Create `getMockX(overrides?: Partial\u003CX>)` functions\n- Provide sensible defaults\n- Allow overriding specific properties\n- Keep tests DRY and maintainable\n\n## Test Utilities\n\n### Custom Render Function\n\nCreate a custom render that wraps components with required providers:\n\n```typescript\n\u002F\u002F src\u002Futils\u002FtestUtils.tsx\nimport { render } from '@testing-library\u002Freact-native';\nimport { ThemeProvider } from '.\u002Ftheme';\n\nexport const renderWithTheme = (ui: React.ReactElement) => {\n  return render(\n    \u003CThemeProvider>{ui}\u003C\u002FThemeProvider>\n  );\n};\n```\n\n**Usage:**\n```typescript\nimport { renderWithTheme } from 'utils\u002FtestUtils';\nimport { screen } from '@testing-library\u002Freact-native';\n\nit('should render component', () => {\n  renderWithTheme(\u003CMyComponent \u002F>);\n  expect(screen.getByText('Hello')).toBeTruthy();\n});\n```\n\n## Factory Pattern\n\n### Component Props Factory\n\n```typescript\nimport { ComponentProps } from 'react';\n\nconst getMockMyComponentProps = (\n  overrides?: Partial\u003CComponentProps\u003Ctypeof MyComponent>>\n) => {\n  return {\n    title: 'Default Title',\n    count: 0,\n    onPress: jest.fn(),\n    isLoading: false,\n    ...overrides,\n  };\n};\n\n\u002F\u002F Usage in tests\nit('should render with custom title', () => {\n  const props = getMockMyComponentProps({ title: 'Custom Title' });\n  renderWithTheme(\u003CMyComponent {...props} \u002F>);\n  expect(screen.getByText('Custom Title')).toBeTruthy();\n});\n```\n\n### Data Factory\n\n```typescript\ninterface User {\n  id: string;\n  name: string;\n  email: string;\n  role: 'admin' | 'user';\n}\n\nconst getMockUser = (overrides?: Partial\u003CUser>): User => {\n  return {\n    id: '123',\n    name: 'John Doe',\n    email: 'john@example.com',\n    role: 'user',\n    ...overrides,\n  };\n};\n\n\u002F\u002F Usage\nit('should display admin badge for admin users', () => {\n  const user = getMockUser({ role: 'admin' });\n  renderWithTheme(\u003CUserCard user={user} \u002F>);\n  expect(screen.getByText('Admin')).toBeTruthy();\n});\n```\n\n## Mocking Patterns\n\n### Mocking Modules\n\n```typescript\n\u002F\u002F Mock entire module\njest.mock('utils\u002Fanalytics');\n\n\u002F\u002F Mock with factory function\njest.mock('utils\u002Fanalytics', () => ({\n  Analytics: {\n    logEvent: jest.fn(),\n  },\n}));\n\n\u002F\u002F Access mock in test\nconst mockLogEvent = jest.requireMock('utils\u002Fanalytics').Analytics.logEvent;\n```\n\n### Mocking GraphQL Hooks\n\n```typescript\njest.mock('.\u002FGetItems.generated', () => ({\n  useGetItemsQuery: jest.fn(),\n}));\n\nconst mockUseGetItemsQuery = jest.requireMock(\n  '.\u002FGetItems.generated'\n).useGetItemsQuery as jest.Mock;\n\n\u002F\u002F In test\nmockUseGetItemsQuery.mockReturnValue({\n  data: { items: [] },\n  loading: false,\n  error: undefined,\n});\n```\n\n## Test Structure\n\n```typescript\ndescribe('ComponentName', () => {\n  beforeEach(() => {\n    jest.clearAllMocks();\n  });\n\n  describe('Rendering', () => {\n    it('should render component with default props', () => {});\n    it('should render loading state when loading', () => {});\n  });\n\n  describe('User interactions', () => {\n    it('should call onPress when button is clicked', async () => {});\n  });\n\n  describe('Edge cases', () => {\n    it('should handle empty data gracefully', () => {});\n  });\n});\n```\n\n## Query Patterns\n\n```typescript\n\u002F\u002F Element must exist\nexpect(screen.getByText('Hello')).toBeTruthy();\n\n\u002F\u002F Element should not exist\nexpect(screen.queryByText('Goodbye')).toBeNull();\n\n\u002F\u002F Element appears asynchronously\nawait waitFor(() => {\n  expect(screen.findByText('Loaded')).toBeTruthy();\n});\n```\n\n## User Interaction Patterns\n\n```typescript\nimport { fireEvent, screen } from '@testing-library\u002Freact-native';\n\nit('should submit form on button click', async () => {\n  const onSubmit = jest.fn();\n  renderWithTheme(\u003CLoginForm onSubmit={onSubmit} \u002F>);\n\n  fireEvent.changeText(screen.getByLabelText('Email'), 'user@example.com');\n  fireEvent.changeText(screen.getByLabelText('Password'), 'password123');\n  fireEvent.press(screen.getByTestId('login-button'));\n\n  await waitFor(() => {\n    expect(onSubmit).toHaveBeenCalled();\n  });\n});\n```\n\n## Anti-Patterns to Avoid\n\n### Testing Mock Behavior Instead of Real Behavior\n\n```typescript\n\u002F\u002F Bad - testing the mock\nexpect(mockFetchData).toHaveBeenCalled();\n\n\u002F\u002F Good - testing actual behavior\nexpect(screen.getByText('John Doe')).toBeTruthy();\n```\n\n### Not Using Factories\n\n```typescript\n\u002F\u002F Bad - duplicated, inconsistent test data\nit('test 1', () => {\n  const user = { id: '1', name: 'John', email: 'john@test.com', role: 'user' };\n});\nit('test 2', () => {\n  const user = { id: '2', name: 'Jane', email: 'jane@test.com' }; \u002F\u002F Missing role!\n});\n\n\u002F\u002F Good - reusable factory\nconst user = getMockUser({ name: 'Custom Name' });\n```\n\n## Best Practices\n\n1. **Always use factory functions** for props and data\n2. **Test behavior, not implementation**\n3. **Use descriptive test names**\n4. **Organize with describe blocks**\n5. **Clear mocks between tests**\n6. **Keep tests focused** - one behavior per test\n\n## Running Tests\n\n```bash\n# Run all tests\nnpm test\n\n# Run with coverage\nnpm run test:coverage\n\n# Run specific file\nnpm test ComponentName.test.tsx\n```\n\n## Integration with Other Skills\n\n- **react-ui-patterns**: Test all UI states (loading, error, empty, success)\n- **systematic-debugging**: Write test that reproduces bug before fixing\n\n## When to Use\nThis skill is applicable to execute the workflow or actions described in the overview.\n\n## Limitations\n- Use this skill only when the task clearly matches the scope described above.\n- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.\n- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.\n","","imported","https:\u002F\u002Fgithub.com\u002Fsickn33\u002Fantigravity-awesome-skills","user_system_seed","SkillOPIC",true,67,1306,"2026-05-16 13:43:50",{"id":8,"name":21,"slug":22,"icon":23,"description":24,"sort":25,"createdAt":26},"编程开发","coding","mdi-code-braces","代码生成、调试、审查，提升开发效率",2,"2026-05-16 12:53:40",{"id":7,"name":28,"slug":29,"icon":30,"description":31,"moduleId":8,"sort":32,"skillCount":33,"createdAt":26},"代码审查","review","mdi-magnify-scan","代码质量分析、安全审查",4,145,[35],{"id":36,"skillId":4,"version":37,"fileName":38,"fileSize":39,"filePath":40,"fileHash":41,"manifest":42,"createdAt":19},"caa39096-4475-4f82-bf99-235a9fd2b320","1.0.0","testing-patterns.zip",2557,"uploads\u002Fskills\u002Fcf2145ff-6751-49b8-a186-fa6b877d611a\u002Ftesting-patterns.zip","d36980ed07817e8f602ce0d5f9c4b0c0d5cdfcf3051fe0b3abfa77804d5985b0","[{\"path\":\"SKILL.md\",\"isDirectory\":false,\"size\":6332}]",{"code":44,"message":45,"data":46},200,"success",{"items":47,"stats":48,"page":51},[],{"averageRating":49,"totalRatings":49,"ratingCounts":50},0,[49,49,49,49,49],{"limit":52,"offset":49,"hasMore":53,"nextOffset":52,"ratedOnly":16},15,false]