概述
该工作流专门用于使用 Playwright 进行端到端测试，涵盖浏览器自动化、视觉回归测试、跨浏览器测试以及 CI/CD 集成。
适用场景
在以下情况使用此工作流：
- 搭建 E2E 测试
- 自动化浏览器测试
- 实现视觉回归
- 跨浏览器测试
- 将测试与 CI/CD 集成
范围与证据要求
只选择当前任务所需的阶段，不必执行列出的全部技能。使用专用测试账号、隔离夹具和经批准的沙盒端点；点击操作可能发送消息、产生购买或删除数据。请先审查浏览器安装/下载与 CI 权限。trace、截图、视频和 storage-state 文件可能包含凭据或隐私数据；应保持其私密，并在分享前对产物进行脱敏。Playwright 的 WebKit 运行不能作为真实 Safari/iOS 上的证据，移动端模拟也不是真机测试。在差异经过审核前应保持视觉基线固定，不要仅为让测试通过就覆盖基线。
工作流阶段
阶段 1：测试环境搭建
调用的技能
- playwright-skill — Playwright 设置
- e2e-testing-patterns — E2E 模式
操作
- 安装 Playwright
- 配置测试框架
- 设置测试目录
- 配置浏览器
- 创建基础测试设置
可复制提示词
Use @playwright-skill to set up Playwright testing
阶段 2：测试设计
调用的技能
- e2e-testing-patterns — 测试模式
- test-automator — 测试自动化
操作
- 识别关键流程
- 设计测试场景
- 规划测试数据
- 创建页面对象
- 设置夹具
可复制提示词
Use @e2e-testing-patterns to design E2E test strategy
阶段 3：测试实现
调用的技能
- playwright-skill — Playwright 测试
- webapp-testing — Web 应用测试
操作
- 编写测试脚本
- 添加断言
- 实现等待
- 处理动态内容
- 添加错误处理
可复制提示词
Use @playwright-skill to write E2E test scripts
阶段 4：浏览器自动化
调用的技能
- browser-automation — 浏览器自动化
- playwright-skill — Playwright 功能
操作
- 配置无头模式
- 设置截图
- 实现视频录制
- 添加 trace 收集
- 配置移动端模拟
可复制提示词
Use @browser-automation to automate browser interactions
阶段 5：视觉回归
调用的技能
- playwright-skill — 视觉测试
- ui-visual-validator — 视觉验证
操作
- 设置视觉测试
- 创建基线图像
- 添加视觉断言
- 配置阈值
- 审核差异
可复制提示词
Use @playwright-skill to implement visual regression testing
阶段 6：跨浏览器测试
调用的技能
- playwright-skill — 多浏览器
- webapp-testing — 浏览器测试
操作
- 配置 Chromium
- 添加 Firefox 测试
- 添加 WebKit 测试
- 测试移动端浏览器
- 比较结果
可复制提示词
Use @playwright-skill to run cross-browser tests
阶段 7：CI/CD 集成
调用的技能
- github-actions-templates — GitHub Actions
- cicd-automation-workflow-automate — CI/CD
操作
- 创建 CI 工作流
- 配置并行执行
- 设置产物
- 添加报告
- 配置通知
可复制提示词
Use @github-actions-templates to integrate E2E tests with CI
质量门禁
- 测试通过
- 覆盖率足够
- 视觉测试稳定
- 跨浏览器已验证
- CI 集成正常
相关工作流组合
- testing-qa — 测试工作流
- development — 开发
- web-performance-optimization — 性能
限制
- 仅当任务明确符合上述范围时才使用此技能。
- 不要将输出视为环境特定验证、测试或专家评审的替代品。
- 如果缺少必需输入、权限、安全边界或成功标准，请停止并请求澄清。