用途:通过 chrome-devtools-mcp 调用 Chrome DevTools Protocol,对网页进行自动化测试与性能分析,覆盖性能、网络、无障碍、响应式与交互自动化。
主要能力:性能分析可采集 Core Web Vitals(INP≤200ms、LCP≤2.5s、CLS≤0.1,TBT 仅为实验室代理指标),支持 trace 启停与洞察分析;网络监控可列出请求、查看详情并导出 HAR v1.2;无障碍检查通过 take_snapshot 获取含 UID、角色、名称与 ARIA 属性的可访问性树;响应式测试支持视口尺寸、网络限速(Offline/Slow 3G/Fast 4G 等)、CPU 节流 1-20 倍与截图;浏览器自动化支持点击、填写、表单填充、悬停、拖拽、上传、对话框处理、导航、等待与多标签/框架管理。
使用方式:安装命令为 claude mcp add chrome-devtools npx chrome-devtools-mcp@latest,可用 claude mcp list 验证。配置项包括 --isolated(推荐,创建临时用户目录并自动清理)、--headless、--viewport、--channel(stable/canary/beta/dev)、--browserUrl、--wsEndpoint、--user-data-dir、--logFile 等。
适用场景:性能回归测试、网络请求分析、WCAG 无障碍验证、多断点响应式检查、表单与交互自动化。
限制:仅支持 Chrome/Chromium(不支持 Firefox、Safari、旧版 Edge),需 Node.js v20.19 或更新版本;浏览器在首次使用工具时启动,而非 MCP 连接时;默认共享用户数据目录且不自动清理;所有浏览器内容会暴露给 MCP 客户端,避免敏感数据;--acceptInsecureCerts 有安全风险,仅限开发测试;macOS 某些客户端可能需要完全磁盘访问权限。