Google shipped an MCP server that gives AI agents direct access to Chrome DevTools — performance traces, Lighthouse audits, heap snapshots, 29 tools total. But buried in v0.20.0 is an experimental CLI that runs the same capabilities from your terminal without needing an AI agent at all. Here's how to set up both and when to use which.
Google's Chrome DevTools team shipped something in September 2025 that now has 31,800 GitHub stars and 447,000 weekly npm downloads: an MCP server that gives AI coding agents direct access to Chrome's debugging internals.
The pitch is straightforward. AI coding assistants generate code blind — they can't see console errors, network failures, layout bugs, or performance bottlenecks. Chrome DevTools MCP removes that blindfold. An agent can navigate pages, click elements, read console output, capture performance traces, run Lighthouse audits, and take heap snapshots — all through the Model Context Protocol.
But there's a second tool that shipped quietly in v0.20.0 (March 11, 2026) that most of the coverage missed: an experimental Chrome DevTools CLI. Same 29 tools. No AI agent required. Runs from your terminal. Daemon process with shared sessions across invocations.
Both tools solve different problems. Here's what each does and how to get started with both in under 15 minutes.
What the MCP Server Does
Chrome DevTools MCP sits between your AI agent and Chrome. Three layers stack together:
Chrome DevTools Protocol (CDP) — Chrome's native low-level debugger interface
Puppeteer — Node.js automation library that wraps CDP with auto-waits and reliability
MCP Protocol Layer — Wraps everything behind high-level tools that AI agents can call
The execution flow: AI Agent → MCP Client → MCP Server → Puppeteer → CDP → Chrome.
The server exposes 29 tools across six categories:
!MCP server architecture connecting AI agents to Chrome internals
The performance trace compression is worth noting: raw trace files run ~29.8 MB. The MCP server compresses them to ~4 KB summaries using Chrome's built-in PerformanceTraceFormatter — a 7,400:1 compression ratio. The AI gets actionable metrics (LCP, CLS, TTFB, blocking time) without burning context on raw trace data.
What the CLI Does Differently
The Chrome DevTools CLI is the same 29 tools, accessible from your terminal as shell commands. No MCP client. No AI agent. A daemon process manages the browser session, and every chrome-devtools command shares that session.
``bash
Navigate to a page
chrome-devtools navigate_page --url https://example.com
Run a Lighthouse audit
chrome-devtools lighthouse_audit
Same thing, but pipe to jq for scripting
chrome-devtools lighthouse_audit --format=json | jq '.categories.performance.score'
`
Navigate in one command, inspect in the next. The session persists across calls.
The key difference:
!The CLI exposes the same 29 tools directly from your terminal
The CLI matters because not every debugging workflow needs an AI agent in the loop. Sometimes you want to run a Lighthouse audit from a CI pipeline, capture a heap snapshot in a shell script, or quickly check console errors without opening Chrome DevTools manually. The CLI gives you direct access without the overhead of an MCP client.
When to Use Which (and When to Use Neither)
!Choosing the right tool for the right job
DevTools MCP and CLI aren't competing with Playwright or Puppeteer. Playwright is a test framework with cross-browser support and parallel test runners. Puppeteer is a Chrome automation library for scripted workflows. DevTools MCP and CLI are debugging tools — they expose Chrome's internals that Playwright and Puppeteer don't surface (performance traces, heap snapshots, CrUX data).
Security: What to Know Before Connecting
The --autoConnect mode connects to your running Chrome instance — the one with your logged-in sessions, passwords, and cookies. A prompt injection in a malicious web page could theoretically trigger evaluate_script calls that access your authenticated sessions.
Three mitigations worth knowing:
--isolated flag — Launches Chrome with a temporary profile that's auto-cleaned on exit. No cookies, no saved passwords, no cross-contamination.
Dedicated profile — Use --userDataDir to point at a separate Chrome profile you only use for debugging.
--slim mode — Exposes only 3 tools (navigate_page, evaluate_script, take_screenshot) instead of 29. Dramatically reduces the attack surface and token consumption.
!Security considerations for browser debugging tools
Chrome v144+ adds a permission dialog for autoConnect — the MCP server can't silently attach to your browser. But the safest approach is --isolated for anything touching untrusted pages.
Try It Yourself
Set Up the MCP Server (for AI agents)
Prerequisites: Node.js v20.19+ and Chrome v146+.
Option 1: Claude Code (one command)
`bash
claude mcp add chrome-devtools --scope user -- npx -y chrome-devtools-mcp@latest
`
Option 2: Any MCP client (JSON config)
Add to your MCP settings (Claude Code settings.json, Cursor, VS Code Copilot, Gemini CLI, etc.):
`json
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest"]
}
}
}
`
Option 3: Slim mode (fewer tokens, safer)
`json
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest", "--slim", "--headless"]
}
}
}
`
Option 4: Connect to your running Chrome
`json
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest", "--autoConnect", "--channel=stable"]
}
}
}
`
Then enable remote debugging in Chrome: navigate to chrome://inspect/#remote-debugging and toggle it on.
Once configured, ask your AI agent:
• "Navigate to my app and check for console errors"
• "Run a Lighthouse audit on this page"
• "Take a performance trace while I click through the checkout flow"
• "Find why the page takes 4 seconds to load"
Set Up the CLI (for terminal and scripts)
`bash
Install globally
npm install -g chrome-devtools-mcp@latest
Navigate to a page
chrome-devtools navigate_page --url https://your-app.localhost:3000
Check console errors
chrome-devtools list_console_messages
Run Lighthouse and get the performance score
chrome-devtools lighthouse_audit --format=json | jq '.categories.performance.score'
Take a screenshot
chrome-devtools take_screenshot --filePath ./debug-screenshot.png
Start a performance trace, reload the page, stop and analyze
chrome-devtools performance_start_trace --reload true
chrome-devtools performance_stop_trace
Take a heap snapshot for memory leak investigation
chrome-devtools take_memory_snapshot --filePath ./heap.heapsnapshot
`
Every command shares the same browser session. Navigate once, then run as many inspection commands as you need.
!Hands-on setup for both MCP server and CLI
CI Pipeline Example
`yaml
• name: Lighthouse audit
run: |
npx chrome-devtools-mcp@latest --headless &
sleep 2
chrome-devtools navigate_page --url ${{ env.PREVIEW_URL }}
chrome-devtools lighthouse_audit --format=json lighthouse.json
SCORE=$(jq '.categories.performance.score' lighthouse.json)
if (( $(echo "$SCORE < 0.9" | bc -l) )); then
echo "Performance score $SCORE is below 0.9 threshold"
exit 1
fi
`
The Bigger Picture
Chrome DevTools MCP is part of a broader shift: browsers are becoming agent-native infrastructure. Chrome 146 also shipped Web MCP — a protocol where websites declare MCP tools via