持续集成
在持续集成中运行端到端测试
持续集成 是 CoddyKit 上的免费 Angular Academy 课时。 这是第 4 节课，共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 Angular Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 Angular Academy 课程共包含 4 节课。
为什么要在 CI 中运行 E2E
E2E 测试在每次推送或拉取请求时自动运行，价值最大。持续集成（CI） 会在代码合并前发现回归问题，因此登录流程出错时不会在无人察觉的情况下进入生产环境。
运行 E2E 所需的 CI 条件
CI 任务必须依次完成：安装依赖、安装 Playwright 浏览器、构建或提供 Angular 应用，然后以无头模式运行测试。CI 机器没有显示器，因此测试默认以无头模式运行。
在 CI 中安装浏览器
浏览器不会提交到您的代码仓库中。请在流水线中使用 Playwright 的安装程序安装浏览器，并同时安装操作系统依赖。
npm ci
npx playwright install --with-deps让 Playwright 启动应用
webServer 配置会告知 Playwright 在测试前启动您的应用，并在测试后将其关闭。在 CI 中设置 reuseExistingServer: false，确保每次都启动全新的服务器。
// playwright.config.ts
export default {
webServer: {
command: 'ng serve --configuration production',
url: 'http://localhost:4200',
reuseExistingServer: !process.env.CI,
},
};一个 GitHub Actions 工作流
典型的工作流会检出代码、设置 Node、安装依赖和浏览器，然后运行测试套件。
# .github/workflows/e2e.yml
name: e2e
on: [push, pull_request]
jobs:
test:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with: { node-version: 20 }
- run: npm ci
- run: npx playwright install --with-deps
- run: npx playwright test无头模式与 CI 标志
Playwright 会通过 CI 环境变量自动检测 CI 并进行调整：重试失败的测试、禁止使用 test.only，并谨慎地使用更多工作线程。您也可以显式设置重试次数。
export default {
retries: process.env.CI ? 2 : 0,
forbidOnly: !!process.env.CI,
};发布 HTML 报告
Playwright 会生成 HTML 报告。请将其作为 CI 构建产物上传，以便在运行结束后检查失败原因，其中包括跟踪记录和屏幕截图。
- uses: actions/upload-artifact@v4
if: always()
with:
name: playwright-report
path: playwright-report/在失败时捕获跟踪记录
将跟踪记录配置为仅在第一次重试时记录。这样既能保持运行速度，又能为调试提供任何失败的完整回放。
export default {
use: { trace: 'on-first-retry', screenshot: 'only-on-failure' },
};使用分片提升速度
大型测试套件可以通过 --shard 分配到多台并行机器上。每个 CI 任务运行其中一部分，从而缩短总耗时。
npx playwright test --shard=1/3
npx playwright test --shard=2/3
npx playwright test --shard=3/3通过缓存加快 CI
在多次运行之间缓存 node_modules 和 Playwright 浏览器二进制文件，避免安装过程占用大部分构建时间。大多数 CI 提供商都提供缓存操作，并可根据锁定文件生成缓存键。
正确地使构建失败
当任意测试失败时，Playwright 会以非零代码退出，这会使 CI 将任务标记为失败并阻止合并。请勿使用 || true 吞掉该退出代码，否则失败的测试会在不知不觉中通过。
快速检查
在 CI 中是什么安装了浏览器？
回顾
通过安装依赖和浏览器（playwright install --with-deps）、让 webServer 启动应用，并结合能够识别 CI 的重试机制以无头模式运行测试，从而在每次推送时运行 E2E。请将 HTML 报告和跟踪记录作为构建产物上传，通过分片提升速度，并让非零退出代码阻止错误的合并。
常见问题解答
「持续集成」课时是免费的吗？
是的 — 「持续集成」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 Angular Academy 课程的其余内容，请升级到 CoddyKit PRO。 Angular Academy 课程共包含 4 节课。
「持续集成」这节课中我会学到什么？
在持续集成中运行端到端测试 你通过在浏览器中直接运行的动手代码来练习 Angular Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 Angular Academy 需要有经验吗？
无需任何先前经验。CoddyKit 上的 Angular Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。 这是第 4 节课，共 4 节。
「持续集成」课时需要多长时间？
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。
我能在这节 Angular Academy 课中编写并运行代码吗？
能。每节 Angular Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。