Chrome DevTools MCP

What does this agent do, and when should you use it?

Chrome DevTools MCP is an MCP server for coding agents, accompanied by a CLI for workflows that do not use MCP. It drives Chrome through Puppeteer and uses Chrome DevTools to collect performance traces, inspect network traffic and console output, examine page state, and analyze heap snapshots. Agents can navigate pages, complete forms, execute scripts, capture screenshots, emulate environments, and return diagnostic evidence to their client. The server can launch a dedicated Chrome profile or connect to an existing browser through automatic discovery, a remote-debugging URL, or a WebSocket endpoint. It suits development and testing workflows that need real-browser evidence, but it exposes browser contents to the MCP client and officially supports only Google Chrome and Chrome for Testing.

An MCP client starts chrome-devtools-mcp, which launches Chrome when a browser-dependent tool is first invoked or connects to an existing instance with --autoConnect, --browser-url, or --wsEndpoint. The agent operates pages with tools such as navigate_page, click, fill_form, press_key, and upload_file, runs page code through evaluate_script, and reads state through take_snapshot, take_screenshot, console, and network-request tools. A performance workflow combines performance_start_trace, performance_stop_trace, and performance_analyze_insight; memory tools capture, compare, and inspect heap snapshots. Configuration can additionally expose Lighthouse, extension, PWA, WebMCP, third-party developer-tool, and screencast functions, although several are experimental or require extra dependencies. Results are returned to the MCP client, while the included CLI provides a non-MCP interface.

1. A frontend developer asks a coding agent to reproduce an interaction and correlate console errors with source-mapped stack traces.
2. A performance engineer records a Chrome trace for a target site and extracts actionable insights, optionally supplemented with CrUX field data.
3. A test engineer automates navigation, clicks, form entry, uploads, and screenshots in a real Chrome session to validate a critical user journey.
4. A web developer inspects request listings and individual network requests while diagnosing API failures or resource-loading problems.
5. An engineer investigating memory growth enables the experimental memory tools to compare heap snapshots and inspect dominators, retainers, and duplicate strings.
6. A team running its coding agent in a sandbox connects the MCP server to Chrome on the host through a debugging port or WebSocket endpoint.

How do you install or deploy this agent?

Install an LTS release of Node.js, npm, and the current stable or newer Google Chrome; Chrome for Testing is also officially supported. Add this configuration to an MCP client:

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest"]
    }
  }
}

Codex can register the server directly:

codex mcp add chrome-devtools -- npx chrome-devtools-mcp@latest

For Claude Code, install it at user scope:

claude mcp add chrome-devtools --scope user npx chrome-devtools-mcp@latest

For basic navigation, script execution, and screenshots only, enable slim headless mode:

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest", "--slim", "--headless"]
    }
  }
}

The basic setup does not document any required API credentials. Authenticated sites still require suitable browser login state, and an authenticated WebSocket connection can receive custom headers through --wsHeaders.

How do you use this agent?

Start the configured MCP client and submit the documented first test prompt:

Check the performance of https://developers.chrome.com

The server starts Chrome only after the client invokes a tool that needs it, then records the performance trace. To connect to an already running browser, configure the debugging URL:

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": [
        "chrome-devtools-mcp@latest",
        "--browser-url=http://127.0.0.1:9222"
      ]
    }
  }
}

Then launch Chrome with remote debugging and a non-default profile; for Linux:

/usr/bin/google-chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable

When multiple agents share one server, add --experimentalPageIdRouting so page-scoped calls can target a pageId. For separate sessions that should not share the default Chrome profile directory, also use --isolated.

What are this agent's strengths and limitations?

How does this agent compare with similar options?

Key facts side by side with the most closely related agents.

How does FollowAgents rate this agent?

Recent releases

Latest entries from the project's GitHub Releases. Notes are quoted from upstream as written, not rewritten or tested by FollowAgents.

1. chrome-devtools-mcp-v1.11.0 chrome-devtools-mcp: v1.11.0 2026-10-15
   Release notes excerpt

   [1.11.0](https://github.com/ChromeDevTools/chrome-devtools-mcp/compare/chrome-devtools-mcp-v1.10.1...chrome-devtools-mcp-v1.11.0) (2026-10-15) 🎉 Features * add --file-navigations flag to reject file: URL navigations ([#2853](https://github.com/ChromeDevTools/chrome-devtools-mcp/issues/2853)) ([54cae57](https://github.com/ChromeDevTools/chrome-devtools-mcp/commit/54cae57bcfae752f80cab2f02fd802c3bcb740ec)) …

   View on GitHub ↗
2. chrome-devtools-mcp-v1.10.1 chrome-devtools-mcp: v1.10.1 2026-09-23
   Release notes excerpt

   [1.10.1](https://github.com/ChromeDevTools/chrome-devtools-mcp/compare/chrome-devtools-mcp-v1.10.0...chrome-devtools-mcp-v1.10.1) (2026-09-23) 🛠️ Fixes * build: resolve node export conditions in rollup bundle ([#2814](https://github.com/ChromeDevTools/chrome-devtools-mcp/issues/2814)) ([d7c9b55](https://github.com/ChromeDevTools/chrome-devtools-mcp/commit/d7c9b55490d0be66f1d8c77711aaf6854af8ceb7))

   View on GitHub ↗
3. chrome-devtools-mcp-v1.10.0 chrome-devtools-mcp: v1.10.0 2026-09-23
   Release notes excerpt

   [1.10.0](https://github.com/ChromeDevTools/chrome-devtools-mcp/compare/chrome-devtools-mcp-v1.9.0...chrome-devtools-mcp-v1.10.0) (2026-09-23) 🎉 Features * add css formatter class ([#2707](https://github.com/ChromeDevTools/chrome-devtools-mcp/issues/2707)) ([f0b5fa4](https://github.com/ChromeDevTools/chrome-devtools-mcp/commit/f0b5fa4bde0afa30c53996ec0f987af6b6ab28ac)) * add get_css_style tool ([#2612](https://github.com/ChromeDevTools/chrome-devtools-mcp/issues/2612)) ([4454ae0](https://github.com/ChromeDevTools/chrome-devtools-mcp/commit/4454ae0a8a3d6072ea52d8931a9562907e8dbaae)) …

   View on GitHub ↗

FAQ