Can Claude see my local development server?

Absolutely. Once the MCP server is configured, Claude can connect to localhost ports (like 3000 or 5173) to inspect and interact with your running app.

What performance metrics can Claude analyze using this skill?

Claude can measure Core Web Vitals like LCP, CLS, and TBT, run full Lighthouse audits, and analyze network request headers and timings.

Does this skill work within WSL2 environments?

Yes, the skill is specifically designed to handle environment detection and browser launching across Windows, standard Linux distributions, and WSL2.

Do I need to install Chrome manually before using this?

The skill includes verification scripts that check for Chrome. If it's missing, it provides platform-specific commands to help you install it quickly.

Does it support headless browser mode?

Yes, the skill supports both headless mode for automated background tasks and headed mode if you want to see the browser window while Claude works.

Chrome DevTools Integration

Name: Chrome DevTools Integration
Author: henkisdabro

byhenkisdabro

•

Browser Automation

Equips Claude with visual browser access to debug, automate, and audit web applications in real-time.

This skill bridges the gap between Claude's code generation and the running web application by automating the setup of the Chrome DevTools MCP server. It handles platform detection across Windows, Linux, and WSL2, enabling Claude to 'see' your application through screenshots, inspect console errors, analyze network traffic, and measure performance metrics like Core Web Vitals. By giving Claude direct access to the browser environment, developers can verify UI changes, debug complex runtime issues, and perform automated end-to-end testing with high precision.

Key Features

01Comprehensive performance auditing including Core Web Vitals and Lighthouse reports.

02Deep inspection of browser console logs, JavaScript errors, and network API responses.

03User interaction simulation for automated form filling, button clicks, and mobile device emulation.

04Automated environment detection and Chrome installation verification for Windows, Linux, and WSL2.

0514 GitHub stars

06Real-time visual feedback through screenshots, DOM snapshots, and rendered output.

Use Cases

01Identifying and fixing runtime JavaScript errors by accessing the live browser console.

02Debugging complex CSS layouts and responsive design issues by viewing actual browser renders.

03Automating end-to-end user flows to verify application functionality after code changes.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add henkisdabro/wookstar-claude-plugins devtools

For use in Claude.ai and ChatGPT

Download Skill