testing-patterns

Testing Patterns - Jest 单元测试与 TDD 工作流指南

技能概述

Testing Patterns 提供 Jest 测试模式、工厂函数、Mock 策略和 TDD 工作流的完整指南，帮助开发者编写可维护的单元测试。

适用场景

编写单元测试

当你需要为 React Native 组件、TypeScript 函数或业务逻辑编写单元测试时，使用本技能提供的测试结构、查询模式和断言方法。

创建测试工厂

当你需要为组件 Props 或数据对象创建可复用的测试数据工厂时，使用工厂模式避免重复代码并保持测试数据一致性。

遵循 TDD 开发流程

当你采用测试驱动开发方式时，按照红-绿-重构的循环编写失败的测试、实现最小代码、然后重构优化。

核心功能

工厂函数模式

提供 getMockX(overrides?: Partial<X>) 形式的工厂函数，为组件 Props 和数据对象提供合理的默认值，同时允许按需覆盖特定属性，保持测试 DRY（Don't Repeat Yourself）。

Testing Library 集成

包含自定义渲染函数、三种查询模式（getBy、queryBy、findBy）以及用户交互测试（fireEvent）的完整用法，专为 React Native 测试优化。

Mock 策略与组织

涵盖模块 Mock、GraphQL 钩子 Mock、测试结构组织（describe/it 嵌套）以及 beforeEach 清理模式，帮助编写结构清晰、可维护的测试套件。

常见问题

什么是 TDD 红绿重构循环？

TDD（测试驱动开发）遵循三个步骤循环：首先编写一个失败的测试（Red），然后实现刚好足够通过测试的最小代码（Green），最后在测试通过的前提下重构优化代码（Refactor）。这个过程确保所有生产代码都有对应的测试覆盖，并且代码在重构过程中保持正确性。

如何编写测试工厂函数？

工厂函数遵循 getMockX(overrides?: Partial<X>) 模式，返回一个包含默认值的对象，并使用展开运算符合并覆盖项：

const getMockUser = (overrides?: Partial<User>): User => {
  return {
    id: '123',
    name: 'John Doe',
    email: 'john@example.com',
    role: 'user',
    ...overrides,
  };
};

// 使用时只需覆盖需要的属性
const adminUser = getMockUser({ role: 'admin' });

Testing Library 的三种查询模式有什么区别？

getBy：断言元素必须存在，找不到时抛出异常

queryBy：断言元素不存在，找不到时返回 null

findBy：用于异步渲染的元素，会等待元素出现

选择原则：默认使用 getBy，验证不存在时使用 queryBy，异步内容使用 findBy。