claudegoodies
Skill

browser-testing-with-devtools

From addyosmani

Tests in real browsers via Chrome DevTools MCP. Use when building or debugging anything that runs in a browser. Use when you need to inspect the DOM, capture console errors, analyze network requests, profile performance, or verify visual output with real runtime data. Requires the chrome-devtools MCP server to be configured.

Facts

Repository
addyosmani/agent-skills
Status
Actively maintained
Last commit
Source file
skills/browser-testing-with-devtools/SKILL.md

Source preview

The instructions Claude Code reads when this skill runs.

# Browser Testing with DevTools

## Overview

Use Chrome DevTools MCP to give your agent eyes into the browser. This bridges the gap between static code analysis and live browser execution — the agent can see what the user sees, inspect the DOM, read console logs, analyze network requests, and capture performance data. Instead of guessing what's happening at runtime, verify it.

## When to Use

- Building or modifying anything that renders in a browser
- Debugging UI issues (layout, styling, interaction)
- Diagnosing console errors or warnings
- Analyzing network requests and API responses
- Profiling performance (Core Web Vitals, paint timing, layout shifts)
- Verifying that a fix actually works in the browser
- Automated UI testing through the agent

**When NOT to use:** Backend-only changes, CLI tools, or code that doesn't run in a browser.

## Setting Up Chrome DevTools MCP

### Installation

Add the following to your project's `.mcp.json` or Claude Code settings:

```json
{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest", "--isolated"]
    }
  }
}
```

`-y` skips the npx install confirmation. By default the server launches Chrome with its own dedicated profile (under `~/.cache/chrome-devtools-mcp/`), separate from your personal browser; `--isolated` goes one step further and uses a temporary profile that
View full source on GitHub →

Other skills