Chrome DevTools MCP: Debug the Browser From Your Agent
Reach for Chrome DevTools MCP if you want your coding agent to actually see what a page is doing — real performance traces, network calls, console errors — instead of guessing from the code. Skip it if your work never touches the browser, or you only need scripted automation, where plain Puppeteer or Playwright is lighter than wiring up an MCP server.
When Your Agent Can't See the Rendered Page
A coding agent debugging a web app is usually working blind: it reads your source but can't see the rendered page, the failing network request, or the console error that only shows up at runtime. You end up copy-pasting DevTools output back into the chat by hand, which is slow and loses the source-mapped stack traces that make an error legible.
DevTools Capabilities Exposed as MCP Tools
Chrome DevTools MCP is an open-source (Apache-2.0) Model Context Protocol server, written in TypeScript, that connects a coding agent to a real Chrome browser. It exposes Chrome DevTools capabilities — performance tracing, network and console inspection, screenshots, and Puppeteer-driven automation — as MCP tools, so the agent can inspect and debug a live page. A CLI is also provided for use without MCP.
Built by the Chrome DevTools Team Itself
MCP has become the common way to give AI coding tools real capabilities, and a browser is a key thing to hand an agent. This one comes from the Chrome DevTools team itself, targets the runtime blind spot directly, and works with Claude, Cursor, Copilot, and Antigravity, which is why it's landed with people building agent-driven web workflows.
Traces, Network, Console, and Screenshots
- ✓Performance insights: records Chrome DevTools traces and extracts actionable findings
- ✓Browser debugging: inspects network requests, console messages, and takes screenshots
- ✓Source-mapped stack traces, so runtime errors stay readable
- ✓Puppeteer-based automation that waits for action results automatically
- ✓Works with MCP clients like Claude, Cursor, Copilot, and Antigravity
- ✓A standalone CLI for use without an MCP client
Adding It to Your MCP Client Config
Chrome DevTools MCP is published on npm as `chrome-devtools-mcp`. You add it to your MCP client's config as a server — for example the args `["-y", "chrome-devtools-mcp@latest"]` — and it runs via npx. It officially supports Google Chrome and Chrome for Testing. See the repo's tool reference and troubleshooting docs for client-specific setup.
Letting the Agent Drive Chrome
Once the MCP server is registered with your client, your agent calls its tools to drive Chrome: record a trace, read the network panel, check the console, take a screenshot, or automate a click. Flags let you tune data collection — `--no-usage-statistics` opts out of Google's usage stats and `--no-performance-crux` disables CrUX field-data lookups.
Debugging a Real Runtime Error, Not Just Source
- •Letting an agent record and read a performance trace to find what's slowing a page down
- •Debugging a runtime error from console output with source-mapped stack traces
- •Inspecting failing network requests during an agent-driven fix
- •Automating browser actions in a coding workflow via Puppeteer
Runtime Visibility an Agent Didn't Have Before
- ✓Comes from the Chrome DevTools team, so it tracks real DevTools capabilities
- ✓Gives an agent runtime visibility — performance, network, console — not just source
- ✓Keeps source-mapped stack traces, which makes runtime errors actually debuggable
- ✓Doubles as a CLI, so you can use it without committing to an MCP client
Chrome Only, and Watch What You Expose
- △It exposes browser content to the MCP client, so avoid pointing it at sessions with sensitive or personal data (the README says so directly)
- △Officially supports Google Chrome and Chrome for Testing only; other Chromium browsers may misbehave
- △Usage statistics collection is enabled by default — you opt out with a flag
- △It's a browser-debugging tool; for pure scripted automation, plain Puppeteer or Playwright is a lighter dependency
Skyvern, Page Agent, and Plain Puppeteer
Anyone Debugging Web Apps Through an Agent
Developers who drive a coding agent (Claude, Cursor, Copilot, Antigravity) and want it to debug and profile real pages instead of reasoning from source alone. If your agent work is browser-heavy, the runtime visibility pays off. If you never touch the browser or only need scripted automation, it's more setup than you need.
Chrome DevTools MCP FAQ
Chrome DevTools MCP is an MCP server from the Chrome DevTools team that lets a coding agent control and inspect a live Chrome browser — recording performance traces, reading network and console data, and automating actions with Puppeteer.
The README lists MCP clients such as Claude, Cursor, Copilot, and Antigravity. A CLI is also provided for use without an MCP client.
It officially supports Google Chrome and Chrome for Testing. Other Chromium-based browsers may work but aren't guaranteed, per the README.
Usage statistics are enabled by default and can be disabled with `--no-usage-statistics`. Performance tools may query the Google CrUX API, which you can turn off with `--no-performance-crux`.