Bach Ai Tools Chrome Devtools Mcp
- Updated January 4, 2026
- BACH-AI-Tools/chrome-devtools-mcp
bach-ai-tools-chrome-devtools-mcp is a Claude Code plugin that connects your agent to Chrome DevTools over MCP for debugging, automation, and performance analysis.
About
bach-ai-tools-chrome-devtools-mcp is a Claude Code plugin that exposes an MCP server wired to Chrome DevTools so your agent can drive a real browser, inspect DOM and network behavior, and reason about performance problems with evidence. developers shipping web apps, browser extensions, or marketing sites use it when screenshots and source alone are not enough to explain slow loads, flaky interactions, or layout bugs. Install it during Ship when you are profiling before launch or chasing regressions after a deploy. It complements generic coding skills by adding live browser telemetry rather than replacing your test framework. Expect Node or MCP host setup and a Chrome-capable environment; the payoff is faster root-cause analysis on frontend issues without constant manual DevTools tab switching.
- MCP bridge to Chrome DevTools for in-depth page inspection and debugging
- Performance and reliability analysis via Puppeteer-style automation keywords
- Supports automation workflows for reproducing UI issues in the agent loop
- Single-plugin bundle focused on Chrome + MCP integration
Bach Ai Tools Chrome Devtools Mcp by the numbers
- Data as of Jul 7, 2026 (Skillselion catalog sync)
/plugin install bach-ai-tools-chrome-devtools-mcp@BACH-AI-Tools/chrome-devtools-mcpAdd your badge
Show developers this plugin is listed on Skillselion. Paste this into your README.
| Last updated | January 4, 2026 |
|---|---|
| Repository | BACH-AI-Tools/chrome-devtools-mcp ↗ |
What it does
Give Claude Code reliable browser debugging, automation, and performance signals from real Chrome sessions instead of guessing from static code.
Who is it for?
Best when you're shipping web UIs and want the agent to reproduce bugs, read network and performance signals, and iterate without leaving Claude Code.
Skip if: Skip if you only need unit tests with no browser, or backends with no Chrome-based surface to inspect.
What you get
After you register the MCP server, Claude can inspect live Chrome sessions and ground fixes in real runtime data instead of assumptions.
- Registered Chrome DevTools MCP tools available to the agent
- Live browser inspection and automation during debug sessions
- Evidence-backed perf and network findings for frontend fixes
By the numbers
- Plugin count in bundle: 1
- Catalog source: community auto-ingest from BACH-AI-Tools/chrome-devtools-mcp
- Keyword themes: debugging, devtools, performance, puppeteer, mcp
Recommended Plugins
0xbigboss Linear CliLinear CLI built with Zig1
15195999826 LomomarketplaceLomo's Claude Code Plugin Marketplace1
1broseidon MarketplaceCurated collection of Claude Code plugins for fullstack development teams1
4rgon4ut Cc Zig LspZig LSP plugin for Claude Code4
708u TwigSimplify git worktree and branch management with configurable symlinks, change carrying, and cleanup.22
8avalon8 AvalonclaudemarketAvalon 的 Claude Code 插件市场How it compares
MCP browser integration, not a static lint or unit-test skill.
FAQ
Who is Bach Ai Tools Chrome Devtools Mcp for?
and small-team developers using Claude Code on web frontends who need DevTools-level visibility during debug and perf passes.
When should I use Bach Ai Tools Chrome Devtools Mcp?
Use it in Ship when profiling page load, tracing flaky UI, or validating fixes against a real Chrome instance before or after deploy.
How do I add Bach Ai Tools Chrome Devtools Mcp to my agent?
Add the plugin from the BACH-AI-Tools/chrome-devtools-mcp repo in Claude Code, configure the MCP server entry, and ensure Chrome is available on the machine running the tools.