「Chrome DevTools for agents」把真实 Chrome、Lighthouse 和 DevTools 调试能力接给 AI coding agent

Chrome DevTools for agents 是 Chrome 团队给 AI coding agent 准备的一套 DevTools 接入方式。它的核心思路很直接：让 agent 不只会改代码，还能连接真实 Chrome 浏览器，像人一样打开页面、点击按钮、检查控制台、看网络请求、跑 Lighthouse，再把发现的问题反馈回开发流程。

这件事重要，是因为很多 agent 写完前端代码以后，仍然停在“代码看起来对”的阶段。Chrome DevTools for agents 把验证环节往前推了一步：agent 可以用 MCP server 或 CLI 控制 Chrome，在真实页面里测试响应式布局、地理位置、用户路径和交互状态；也可以连接当前浏览器会话，做实时调试、暂停和排查。对前端项目来说，这比单纯让模型猜 DOM 或读静态文件可靠得多。

官方文档里还把 Lighthouse 放进了主动 QA 场景：agent 可以在提交前跑可访问性、SEO 和性能审计，把低对比度、缺少 alt text、性能瓶颈这类问题提前列成修复清单。文档页给了 Antigravity、Gemini CLI、Claude Code 和 Codex 的安装入口；其他 agent 则可以按 GitHub 仓库里的 MCP client 配置接入。对 Codex 来说，命令就是把 chrome-devtools MCP server 指到 npx chrome-devtools-mcp@latest。

截至这次整理，关联仓库 ChromeDevTools/chrome-devtools-mcp 已有约 40k stars，主语言是 TypeScript，许可证为 Apache-2.0；npm 包 chrome-devtools-mcp 最新版本显示为 1.0.1。官方文档的结构也提醒了一点：这种工具会让 MCP client 看到浏览器实例里的内容，接入前要注意敏感页面、登录态和数据采集设置，不要把真实账号和私密数据随手暴露给 agent。