Playwright MCP Server 使用指南：让 Cursor 拥有浏览器自动化能力

今天分享一下 playwright MCP Server，其提供了浏览器自动化能力，使大型语言模型能够在真实的浏览器环境中与网页交互，

也可以执行任务，例如运行JavaScript、截屏和导航网页元素，同时无缝处理 API 测试以验证端点并确保可靠性。

Cursor配置

在 Cursor 的 Cursor Settings 中找到 MCP，点击右侧上方的 Add new global MCP server 按钮，便自动打开 mcp.json文件，然后将mcp server 的配置信息粘贴进去。

--javascripttypescriptshellbashsqljsonhtmlcssccppjavarubypythongorustmarkdown

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

在MCP页面就可以看到配置的 mcp server 信息。

可以看到 Playwright 的一些tool，列表如下：

start_codegen_session：启动一个新的代码生成会话以记录 Playwright 操作

end_codegen_session：结束代码生成会话并生成测试文件

get_codegen_session：获取有关代码生成会话的信息

clear_codegen_session：清除不生成测试的代码生成会话

playwright_navigate：在浏览器中导航到一个URL，并配置视口和浏览器设置

playwright_screenshot：捕获整个页面或特定元素的截图

playwright_click：单击页面上的元素

pywright_click_and_switch_tab：单击页面上的链接并切换到新打开的标签页

playwright_iframe_click：点击页面中iframe内的元素

playwright_hover：将鼠标悬停在页面的元素上

playwright_fill：填写输入字段

playwright_select：选择带有SELECT标签的元素

playwright_evaluate：在浏览器控制台执行JavaScript

playwright_console_logs：从浏览器中带有过滤选项的控制台日志检索功能，支持检索所有日志类型，例如 - 全部、错误、警告、日志、信息、调试、异常。

playwright_close：关闭浏览器并释放所有资源

playwright_expect_response：要求 Playwright 开始等待 HTTP 响应

playwright_assert_response：等待并验证之前发起的HTTP响应等待操作

playwright_custom_user_agent：为浏览器设置自定义用户代理

playwright_get_visible_text：获取当前页面的可见文本内容

playwright_get_visible_html：获取当前页面的HTML内容

playwright_go_back：在浏览器历史记录中向后导航

playwright_go_forward：在浏览器历史记录中向前导航

playwright_drag：将元素拖动到目标位置

playwright_press_key：按下键盘键

playwright_save_as_pdf：将当前页面保存为PDF文件

实操

我们使用 Playwright 来做一些常见的浏览器操作。

打开一个网页

在cursor中要求打开百度，playwright 启动一个chrome浏览器，并调用了

playwright_navigate打开一个网页，结果如下：

数据搜索

输入 搜索mcpflow，进入第一个网站

playwright通过 playwright_fill以及playwright_click打开MCPFlow这个网站

保存成pdf

在提示词中输入 保存pdf，playwright 会将当前页面所有的内容保存为 PDF。

通过playwright_save_as_pdf工具将页面保存成pdf

我们打开PDF，如图可以看到页面已经被保存。

自动填写表单

首先我们可以通过Cursor要求其帮我们写一个Form表单相关代码，例如：请帮我写一个Form表单，用于收集MCP案例信息，表单信息包含MCP案例、希望达到的效果以及角色（开发者、产品经理或者其他）提交后的结果保存在json文件中

然后运行生成的代码，并测试是否满足我们的要求，可以正常保存。

接下来我们就可以通过playwright来实现自动填写表单，输入：http://localhost:3000/index.html请自己发挥帮我填写表单内容

可以看到自己填充内容实现自动填写表单，最后填写的内容保存在json文件中，如下图：