Agent Skills
› ChromeDevTools/chrome-devtools-mcp
ChromeDevTools/chrome-devtools-mcp
GitHub利用Chrome DevTools MCP进行Web无障碍调试与审计。涵盖语义HTML、ARIA标签、键盘导航及色对比度检测,支持Lighthouse自动化审计和辅助技术视角分析。
Install All Skills
npx skills add ChromeDevTools/chrome-devtools-mcp --all -g -y
Skills in Collection (7)
利用Chrome DevTools MCP进行Web无障碍调试与审计。涵盖语义HTML、ARIA标签、键盘导航及色对比度检测,支持Lighthouse自动化审计和辅助技术视角分析。
需要进行网页无障碍性测试或审计
检查语义HTML结构是否正确
验证ARIA标签和焦点状态
排查键盘导航和点击目标问题
npx skills add ChromeDevTools/chrome-devtools-mcp --skill a11y-debugging -g -y
通过 CLI 自动化控制 Chrome 浏览器,支持页面快照、点击、输入及文件上传等操作,用于前端交互测试或网页自动化任务。
需要自动化执行浏览器操作
进行前端页面交互测试
通过命令行批量处理网页内容
npx skills add ChromeDevTools/chrome-devtools-mcp --skill chrome-devtools-cli -g -y
通过MCP集成Chrome DevTools,用于网页调试、故障排查、浏览器自动化、性能分析及网络请求检查。支持页面导航、元素交互及扩展测试,提供标准化的工作流模式以提升效率。
调试Web页面问题
执行浏览器自动化操作
分析页面性能瓶颈
检查网络请求详情
npx skills add ChromeDevTools/chrome-devtools-mcp --skill chrome-devtools -g -y
利用 Chrome DevTools MCP 调试 Cookie、会话状态及认证问题,涵盖 HttpOnly 检查、Session 策略选择及合规性审计。
诊断 401/403 错误
排查认证重定向或会话过期
分析 Cookie/Set-Cookie 头部问题
检查 Cookie 横幅同意合规性
npx skills add ChromeDevTools/chrome-devtools-mcp --skill cookie-debugging -g -y
指导使用 Chrome DevTools MCP 工具调试和优化最大内容绘制(LCP)性能。适用于页面加载慢、核心网页指标优化及理解主内容渲染延迟等场景,提供从性能追踪到瓶颈分析的标准工作流。
询问 LCP 性能问题
页面加载速度慢
Core Web Vitals 优化
主内容渲染延迟
npx skills add ChromeDevTools/chrome-devtools-mcp --skill debug-optimize-lcp -g -y
针对JavaScript/Node.js应用提供内存泄漏诊断与修复指南,利用Chrome DevTools MCP工具进行堆快照捕获、对比及保留链分析,辅助定位客户端或服务端内存问题。
报告高内存使用或OOM错误
需要捕获和比较堆快照
排查内存泄漏原因
npx skills add ChromeDevTools/chrome-devtools-mcp --skill memory-leak-debugging -g -y
针对 Chrome DevTools MCP 服务器连接失败或初始化问题的诊断向导,通过检查配置文件和常见错误模式(如端口查找失败)指导用户修复。
list_pages 调用失败
new_page 调用失败
navigate_page 调用失败
MCP 服务器初始化失败
npx skills add ChromeDevTools/chrome-devtools-mcp --skill troubleshooting -g -y


