🚀 Playwright MCP Server 🎭

Playwright MCP Server 是一个基于 Model Context Protocol 的服务器，借助 Playwright 提供浏览器自动化功能。该服务器能让大语言模型（LLMs）与网页进行交互，实现截图、生成测试代码、网页数据抓取以及在真实浏览器环境中执行 JavaScript 等操作。

特别感谢

特别感谢 Warp，开发者的 AI 终端，它支持 MacOS、Linux 和 Windows 系统。

截图展示

文档与 API 参考

• 文档
• API 参考

🚀 快速开始

以下将详细介绍 Playwright MCP Server 的安装、配置、测试等内容。

✨ 主要特性

• 支持大语言模型（LLMs）与网页交互。
• 具备截图、生成测试代码、网页数据抓取和执行 JavaScript 等功能。
• 支持多种安装方式，包括 npm、mcp-get 和 Smithery。
• 可在 VS Code 中方便地安装和使用。

📦 安装指南

你可以使用 npm、mcp-get 或 Smithery 来安装该软件包：

使用 npm 安装

npm install -g @executeautomation/playwright-mcp-server

使用 mcp-get 安装

npx @michaellatman/mcp-get@latest install @executeautomation/playwright-mcp-server

使用 Smithery 安装

若要通过 Smithery 自动为 Claude Desktop 安装 Playwright MCP，可使用以下命令：

npx @smithery/cli install @executeautomation/playwright-mcp-server --client claude

在 VS Code 中安装

你可以通过以下方式在 VS Code 中安装 Playwright MCP 服务器：

• 使用按钮安装（链接如下）：

  • 安装链接 1
  • 安装链接 2

• 使用 VS Code CLI 安装：

# 对于 VS Code
code --add-mcp '{"name":"playwright","command":"npx","args":["@executeautomation/playwright-mcp-server"]}'

# 对于 VS Code Insiders
code-insiders --add-mcp '{"name":"playwright","command":"npx","args":["@executeautomation/playwright-mcp-server"]}'

安装完成后，ExecuteAutomation Playwright MCP 服务器即可在 VS Code 中与 GitHub Copilot 代理配合使用。

📚 详细文档

配置 Playwright 服务器

以下是在 Claude Desktop 中使用 Playwright 服务器的配置示例：

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["-y", "@executeautomation/playwright-mcp-server"]
    }
  }
}

测试相关

本项目使用 Jest 进行测试，测试文件位于 src/__tests__ 目录下。

运行测试

你可以使用以下命令运行测试：

# 使用自定义脚本运行测试（包含覆盖率）
node run-tests.cjs

# 使用 npm 脚本运行测试
npm test           # 不包含覆盖率运行测试
npm run test:coverage  # 包含覆盖率运行测试
npm run test:custom    # 使用自定义脚本运行测试（与 node run-tests.cjs 相同）

测试覆盖率报告将生成在 coverage 目录中。

运行评估

评估包会加载一个 mcp 客户端，然后运行 index.ts 文件，因此测试之间无需重新构建。你可以通过在 npx 命令前添加环境变量来加载环境变量。完整文档可参考 此处。

OPENAI_API_KEY=your-key  npx mcp-eval src/evals/evals.ts src/tools/codegen/index.ts

项目星标历史