What is Chrome DevTools MCP and what does it do?

Chrome DevTools MCP (Model-Context-Protocol) is a tool that allows AI agents to control and inspect live Chrome browsers, enabling automated browser interactions, debugging, and performance analysis. It acts as a bridge, giving AI coding assistants access to Chrome DevTools functionalities like recording traces, analyzing network requests, and inspecting console messages.

How does Chrome DevTools MCP integrate with AI coding assistants?

Chrome DevTools MCP integrates directly with popular coding assistants like Gemini, Claude, and Cursor, allowing developers to incorporate browser control into their existing AI-powered workflows. This integration enables AI to perform tasks like navigating web pages, clicking elements, filling forms, and analyzing network requests within a live Chrome browser.

What kind of tasks can AI agents automate using Chrome DevTools MCP?

Using Chrome DevTools MCP, AI agents can automate a variety of web development tasks, including input automation, navigation, emulation, performance analysis, network inspection, and debugging. This includes actions like finding the cause of slow page load times or testing new user flows by interacting directly with a live Chrome browser.

What technology does Chrome DevTools MCP use for browser automation?

Chrome DevTools MCP leverages Puppeteer for reliable browser automation, ensuring actions are completed and results are automatically waited for. This allows AI agents to perform tasks like input automation, navigation, and performance analysis with a high degree of reliability.

Which AI coding assistants are compatible with Chrome DevTools MCP?

Chrome DevTools MCP supports a wide range of AI coding assistants and development environments, including Amp, Antigravity, Claude Code, Cursor, Gemini CLI, JetBrains AI Assistant, Visual Studio, and more. This broad compatibility ensures developers can seamlessly integrate browser control into their preferred AI-powered workflows.

Chrome DevTools MCP: AI Automates Web Dev & Debugging

Chrome DevTools for coding agents

Jeff Liu·March 27, 2026·2 min read·GitHub

Key Takeaways

1AI agents control live Chrome browsers.
2Offers in-depth debugging and performance.
3Automates actions using Puppeteer.
4Integrates with Gemini, Claude, Cursor.
5Supports Node.js v20.19 or newer.

AI agents can now control and inspect live Chrome browsers, thanks to the public preview of Chrome DevTools MCP, introduced by Google AI. This Model-Context-Protocol (MCP) server integrates directly with popular coding assistants like Gemini, Claude, and Cursor, transforming web development workflows by automating browser interactions, debugging, and performance analysis. Developers can now offload tedious testing and inspection tasks to AI, accelerating the pace of web innovation.

Unleashing Agent Control on the Browser

Imagine a developer asking their AI assistant to "find out why this page is slow" or "test this new user flow." Instead of merely analyzing code, the AI can now open a live Chrome browser, navigate, click elements, fill forms, and even analyze network requests. This capability comes from Chrome DevTools MCP, a tool that effectively gives AI agents eyes and hands in the browser, making them powerful partners in web development.

The Model-Context-Protocol (MCP) server acts as a bridge, allowing AI coding assistants to access the full suite of Chrome DevTools functionality. This includes recording traces to extract actionable performance insights, analyzing network requests, taking screenshots, and inspecting browser console messages with source-mapped stack traces. This functionality promises to automate web debugging, offering a practical guide for developers.