让 AI 编程助手直接操控浏览器：Chrome DevTools MCP 终于来了

你有没有过这种经历：AI 写了半天代码，一跑起来页面样式崩了、接口报错了，可它就是看不懂控制台里的红字。你只好自己打开 DevTools，对着 Network、Console、Performance 面板一顿手操。

现在，这个痛点可以被彻底解决了。

Chrome DevTools MCP 是 Google Chrome 官方团队出品的 MCP Server，直接把 Chrome DevTools 的能力变成 AI 编码助手可调用的工具。简单说，就是让 Claude Code、Cursor、Copilot、Gemini CLI 这些编程 Agent，真正「看得见、摸得着」浏览器。

它能干嘛？我列几个最实用的：

• 自动化调试：Agent 自己截图、看 Console、分析网络请求，不用你再截图发过去
• 性能分析：录制 Performance Trace，自动给出 LCP、CLS、INP 等核心指标优化建议
• 可靠自动化：基于 Puppeteer 控制浏览器，自动等待加载、点击、输入，比手写脚本稳得多
• 跨客户端支持：VS Code、Cursor、Claude Code、JetBrains AI Assistant 全接上了

以前想做浏览器自动化，得自己搭 Playwright、写一大堆选择器，维护成本极高。这个项目把门槛直接打到了「装个 MCP Server 就行」。

对开发者来说，最爽的是它官方维护。不是某个个人爱好者的 side project，而是 Chrome 团队自己出的，更新节奏很稳，2026 年还在持续加功能，比如 memory leak debugging 已经进主线了。

如果你用 Claude Code 或 Cursor 写前端，强烈建议装一个。它不会替代你写代码，但会帮你省掉 80% 的「为什么又崩了」排查时间。

GitHub：https://github.com/ChromeDevTools/chrome-devtools-mcp

GitHub: https://github.com/ChromeDevTools/chrome-devtools-mcp