chrome-devtools-mcp Skill 技能

chrome-devtools-mcp 是 Google 官方发布的 Chrome DevTools Model Context Protocol 服务器，让 AI 编程助手（Antigravity、Claude、Cursor、Copilot 等）能够控制和分析真实运行的 Chrome 浏览器，实现可靠的浏览器自动化和深度调试。核心功能：1) 性能分析：使用 Chrome DevTools 录制性能轨迹，提取可操作的性能洞察，支持 CrUX 真实用户数据对比；2) 高级浏览器调试：分析网络请求、截取页面截图、检查浏览器控制台消息（含 Source Map 还原的堆栈跟踪）；3) 可靠自动化：基于 Puppeteer 实现自动化操作，自动等待操作结果返回；4) 内存调试：提供堆快照对比、类节点分析、支配者分析、保留路径查询等 12 个专业工具；5) 扩展管理：列出、安装、卸载、触发浏览器扩展操作；6) 网络监控：列出网络请求、获取单个请求详情。共提供 50+ MCP 工具，涵盖输入自动化（10个：click、drag、fill、hover、type_text 等）、导航自动化（6个）、性能（3个）、网络（2个）、调试（8个）、内存（12个）、扩展（5个）、第三方工具（2个）、WebMCP（2个）。支持两种接入模式：直接启动独立 Chrome 实例（默认），或连接到已运行的 Chrome（通过 --browser-url 或 --autoConnect）。适用场景：AI 编程助手执行端到端 Web 测试；自动化填写表单、爬取动态页面、执行 UI 验收测试；性能分析诊断 AI 生成的网页代码质量；深度调试 JavaScript 内存泄漏。安装：npx -y chrome-devtools-mcp@latest，配置各主流 MCP 客户端（Claude Code、Cursor、VS Code、Codex 等均有详细文档）。支持 --slim 精简模式（仅 3 个工具：导航、脚本执行、截图），减少 AI 上下文消耗。Google 官方维护，支持 Chrome 所有主流版本。