Chrome DevTools MCP — Browser Debugging for AI Coding Agents

Introduction

Chrome DevTools MCP is an official Model Context Protocol server that exposes Chrome DevTools functionality to AI coding agents. It lets agents inspect DOM elements, read console logs, capture screenshots, monitor network requests, and debug web applications — the same capabilities developers use in Chrome's built-in DevTools, now accessible programmatically through MCP.

What Chrome DevTools MCP Does

• Exposes Chrome DevTools Protocol capabilities via MCP tools
• Allows AI agents to inspect and manipulate the DOM tree
• Captures screenshots and reads console output for debugging
• Monitors network requests and response data in real time
• Enables JavaScript evaluation in the browser context

Architecture Overview

The server connects to a running Chrome or Chromium instance via the Chrome DevTools Protocol (CDP) on a specified debugging port. It translates MCP tool calls into CDP commands and returns structured results. The server acts as a bridge layer, handling session management, target discovery, and protocol translation so AI agents interact with familiar MCP semantics rather than raw CDP.

Self-Hosting & Configuration

• Install via npm and start with a target Chrome debugging port
• Launch Chrome with --remote-debugging-port=9222 to enable CDP
• Configure your AI coding CLI to register this MCP server
• Supports multiple browser tabs and target switching
• Works with Chromium-based browsers including Edge and Brave

Key Features

• Full DOM inspection and element selection for AI agents
• Screenshot capture for visual debugging workflows
• Console log reading and JavaScript evaluation
• Network request monitoring with headers and response bodies
• Built on the standard Model Context Protocol for broad agent compatibility

Comparison with Similar Tools

• Puppeteer — programmatic browser control but not MCP-native
• Playwright — multi-browser automation without MCP integration
• Selenium — established automation but heavier setup and no MCP
• Browser Use — AI browser automation focused on task completion rather than debugging
• Stagehand — AI web automation framework with different abstraction level

FAQ

Q: Which browsers are supported? A: Any Chromium-based browser that supports the Chrome DevTools Protocol, including Chrome, Chromium, Edge, and Brave.

Q: Do I need to install Chrome separately? A: Yes, the MCP server connects to an already running Chrome instance with remote debugging enabled.

Q: Can multiple agents share one browser session? A: The server supports multiple targets (tabs), but concurrent agent access to the same tab requires careful coordination.

Q: Is this officially maintained by Google? A: It is published under the ChromeDevTools GitHub organization and actively maintained.

Sources

• https://github.com/ChromeDevTools/chrome-devtools-mcp
• https://github.com/ChromeDevTools/chrome-devtools-mcp#readme