chrome-devtools-mcp Claude Code Plugin
Claude Code PluginClaude CodeDevelopmentCode Quality, Review & TestingMonitoring & ObservabilityWeb & App DevelopmentThe explanation below is AI-generated. Please verify it against the sources.
chrome-devtools-mcp is an MCP server plugin that lets a coding agent such as Claude Code control and inspect a live Chrome browser instance. According to the README, it uses Puppeteer to automate browser actions and exposes tools for recording performance traces, listing and inspecting network requests, and reading console messages with source-mapped stack traces. For Claude Code, the plugin bundles the MCP server together with skills and is installed through a marketplace command. The tool set documented in the README also covers memory heap snapshot analysis, browser extension management, Lighthouse audits, and device/network emulation. The homepage describes Chrome DevTools as the built-in developer tooling of Google Chrome, and this project connects that tooling to coding agent workflows.
What you can do with chrome-devtools-mcp
- Automate page navigation, clicking, typing, dragging, and form filling in a real Chrome browser
- Record a performance trace and analyze it for insights
- List and inspect individual network requests and responses
- Read console messages and source-mapped stack traces for debugging
- Capture screenshots and structured page snapshots
- Take and compare heap snapshots to investigate memory usage
- Install, reload, or remove browser extensions from the agent session
- Run Lighthouse audits for accessibility, SEO, and best practices
- Emulate viewport size, CPU throttling, and network conditions
- Connect to an already-running Chrome instance via a debugging port or WebSocket endpoint