Skills
.Work. You
Rest

Chrome DevTools Automation

Community

Automate Chrome for testing, debugging, and performance.

Software Engineering#quality assurance#debugging#browser automation#web testing#chrome devtools#performance analysis
Authoramo-tech-ai
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill automates tedious browser tasks, debugging, and performance analysis using Chrome DevTools MCP. It eliminates manual clicks and inspections, providing quick insights into web app health, performance bottlenecks, and network issues, saving you hours of diagnostic work.

Core Features & Use Cases

  • Browser Automation: Navigate, click, fill forms, and interact with any web page programmatically.
  • Performance Analysis: Record performance traces, measure Core Web Vitals (LCP, CLS), and get AI-powered optimization insights.
  • Network & Console Debugging: Monitor API calls, inspect requests/responses, and catch JavaScript errors and warnings in real-time.
  • Use Case: To quickly check if your homepage loads correctly and has no console errors, simply ask "Run smoke test on homepage" to get an instant report and screenshot.

Quick Start

1. Install Chrome DevTools MCP

npm install -g chrome-devtools-mcp@latest

2. Start dev server

pnpm dev

3. Trigger skill via Claude Code

User: "Test homepage with Chrome DevTools"

Dependency Matrix

Required Modules

chrome-devtools-mcp

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: Chrome DevTools Automation
Download link: https://github.com/amo-tech-ai/medellin-spark/archive/main.zip#chrome-devtools-automation

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.