What does the Chrome DevTools MCP skill do?

It automates the installation and setup of the Chrome DevTools Model Context Protocol server, allowing Claude to connect to and control your Chrome browser for debugging.

Can I use this with other browser tools?

Yes, this skill is specifically designed to chain with other tools like Playwright MCP for a comprehensive browser automation and testing suite.

What are the prerequisites for this skill?

You need a running instance of Chrome with remote debugging enabled, and Node.js with npm installed on your system to run the npx command.

How do I enable remote debugging in Chrome?

You must start your Chrome browser with the flag --remote-debugging-port=9222 to allow the MCP server to establish a connection.

How do I activate the server after installation?

Once the skill has updated your .mcp.json file, you simply need to restart your Claude Code session to activate the Chrome DevTools integration.

Chrome DevTools MCP Installer

Name: Chrome DevTools MCP Installer
Author: theflysurfer

bytheflysurfer

0•

浏览器自动化

Enables advanced browser debugging and inspection by integrating Chrome DevTools Protocol into the Claude Code environment.

The Chrome DevTools MCP Installer skill automates the configuration of the Model Context Protocol (MCP) for Chrome, allowing Claude to interact directly with running browser instances. By configuring your environment to use the Chrome DevTools Protocol via npx, this skill empowers Claude to perform advanced web debugging, inspect live DOM elements, and analyze runtime behavior, effectively bridging the gap between AI-driven development and real-time browser feedback.

主要功能

01Seamless integration with Chrome DevTools Protocol via npx

02Smart merging with existing MCP server configurations

03Automated .mcp.json configuration and management

040 GitHub stars

05Real-time browser inspection and debugging capabilities

06Optimized for advanced browser automation and troubleshooting

使用场景

01Automating DOM inspection and performance analysis directly from Claude

02Setting up a unified workflow for browser-based testing and debugging

03Troubleshooting complex frontend issues by inspecting live browser states

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add theflysurfer/claude-skills-marketplace julien-mcp-chrome-devtools

For use in Claude.ai and ChatGPT

Download Skill