AI-Driven E2E Testing

AI 研发闭环，
从规范到测试自动完成

OpenSpec Playwright 将 OpenSpec 规范自动转化为 Playwright E2E 测试。AI 生成测试用例、Healer 自动修复选择器、Claude Code 和 OpenCode 一键执行。告别手动维护测试，专注于真正重要的代码。

快速开始 GitHub
AI Coding Assistants

CLAUDE.md 一键配置

复制以下内容到项目根目录的 CLAUDE.md，快速启用员工级行为规范。

CLAUDE.md
Preview
Core Features

为什么选择
OpenSpec Playwright？

专为 OpenSpec 规范驱动开发设计，AI 全流程自动化，测试不再成为交付瓶颈。

规范驱动
规范驱动测试生成
读取 OpenSpec 规范文档，自动提取路由、表单、验证规则，生成对应 Playwright 测试用例。不再需要手动编写和维护测试。
规范即文档
规范变更，测试即更新
测试与 OpenSpec 规范严格对齐。验证通过意味着规范得到实现，规范变更自动驱动测试更新。
自愈机制
Healer 自愈
选择器失效时 AI 自动诊断并修复。区分测试 Bug 和 App Bug，三阶段修复流程：分类 → 修复 → 升级。
浏览器探索
真实浏览器探索
通过浏览器工具遍历每个路由（Playwright MCP / openspec-pw explore），snapshot + @ref 精确定位元素。Token 高效，状态持久，可视化操作。
测试报告
完整测试报告
自动生成 Markdown 报告，包含测试结果、截图、失败分类（App Bug / Test Bug / RAFT）。可追溯、可分享。
Claude Code
Claude Code 原生集成
作为 Claude Code skill 提供，一个 /opsx:e2e <name> 命令完成从规范到报告的全流程。
AI Coding Assistants

原生支持两种 AI 编码助手

自动检测项目中的编辑器，按编辑器命名规范安装对应的命令。Claude Code 与 OpenCode 平起平坐，享受同一套 E2E 管线。

Claude Code
Anthropic
/opsx:e2e <name>
  • ✓ .claude/skills/ skill installation
  • ✓ Playwright MCP via claude mcp add
  • ✓ CLAUDE.md employee standards
or
OpenCode
SST
/opsx-e2e <name>
  • ✓ .opencode/commands/ install (hyphenated)
  • ✓ Playwright MCP via opencode.jsonc
  • ✓ AGENTS.md + opencode.jsonc.instructions
Workflow

9 步端到端闭环

严格按顺序执行，每步有明确产出。反馈循环确保问题不过夜。

Superpowers（可选）
/plugin install superpowers@claude-plugins-official
开发方法论增强（对话式 spec 探索、TDD、subagent 实现），OpenSpec 工作流为主，Superpowers 为辅
OpenSpec CLI
npm install -g @fission-ai/openspec@latest && openspec init
/opsx:propose、/opsx:apply 等命令
openspec-playwright
npm install -g openspec-playwright@latest && openspec-pw init
Claude Code 用 /opsx:e2e，OpenCode 用 /opsx-e2e
Playwright MCP
claude mcp add playwright npx @playwright/mcp@latest
测试执行 + Healer 自愈。OpenCode：在 opencode.jsonc 的 mcp.playwright 中配置
1
探索与提案 必需
现有项目先探索（/opsx:explore）再写 proposal；新项目直接生成 proposal + scenarios。
opsx:explore opsx:propose
2
产品与架构评审 按需
战略和架构影响评审。
3
设计审查 必需
在实现前进行设计评审，确保方案合理。评审通过后开始实现。
4
实现 必需
执行 /opsx:apply 进行实现 → lint + typecheck 通过才算成功。
opsx:apply
5
自审 必需
/opsx:verify 自审实现代码，确保质量。
opsx:verify
6
E2E 测试生成与执行 必需
Claude Code 用 /opsx:e2e 或 OpenCode 用 /opsx-e2e 生成测试 → 浏览器探索 → Healer 修复。
opsx:e2e opsx-e2e Playwright MCP
7
验证通过后归档 必需
永久归档，更新 specs/。
opsx:archive
8
发布 按需
选择合适的发布策略。
9
迭代回顾 按需
评审本次迭代，总结经验教训。
工作流指标
总步骤 9
必需步骤 5
按需步骤 4
支持的编辑器 Claude Code · OpenCode
OpenSpec 阶段 5
反馈循环
App Bug → 步骤 4
架构问题 → 步骤 2
Proposal 调整 → 步骤 1
反馈循环

问题不过夜

生产中必然发生信号，触发对应回归路径。

快速开始

5 分钟上手

已有 Node.js 环境？按步骤安装，立即体验。

1 安装步骤

01
安装 CLI
npm install -g openspec-playwright@latest
02
初始化 OpenSpec
npm install -g @fission-ai/openspec@latest && openspec init
03
安装 Playwright MCP
claude mcp add playwright npx @playwright/mcp@latest
04
初始化 E2E
openspec-pw init && npx playwright install --with-deps

可选： openspec-pw explore 和 Playwright MCP 自带浏览器探索能力；增强 AI 编码助手可安装 Superpowers： /plugin install superpowers@claude-plugins-official

运行第一个 E2E 测试

$npm install -g openspec-playwright@latest
$openspec init && openspec-pw init
$npx playwright install --with-deps
# In Claude Code:
$/opsx:e2e <change-name>
# In OpenCode:
$/opsx-e2e <change-name>
# Auto: read specs → explore → generate tests
# → run tests → Healer fix → report
技术栈

AI 执行引擎驱动闭环

每个组件都是业界最佳实践，共同支撑 AI 驱动的研发闭环。

Claude Code
AI 执行引擎
Playwright
测试框架
Browser Tool
浏览器探索（Playwright MCP / openspec-pw explore）
OpenSpec
规范驱动
Playwright MCP
测试执行
对比

与传统测试方式对比

从手动维护到 AI 自动化，测试生产力的本质飞跃。

OpenSpec Playwright
✓ 规范驱动，变更即测试
✓ AI 自动生成测试用例
✓ Healer 自动修复选择器
✓ 一行命令完成全流程
✓ 测试与规范严格对齐
手动维护 E2E
每次变更手动更新测试
选择器失效靠人工发现
测试覆盖靠经验判断
规范与测试容易脱节
维护成本随项目线性增长