什么是 browser-testing-with-devtools?
在构建或调试在浏览器中运行的任何内容时使用。当您需要检查 DOM、捕获控制台错误、分析网络请求、分析性能或通过 Chrome DevTools MCP 使用真实运行时数据验证视觉输出时使用。 来源:addyosmani/agent-skills。
在构建或调试在浏览器中运行的任何内容时使用。当您需要检查 DOM、捕获控制台错误、分析网络请求、分析性能或通过 Chrome DevTools MCP 使用真实运行时数据验证视觉输出时使用。
通过命令行快速安装 browser-testing-with-devtools AI 技能到你的开发环境
来源:addyosmani/agent-skills。
Use Chrome DevTools MCP to give your agent eyes into the browser. This bridges the gap between static code analysis and live browser execution — the agent can see what the user sees, inspect the DOM, read console logs, analyze network requests, and capture performance data. Instead of guessing what's happening at runtime, verify it.
When NOT to use: Backend-only changes, CLI tools, or code that doesn't run in a browser.
| Tool | What It Does | When to Use |
在构建或调试在浏览器中运行的任何内容时使用。当您需要检查 DOM、捕获控制台错误、分析网络请求、分析性能或通过 Chrome DevTools MCP 使用真实运行时数据验证视觉输出时使用。 来源:addyosmani/agent-skills。
为搜索与 AI 引用准备的稳定字段与命令。
npx skills add https://github.com/addyosmani/agent-skills --skill browser-testing-with-devtools在构建或调试在浏览器中运行的任何内容时使用。当您需要检查 DOM、捕获控制台错误、分析网络请求、分析性能或通过 Chrome DevTools MCP 使用真实运行时数据验证视觉输出时使用。 来源:addyosmani/agent-skills。
打开你的终端或命令行工具(如 Terminal、iTerm、Windows Terminal 等) 复制并运行以下命令:npx skills add https://github.com/addyosmani/agent-skills --skill browser-testing-with-devtools 安装完成后,技能将自动配置到你的 AI 编程环境中,可以在 Claude Code、Cursor 或 OpenClaw 中使用
https://github.com/addyosmani/agent-skills