自动化测试策略：单元测试、集成测试、E2E

导语

前端测试不是”写越多越好”，也不是”只写 E2E 就够了”。Kent C. Dodds 的测试金字塔对前端依然适用，但 2026 年的工具链已经变了。本文给你一套适合现代前端团队的测试策略。

测试金字塔在 2026

单元测试：测什么，不测什么

测：纯函数、工具函数、状态机、复杂算法。

不测：React 组件内部实现细节、第三方库行为、CSS 样式。

一个判断标准：如果测试代码和实现代码耦合太紧，重构时测试一定会坏，那这个测试就没写对。

集成测试：前端真正的价值层

集成测试是前端最该投入的地方——测组件组合、用户交互、数据流。推荐用 Testing Library 的思想：

“测用户能看到什么，能点什么，而不是测组件内部状态。”

// 好：从用户视角出发
await user.click(screen.getByRole('button', { name: /提交/ }));
expect(await screen.findByText(/成功/)).toBeInTheDocument();

// 坏：耦合实现细节
expect(component.state.isSubmitting).toBe(false);

E2E：只覆盖关键路径

E2E 测试慢、贵、容易 flaky。只用来覆盖：

• 登录 → 核心功能 → 付款 的关键路径
• 多步骤表单的完整流程
• 跨页面联动的关键场景

AI 辅助测试的落地

2026 年最务实的做法：用 AI 生成 E2E 测试骨架，人工补全断言逻辑。Playwright 的代码录制 + AI 补全已经能覆盖 60% 的场景。

结论

前端测试策略的核心不是”全都要”，而是单元测试保逻辑、集成测试保交互、E2E 保关键路径。每个 PR 跑前两层，每天跑一次 E2E。把 AI 用来加速重复用例生成，人工精力留给测试策略设计。