用途:该技能帮助团队决定测试信心从何而来,按风险把测试分配到快速本地检查、较真实的集成测试与少量端到端流程中,避免用单一类型测试证明一切。
主要能力:
- 测试分层:静态分析(TypeScript、ESLint、Biome)、单元(Vitest、Jest)、组件(Testing Library、Vitest、Cypress Component)、集成(Vitest、Testing Library、MSW、Supertest)、端到端(Playwright、Cypress)、契约(Pact、schema 校验)、无障碍(axe、Playwright、Testing Library)、视觉(Storybook、Chromatic、Playwright 截图)、性能(Lighthouse CI、Web Vitals、Playwright traces)。
- 更新后的测试金字塔:大量单元测试覆盖领域逻辑,较多组件与集成测试覆盖 UI 行为,薄薄一层 E2E 覆盖关键旅程。
- 各层职责:单元测数据转换、校验、reducer、状态机、工具函数与业务规则;组件测渲染状态、表单交互、加载/空/错误视图、键盘行为;集成测跨模块与网络边界、路由 loader、缓存失效;E2E 测注册登录、结算支付、内容创建编辑、主要导航与角色权限流程。
- Mock 策略:用 Mock 隔离不确定服务、模拟网络失败、让昂贵依赖可预测;避免 Mock 正在测试的实现本身。优先单元用真实逻辑、HTTP 边界用 MSW 或测试服务器、关键旅程用真实浏览器。
- 契约测试:用于独立发布、API 漂移频繁、仅靠类型客户端不够的场景,如按 OpenAPI schema 校验响应、用 Pact 式工具验证消费者期望。
- 无障碍:自动检查缺失标签、无效角色、对比度、landmark 与表单问题,同时保留键盘导航、焦点管理、屏幕阅读器播报等人工检查。
- 视觉回归:有选择地用于设计系统基础组件、营销页、复杂响应式布局与主题变体,控制测试数据、减少动画噪声。
- 性能与可靠性:Lighthouse CI、包体积检查、Web Vitals 监控、flaky 测试检测、带报告的重试策略。
使用方式:按问题选起始层——纯计算或工具逻辑用单元,表单交互或加载状态用组件,路由 loader、API 调用、缓存行为用集成,登录、结算、核心业务旅程用 E2E,前后端 schema 漂移用契约,焦点与键盘流用无障碍,布局样式漂移用视觉,性能回归用性能预算工具。CI 分层:每次变更跑类型检查、lint、单元与聚焦的组件/集成测试;合并或发布时跑 E2E、视觉 diff、无障碍扫描与性能预算。
防抖动:避免任意 sleep,等待可观察条件,隔离测试数据,保持幂等,在用例间重置存储、Cookie 与 mock,E2E 相互独立;出现 flaky 不要以重跑为主要解法,应修复不确定性来源。
覆盖率:覆盖率是信号不是证明,可用于发现高风险未测区域与为核心逻辑设下限,但不应奖励琐碎测试或为数字测实现细节,宜采用基于风险的覆盖率目标。
推荐起步栈:TypeScript + lint 作为基础防线,Vitest 做单元与集成,Testing Library 做 UI 行为,MSW 做网络 Mock,Playwright 做 E2E,axe 做无障碍检查,Lighthouse CI 做性能预算;并非强制,但可作为现代基线。
限制:资料未提供该技能的具体安装命令、价格、平台与效果数据。