Playwright Tools for MCP

Source | HN Comments

文章介绍了用于模型上下文协议 (MCP) 的 Playwright 工具。该工具利用 Playwright 的浏览器自动化能力，提供快速轻量、LLM 友好的网页交互方式，主要功能包括网页导航、表单填写、数据提取和自动化测试。它支持快照模式和视觉模式两种工具模式，并提供了多种工具函数，如点击、悬停、拖拽、输入文本等。文章还介绍了如何在 VS Code 中安装和使用该工具，以及运行无头浏览器和在没有显示器的 Linux 上运行有头浏览器的方法。

用于 MCP 的 Playwright 工具

导航菜单

切换导航登录

产品
解决方案按公司规模
- 企业
- 中小型团队
- 初创公司
- 非营利组织按用例
- DevSecOps
- DevOps
- CI/CD
- 查看所有用例按行业
- 医疗保健
- 金融服务
- 制造业
- 政府
- 查看所有行业查看所有解决方案
资源主题
- AI
- DevOps
- 安全性
- 软件开发
- 查看所有探索
- 学习路径
- 活动和网络研讨会
- 电子书和白皮书
- 客户案例
- 合作伙伴
- 执行见解
开源
- GitHub Sponsors 资助开源开发人员
- The ReadME Project GitHub 社区文章存储库
- 主题
- 趋势
- 集合
企业
定价

搜索或跳转到...

搜索代码、存储库、用户、议题、拉取请求...

搜索清除搜索语法提示

提供反馈

我们会阅读每一条反馈，并认真对待您的意见。包括我的电子邮件地址，以便与我联系取消提交反馈

已保存的搜索

使用已保存的搜索更快地筛选结果

名称查询要查看所有可用的限定符，请参阅我们的文档。取消创建已保存的搜索登录注册重置焦点您已在另一个选项卡或窗口中登录。重新加载以刷新您的会话。您已在另一个选项卡或窗口中注销。重新加载以刷新您的会话。您已在另一个选项卡或窗口中切换帐户。重新加载以刷新您的会话。关闭提醒 {{ message }} microsoft / **playwright-mcp ** 公开

通知您必须登录才能更改通知设置
Fork 145
Star 3.4k

用于 MCP 的 Playwright 工具

许可证

Apache-2.0 license 3.4k stars 145 forks 分支标签活动 Star 通知您必须登录才能更改通知设置

其他导航选项

microsoft/playwright-mcp

main 分支标签转到文件代码

文件夹和文件

名称| 名称| 最后提交消息| 最后提交日期 ---|---|---|---

历史

仓库文件导航

Playwright MCP

一个模型上下文协议 (MCP) 服务器，它使用 Playwright 提供浏览器自动化功能。该服务器使 LLM 能够通过结构化的可访问性快照与网页交互，从而无需屏幕截图或视觉调整模型。

主要功能

快速轻量：使用 Playwright 的可访问性树，而不是基于像素的输入。
LLM 友好：无需视觉模型，仅在结构化数据上运行。
确定性的工具应用：避免了基于屏幕截图的方法常见的歧义。

用例

Web 导航和表单填写
从结构化内容中提取数据
由 LLM 驱动的自动化测试
代理的通用浏览器交互

示例配置

{
 "mcpServers": {
  "playwright": {
   "command": "npx",
   "args": [
    "@playwright/mcp@latest"
   ]
  }
 }
}

在 VS Code 中安装

使用 VS Code CLI 安装 Playwright MCP 服务器：

# For VS Code
code --add-mcp '{"name":"playwright","command":"npx","args":["@playwright/mcp@latest"]}'

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

安装完成后，Playwright MCP 服务器将可用于 VS Code 中的 GitHub Copilot 代理。

运行无头浏览器（没有 GUI 的浏览器）。

此模式对于后台或批量操作很有用。

{
 "mcpServers": {
  "playwright": {
   "command": "npx",
   "args": [
    "@playwright/mcp@latest",
    "--headless"
   ]
  }
 }
}

在没有 DISPLAY 的 Linux 上运行有头浏览器

在没有显示器的系统上或从 IDE 的工作进程运行有头浏览器时，您可以客户端-服务器方式运行 Playwright。您将从具有 DISPLAY 的环境中运行 Playwright 服务器

npx playwright run-server

然后在 MCP 配置中，将以下内容添加到 env：

{
 "mcpServers": {
  "playwright": {
   "command": "npx",
   "args": [
    "@playwright/mcp@latest"
   ],
   "env": {
    // 使用上面服务器输出中的端点。
    "PLAYWRIGHT_WS_ENDPOINT": "ws://localhost:<port>/"
   }
  }
 }
}

工具模式

这些工具以两种模式提供：

快照模式（默认）：使用可访问性快照来获得更好的性能和可靠性
视觉模式：使用屏幕截图进行基于视觉的交互

要使用视觉模式，请在启动服务器时添加 --vision 标志：

{
 "mcpServers": {
  "playwright": {
   "command": "npx",
   "args": [
    "@playwright/mcp@latest",
    "--vision"
   ]
  }
 }
}

视觉模式最适用于计算机使用能够基于提供的屏幕截图与使用 X Y 坐标空间的元素进行交互的模型。

