OpenSource-Hub

chrome-devtools-mcp

CLI Tool

ChromeDevTools/chrome-devtools-mcp

MCP server giving AI coding agents control of Chrome DevTools.

Overview

Chrome DevTools MCP server that enables AI agents to debug, automate, and analyze Chrome browser performance. Integrates with Puppeteer and Chrome DevTools Frontend for reliable automation and performance insights.

README Preview

# Chrome DevTools for Agents\n\n[](https://npmjs.org/package/chrome-devtools-mcp)\n\nChrome DevTools for Agents (`chrome-devtools-mcp`) lets your coding agent (such as Gemini, Claude, Cursor or Copilot)\ncontrol and inspect a live Chrome browser. It acts as a Model-Context-Protocol\n(MCP) server, giving your AI coding assistant access to the full power of\nChrome DevTools for reliable automation, in-depth debugging, and performance analysis.\nA [CLI](docs/cli.md) is also provided for use without MCP.\n\n## [Tool reference](./docs/tool-reference.md) | [Changelog](./CHANGELOG.md) | [Contributing](./CONTRIBUTING.md) | [Troubleshooting](./docs/troubleshooting.md) | [Design Principles](./docs/design-principles.md)\n\n## Key features\n\n- **Get performance insights**: Uses [Chrome\n  DevTools](https://github.com/ChromeDevTools/devtools-frontend) to record\n  traces and extract actionable performance insights.\n- **Advanced browser debugging**: Analyze network requests, take screenshots and\n  check browser console messages (with source-mapped stack traces).\n- **Reliable automation**. Uses\n  [puppeteer](https://github.com/puppeteer/puppeteer) to automate actions in\n  Chrome and automatically wait for action results.\n\n## Disclaimers\n\n`chrome-devtools-mcp` exposes content of the browser instance to the MCP clients\nallowing them to inspect, debug, and modify any data in the browser or DevTools.\nAvoid sharing sensitive or personal information that you don't want to share with\nMCP clients.\n\n`chrome-devtools-mcp` officially supports Google Chrome and [Chrome for Testing](https://developer.chrome.com/blog/chrome-for-testing/) only.\nOther Chromium-based browsers may work, but this is not guaranteed, and you may encounter unexpected behavior. Use at your own discretion.\nWe are committed to providing fixes and support for the latest version of [Extended Stable Chrome](https://chromiumdash.appspot.com/schedule).\n\nPerformance tools may send trace URLs to the Google CrU

FAQ (2)

Troubleshooting
How to fix 'Navigation timeout' error when using emulate() to set mobile viewport and network throttle simultaneously in chrome-devtools-mcp?

This is a known issue in chrome-devtools-mcp v1.0.1. The network throttle is applied before the navigation timeout multiplier is updated, causing a default 10s timeout when the viewport change triggers a page reload under slow network conditions like Slow 3G. Workaround: split the emulate call into two separate calls. For example, first call emulate with only networkConditions, then a second call with viewport (or vice versa). This avoids the reload occurring without the extended timeout. A permanent fix has been proposed in PR #2134.

GitHub Issue #2115
Troubleshooting
How to bypass the 'Allow remote debugging' permission dialog when using Chrome DevTools MCP?

Use a dedicated Chrome profile with remote debugging enabled. Launch Chrome with: --remote-debugging-port=9222 --user-data-dir=/path/to/profile. Then connect your MCP server to http://127.0.0.1:9222. This avoids the permission dialog because the dedicated profile is pre-authorized for debugging. Recommended for development and testing. The feature to persist permission approval was not implemented due to security concerns.

GitHub Issue #825