Chrome DevTools MCP Guide: Let Coding Agents Inspect and Debug Chrome
Chrome DevTools MCP is an open-source MCP server maintained by ChromeDevTools. It lets coding agents such as Codex, Claude Code, and Cursor control and inspect a running Chrome browser. Typical uses include reading console and network activity, taking screenshots, interacting with pages, and recording performance traces. This guide is based on the official repository, configuration documentation, and the v1.8.0 release. The installation was not tested end to end in this content run.
What problem does it solve?
A coding agent that can only read source code cannot see the rendered page, browser errors, or the result of a request. Chrome DevTools MCP exposes browser capabilities as tools. An agent can navigate and interact with a page, inspect console messages and network requests, capture screenshots, and run performance traces.
This is useful for development and diagnosis: checking what a form sends, finding a frontend console error, inspecting a page at another viewport, or gathering evidence related to LCP, INP, and CLS. Repeatable end-to-end testing still needs explicit assertions, test data, and stable test code. Connecting an MCP server does not create a reliable test specification by itself.
Requirements
- Node.js LTS, npm, and the current stable Chrome release or newer.
- An MCP-capable coding agent, such as Codex, Claude Code, Cursor, or VS Code.
- A suitable test page. Start without signed-in personal accounts or sensitive browser data.
The project officially supports Google Chrome and Chrome for Testing. Other Chromium-based browsers may work but are not covered by the same support statement. As checked on September 7, 2026, GitHub Releases lists v1.8.0, published on August 25, 2026, as the latest release.
Add the MCP server to Codex or Claude Code
The official Codex CLI command is:
codex mcp add chrome-devtools -- npx chrome-devtools-mcp@latest
For Claude Code:
claude mcp add chrome-devtools --scope user npx chrome-devtools-mcp@latest
The official client configuration guide includes a separate Windows 11 example that starts the package through cmd /c npx -y, supplies the Chrome path environment, and increases the startup timeout. Configuration locations vary by agent, so use the upstream Client Configurations page for the selected client.
@latest follows new releases and is convenient for evaluation. Pin a reviewed package version when reproducibility matters, then manage upgrades intentionally.
Verify the first successful result
Reload the MCP client after adding the server. Ask the agent to inspect a public page without sensitive data, for example by checking the performance of https://developers.chrome.com. The upstream documentation notes that connecting the MCP server does not necessarily launch Chrome immediately. Chrome starts after the first call to a tool that requires a browser.
Confirm that the agent can list or open a page, read a snapshot or console output, and finish one defined task with evidence you can inspect. If the job only needs navigation, script execution, and screenshots, --slim --headless exposes a smaller tool set.
Data access and isolation
The MCP server can expose browser content to its client and can inspect, debug, or modify page data. Do not connect an untrusted client to a browser profile containing email, company administration pages, or personal accounts. For an initial evaluation, --isolated creates a temporary Chrome user-data directory that is removed after the browser closes.
The documentation says usage statistics are enabled by default; --no-usage-statistics opts out. Performance tools may send trace URLs to the Google CrUX API for field data; --no-performance-crux disables that behavior. For narrowly scoped work, review options such as --allowed-url-pattern, including the documented Chrome version requirement.
Network inspection can expose cookies and other sensitive headers. --redact-network-headers redacts some headers considered sensitive, but it does not replace a clean test account and least-privilege browser profile.
When another approach may fit better
For a stable API, a direct API integration is generally easier to verify. If a mature Playwright suite already exists, Chrome DevTools MCP can support exploration and diagnosis without replacing its assertions. Its main value is giving an agent access to current browser state and DevTools diagnostics, rather than replacing every browser testing tool.
Official sources
- Chrome DevTools MCP repository
- Chrome DevTools MCP releases
- Client Configurations
- Configuration options
- Tool reference
License: Apache-2.0. Versions, options, and platform support can change, so verify the upstream documentation before installation.