通过自定义传输的编程用法

import { createServer } from '@playwright/mcp';
// ...
const server = createServer({
 launchOptions: { headless: true }
});
transport = new SSEServerTransport("/messages", res);
server.connect(transport);

快照模式

Playwright MCP 提供了一组用于浏览器自动化的工具。以下是所有可用的工具：

browser_navigate
- 描述：导航到 URL
- 参数：
  - url (string)：要导航到的 URL
browser_go_back
- 描述：返回到上一页
- 参数：无
browser_go_forward
- 描述：前进到下一页
- 参数：无
browser_click
- 描述：在网页上执行单击
- 参数：
  - element (string)：人类可读的元素描述，用于获得与元素交互的许可
  - ref (string)：页面快照中的精确目标元素引用
browser_hover
- 描述：将鼠标悬停在页面上的元素上
- 参数：
  - element (string)：人类可读的元素描述，用于获得与元素交互的许可
  - ref (string)：页面快照中的精确目标元素引用
browser_drag
- 描述：在两个元素之间执行拖放操作
- 参数：
  - startElement (string)：人类可读的源元素描述，用于获得与元素交互的许可
  - startRef (string)：页面快照中的精确源元素引用
  - endElement (string)：人类可读的目标元素描述，用于获得与元素交互的许可
  - endRef (string)：页面快照中的精确目标元素引用
browser_type
- 描述：将文本键入可编辑元素
- 参数：
  - element (string)：人类可读的元素描述，用于获得与元素交互的许可
  - ref (string)：页面快照中的精确目标元素引用
  - text (string)：要键入到元素中的文本
  - submit (boolean)：是否提交输入的文本（之后按 Enter 键）
browser_select_option
- 描述：在下拉列表中选择选项
- 参数：
  - element (string)：人类可读的元素描述，用于获得与元素交互的许可
  - ref (string)：页面快照中的精确目标元素引用
  - values (array)：要在下拉列表中选择的值的数组。
browser_press_key
- 描述：按下键盘上的键
- 参数：
  - key (string)：要按下的键的名称或要生成的字符，例如 ArrowLeft 或 a
browser_snapshot
- 描述：捕获当前页面的可访问性快照（比屏幕截图更好）
- 参数：无
browser_save_as_pdf
- 描述：将页面另存为 PDF
- 参数：无
browser_wait
- 描述：等待指定的时间（以秒为单位）
- 参数：
  - time (number)：要等待的时间（以秒为单位）（上限为 10 秒）
browser_close
- 描述：关闭页面
- 参数：无

视觉模式

视觉模式提供用于使用屏幕截图进行基于视觉的交互的工具。以下是所有可用的工具：

browser_navigate
- 描述：导航到 URL
- 参数：
  - url (string)：要导航到的 URL
browser_go_back
- 描述：返回到上一页
- 参数：无
browser_go_forward
- 描述：前进到下一页
- 参数：无
browser_screenshot
- 描述：捕获当前页面的屏幕截图
- 参数：无
browser_move_mouse
- 描述：将鼠标移动到指定的坐标
- 参数：
  - x (number)：X 坐标
  - y (number)：Y 坐标
browser_click
- 描述：在指定坐标处单击
- 参数：
  - x (number)：要单击的 X 坐标
  - y (number)：要单击的 Y 坐标
browser_drag
- 描述：执行拖放操作
- 参数：
  - startX (number)：起始 X 坐标
  - startY (number)：起始 Y 坐标
  - endX (number)：结束 X 坐标
  - endY (number)：结束 Y 坐标
browser_type
- 描述：在指定坐标处键入文本
- 参数：
  - text (string)：要键入的文本
  - submit (boolean)：是否提交输入的文本（之后按 Enter 键）
browser_press_key
- 描述：按下键盘上的键
- 参数：
  - key (string)：要按下的键的名称或要生成的字符，例如 ArrowLeft 或 a
browser_save_as_pdf
- 描述：将页面另存为 PDF
- 参数：无
browser_wait
- 描述：等待指定的时间（以秒为单位）
- 参数：
  - time (number)：要等待的时间（以秒为单位）（上限为 10 秒）
browser_close
- 描述：关闭页面
- 参数：无

关于

用于 MCP 的 Playwright 工具

资源

Readme

许可证

Apache-2.0 license

行为准则

语言

页脚

页脚导航

条款
隐私
安全
状态
文档
联系方式
管理 cookies
不要分享我的个人信息

您现在无法执行该操作。

Playwright Tools for MCP

用于 MCP 的 Playwright 工具

导航菜单

搜索代码、存储库、用户、议题、拉取请求...

提供反馈

已保存的搜索

使用已保存的搜索更快地筛选结果

许可证

microsoft/playwright-mcp

文件夹和文件

最新提交

历史

仓库文件导航

Playwright MCP

主要功能

用例

示例配置

在 VS Code 中安装

运行无头浏览器（没有 GUI 的浏览器）。

在没有 DISPLAY 的 Linux 上运行有头浏览器

工具模式

通过自定义传输的编程用法

快照模式

视觉模式

关于

资源

许可证

行为准则

安全策略

Stars

Watchers

Forks

Releases

Packages 0

Contributors 6

语言

页脚

页脚导航