Can I use this skill with my existing Chrome window?

Yes, you can connect to a running Chrome instance by providing the --browserUrl argument pointing to your local remote debugging port (usually 9222).

Does it support headless mode for CI/CD pipelines?

Absolutely. The skill includes a --headless flag and specific configuration arguments like --no-sandbox to ensure stable operation in containerized environments.

What performance metrics can I analyze with this skill?

You can record full performance traces and extract key insights including First Contentful Paint (FCP), Largest Contentful Paint (LCP), and Cumulative Layout Shift (CLS).

How does Claude 'see' the browser state during automation?

The skill provides tools for taking full-page or viewport screenshots and capturing DOM snapshots, allowing the AI to visually verify page states.

Is it possible to test mobile responsiveness?

Yes, the skill includes specialized emulation tools to simulate mobile devices, specific viewports, and custom user agents to test responsive layouts.

Chrome DevTools Controller

Name: Chrome DevTools Controller
Author: cameronsjo

bycameronsjo

•

브라우저 자동화

Automates browser interactions, performance profiling, and web debugging directly through Chrome DevTools and Puppeteer.

The Chrome DevTools MCP skill empowers AI agents to take full control of Chrome browser instances for automated testing, deep performance analysis, and real-time debugging. By bridging Claude with Puppeteer-based actions, it allows for seamless execution of complex user flows, network traffic inspection, and visual regression testing. Whether you are troubleshooting failing API calls, optimizing Core Web Vitals, or automating repetitive web tasks, this skill provides the precision and diagnostic depth of native Chrome DevTools directly within your AI workflow.

주요 기능

01Device and viewport emulation for responsive design testing

021 GitHub stars

03Full browser automation using Puppeteer-based mouse and keyboard controls

04Comprehensive performance tracing and Core Web Vitals analysis

05Real-time network request inspection and response debugging

06Headless and headful execution modes with isolated profile support

사용 사례

01Debugging complex JavaScript errors and failed network requests

02End-to-end (E2E) automated testing and multi-field form validation

03Auditing website performance metrics and rendering efficiency

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add cameronsjo/claude-marketplace chrome-devtools-mcp

For use in Claude.ai and ChatGPT

Download Skill