AI导哈

Playwright自动化测试工具

一个轻量级、零配置的Playwright自动化测试工具包，适用于所有AI集成开发环境，支持API、UI和端到端测试。

  • by DivyamPant2803
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 DivyamPant2803/playwright-mcp-automation

使用说明

@剧作家mcp/自动化

轻量级Playwright MCP自动化包-零配置，适用于所有AI IDE

快速入门（2分钟）

# Install
npm install -D @playwright-mcp/automation

# Initialize (auto-detects everything)
npx playwright-mcp-init

# Done! Start using prompts in your AI IDE

特性

  • ✅ 零配置：使用智能默认值即可开箱即用
  • ✅ 轻量级：小于5MB的包大小
  • ✅ 通用：适用于所有AI IDE（游标、VS代码+复制副本、JetBrains、Codeium等）
  • ✅ 自动检测：自动检测项目类型、端口、框架
  • ✅ 智能默认值：除非需要自定义，否则不需要配置文件

安装

npm install -D @playwright-mcp/automation
npx playwright-mcp-init

就是这样！该套餐将：

  • 自动检测你的项目类型（React、Vue、Angular、.NET、Node.js）
  • 自动检测API和UI URL
  • 创建测试目录
  • 生成剧作家配置
  • 为IDE配置MCP服务器

使用AI IDE

通用提示格式

工作原理相同 所有AI IDE （光标、VS代码+复制副本、JetBrains AI、Codeium等）：

重要提示： 这些提示遵循 两阶段方法:

  1. 第一阶段-执行：使用MCP工具在浏览器/API中立即执行测试（实时运行测试）
  2. 第二阶段-发电：执行后，根据执行的内容生成Playwright测试文件（.spec.ts）
Using @playwright-mcp/automation prompts, execute API tests for /api/users

Using the UI test generation prompt from @playwright-mcp/automation, perform ui automation and execute tests for the users page

Using the E2E test prompt from @playwright-mcp/automation, execute tests for the complete user registration flow

示例：API测试

Using @playwright-mcp/automation API prompt, generate tests for:
- Endpoint: /api/users
- Methods: GET, POST, PUT, DELETE
- Test scenarios: CRUD operations, validation errors, edge cases

示例：UI测试

Using the UI test generation prompt from @playwright-mcp/automation, perform ui automation and execute tests for:
- URL: http://localhost:5173/users
- Test scenarios: 
  - Form submission, data display, navigation
  - Form validation, success messages, error states

注： AI将首先使用MCP工具在浏览器中立即执行测试，然后根据执行的步骤生成测试文件。

示例：E2E测试

Using @playwright-mcp/automation E2E prompt, generate tests for:
- Journey: User registration → Email verification → Login → Dashboard
- Validate: Data consistency between UI and API at each step

CLI命令

# Initialize (one-time setup)
npx playwright-mcp-init

# Run tests
npx playwright-mcp-test          # Run all tests
npx playwright-mcp-test api      # Run API tests only
npx playwright-mcp-test ui       # Run UI tests only
npx playwright-mcp-test e2e      # Run E2E tests only

# Generate test prompts
npx playwright-mcp-generate api  # Show API test generation prompt
npx playwright-mcp-generate ui   # Show UI test generation prompt
npx playwright-mcp-generate e2e  # Show E2E test generation prompt

配置（可选）

该软件包适用于 零配置。配置文件仅用于自定义：

// playwright-mcp.config.js (optional)
export default {
  // All values auto-detected, only override if needed
  projectType: 'react',
  api: {
    url: 'http://localhost:5000',
  },
  ui: {
    url: 'http://localhost:5173',
  },
};

IDE支持

光标

  • 自动检测和配置
  • MCP配置生成于 .cursor/mcp.json
  • 安装后重新启动Cursor

VS代码+GitHub副本

  • 自动检测和配置
  • 配置已添加到 .vscode/settings.json
  • 为VS代码安装MCP扩展
  • 重新加载窗口

JetBrains人工智能

  • 自动检测和配置
  • 配置生成于 .idea/mcp.xml
  • 安装MCP插件
  • 重启IDE

科迪姆

  • 使用VS代码配置
  • 适用于Codeium扩展

任何其他AI IDE

  • 提示普遍有效
  • 如果需要，手动配置MCP服务器
  • 有关设置说明，请参阅文档

项目检测

软件包会自动检测：

  • 项目类型：React、Vue、Angular。NET、Node.js
  • 框架：Vite、Webpack、CRA、Express、FastAPI
  • 港口：扫描通用端口（3000、5000、5173、8000）
  • 网址：来自package.json脚本和.env文件
  • 集成开发环境：光标、VS代码、JetBrains

可用的MCP工具

  • playwright_navigate：导航到URL
  • playwright_click：单击元素
  • playwright_fill：填写表单输入
  • playwright_screenshot：捕获屏幕截图
  • playwright_api_request：发出API请求
  • playwright_wait_for：等待条件
  • playwright_get_text：提取文本内容
  • playwright_assert：断言条件

封装结构

@playwright-mcp/automation/
├── prompts/universal/    # IDE-agnostic prompts
├── mcp-server/          # Bundled MCP server
└── dist/                # Compiled code

需求

  • Node.js 20+
  • 剧作家（同伴依赖）
  • TypeScript（可选，对等依赖）

安全考虑

MCP服务器安全

Playwright MCP服务器是为 仅限本地使用。它不包括身份验证或授权机制。

重要安全注意事项：

  • ✅ 服务器应仅在本地主机上运行
  • ✅ 切勿将MCP服务器暴露于公共互联网
  • ✅ 服务器通过stdio进行通信，stdio对本地使用是安全的
  • ⚠️ 如果您需要网络访问，请实施适当的身份验证

环境变量

以下环境变量控制安全设置：

  • ALLOWED_API_HOSTS：允许的API主机的逗号分隔列表（防止SSRF）
  • ALLOWED_UI_DOMAINS：允许的UI域的逗号分隔列表
  • ALLOW_LOCALHOST：设置为 true 允许本地主机连接（默认值：false）
  • API_REQUEST_TIMEOUT：API请求的超时时间（以毫秒为单位）（默认值：30000）
  • SCREENSHOT_OUTPUT_DIR：屏幕截图输出目录（默认： ./test-results/screenshots)
  • NODE_ENV：设置为 production 启用生产安全设置

安全功能

  • ✅ 所有文件操作的路径遍历保护
  • ✅ 带有URL验证的SSRF保护
  • ✅ 防止HTTP标头注入
  • ✅ 输入验证和净化
  • ✅ 错误消息清理（生产中没有堆栈跟踪）
  • ✅ 请求超时以防止DoS
  • ✅ API响应的内容类型验证

许可证

麻省理工学院

支持

  • 文档：参见 prompts/universal/README.md 以便迅速使用
  • 问题：检查故障排除部分
  • IDE设置：请参阅文档中的IDE特定指南

相关 MCP