前军教程网

中小站长与DIV+CSS网页布局开发技术人员的首选CSS学习平台

016:Puppeteer MCP Server 自动化测试新范式

简介

这是一个基于 Puppeteer 的浏览器自动化服务器,它使大语言模型(LLM)能够与网页进行交互、截取屏幕截图并在真实浏览器环境中执行 JavaScript 代码,从而实现网页自动化操作和内容获取。

核心工具集

导航工具

  • puppeteer_navigate:浏览器导航到指定URL,必需参数url(字符串),可选参数包括launchOptions和allowDangerous(默认false)

页面交互工具

  • puppeteer_screenshot:截取整页或特定元素,支持自定义尺寸(默认800x600)
  • puppeteer_click:通过CSS选择器定位并点击元素
  • puppeteer_hover:通过CSS选择器定位并悬停元素
  • puppeteer_fill:向输入框填入指定值
  • puppeteer_select:操作SELECT标签元素
  • puppeteer_evaluate:在浏览器控制台执行JavaScript代码

应用场景

  • 自动化测试(元素操作+视觉回归)
  • 用户行为模拟(悬停/点击路径记录)
  • 动态网页抓取(结合JS执行能力)

资源访问

  • 控制台日志 (console://logs):访问浏览器的控制台输出
  • 截图 (screenshot://<name>):访问已保存的PNG格式截图

自定义配置

  • 环境变量方式:通过PUPPETEER_LAUNCH_OPTIONS设置,可在MCP配置的env参数中设置
  • 工具调用参数:在调用puppeteer_navigate时传入launchOptions和allowDangerous参数

部署配置

提供两种部署方式:

Docker 部署

  • 使用无头(headless)Chrome
  • 配置示例:
{
  "mcpServers": {
    "puppeteer": {
      "command": "docker",
      "args": ["run", "-i", "--rm", "--init", "-e", "DOCKER_CONTAINER=true", "mcp/puppeteer"]
    }
  }
}

NPX 部署

  • 会打开真实浏览器窗口
  • 配置示例:
{
  "mcpServers": {
    "puppeteer": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-puppeteer"]
    }
  }
}

prompt

导航到页面:<http://localhost:8848/nacos/,点击命名空间,新建一个命名空间,id=123456,命名空间名:二师兄,描述:测试>

相关链接

  • Puppeteer MCP : https://github.com/modelcontextprotocol/servers/tree/main/src/puppeteer

#MCP #Puppeteer #自动化测试

发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言