e2e-mcp-server

🚀 E2E Test MCP Server 🎭

让 AI 助手自动编写和执行 E2E 测试，基于 Playwright，支持主流 UI 框架，还能智能错误修复。

🚀 快速开始

方式一：直接使用（推荐）

无需手动克隆，npx 直接从 GitHub 运行：

{
  "mcpServers": {
    "e2e-test": {
      "command": "npx",
      "args": ["-y", "github:wjj9868/e2e-mcp-server"]
    }
  }
}

方式二：克隆仓库

git clone https://github.com/wjj9868/e2e-mcp-server.git
cd e2e-mcp-server
npm install
npm run build

{
  "mcpServers": {
    "e2e-test": {
      "command": "node",
      "args": ["/path/to/e2e-mcp-server/dist/index.js"]
    }
  }
}

配置位置

✨ 主要特性

• 🚀 一句话生成测试 — 告诉 AI "帮我测试登录页面"，自动完成全部工作
• 🔧 智能错误修复 — 测试失败后 AI 自动分析并修复脚本
• 🎨 框架无关 — 支持 Element Plus、Ant Design、MUI 等主流 UI 框架
• 📊 可视化报告 — 自动生成 HTML 测试报告，失败截图一目了然
• 🧠 内置最佳实践 — 提供运行时 DOM 知识，引导 AI 使用稳定选择器

🎬 效果演示

🛠️ 工具

| 工具 | 说明 | |------|------| | e2e_init | 初始化 Playwright 测试项目 | | e2e_run | 执行测试并返回结构化结果 | | e2e_report | 打开 HTML 测试报告 |

💬 提示词

| 提示词 | 说明 | |--------|------| | e2e-context | 运行时 DOM 结构、选择器策略、Playwright API | | e2e-debug | 测试失败排查指南 |

🎨 支持的 UI 框架

| 框架 | 说明 | |------|------| | Element Plus | Vue 3 | | Ant Design Vue | Vue 3 | | Ant Design | React | | MUI | React | | Chakra UI | React |

💭 设计理念

MCP 只做 AI 做不了的事

| AI 负责 | MCP 负责 | |---------|----------| | 分析源码 | 初始化项目 | | 设计测试场景 | 执行测试 | | 生成测试代码 | 提供运行时 DOM 知识 | | 修复失败测试 | 生成测试报告 |

传统方案用模板约束 AI，限制了 AI 的能力。本项目让 AI 充分发挥代码理解和生成能力，MCP 只提供 AI 无法自己推断的运行时信息。

📚 详细文档

| 文档 | 说明 | |------|------| | 快速开始 | 5 分钟上手 | | 选择器策略 | 编写稳定的测试 | | UI 框架指南 | 各框架 DOM 特点 | | 调试指南 | 测试失败排查 | | 常见问题 | FAQ |

🔧 技术细节

环境要求

• Node.js >= 18.0.0
• Playwright（通过 e2e_init 自动配置）

🤝 贡献

欢迎提交 Issue 和 Pull Request！

📄 许可证

MIT © wjj9868