# browser-testing-with-devtools

> Tests in real browsers via Chrome DevTools MCP.

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.

- Type: Skill
- Made by: addyosmani
- Category: Developer tools
- Formats: Skills
- Version: 9864d27
- Source: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools
- Page: https://pluginboard.ai/skills/browser-testing-with-devtools

## Works with

- ChatGPT
- Claude
- Gemini
- GitHub Copilot
- Cursor
- Claude Code
- Codex
- Antigravity
- Gemini CLI
- Replit
- OpenClaw
- OpenCode
- Hermes Agent

## Install

### ChatGPT

In ChatGPT: Download the browser-testing-with-devtools folder and zip it, then Plugins → Skills → Create → Upload from your computer. Business and Enterprise plans.

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### Claude

In Claude (web or desktop): Download the browser-testing-with-devtools folder and zip the folder itself, then upload it in Customize → Skills.

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### Gemini

In Gemini: Download the browser-testing-with-devtools folder, then at gemini.google.com click Customize → Skills → Create → Upload and pick the folder (or a .zip of it).

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### GitHub Copilot

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools ~/.copilot/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### Cursor

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools ~/.cursor/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### Claude Code

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools ~/.claude/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

Or all of Addy Osmani's Agent Skills, in Claude Code:

```text
/plugin marketplace add addyosmani/agent-skills
/plugin install agent-skills@addy-agent-skills
```

### Codex

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools ~/.agents/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### Antigravity

In Antigravity: Copy the browser-testing-with-devtools folder into ~/.gemini/config/skills (Antigravity app and IDE) or ~/.gemini/antigravity-cli/skills (Antigravity CLI).

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### Gemini CLI

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools ~/.gemini/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### Replit

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools .agents/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### OpenClaw

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools ~/.openclaw/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### OpenCode

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools ~/.config/opencode/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

### Hermes Agent

Run in your terminal:

```shell
npx -y degit addyosmani/agent-skills/skills/browser-testing-with-devtools ~/.hermes/skills/browser-testing-with-devtools
```

View the folder on GitHub: https://github.com/addyosmani/agent-skills/tree/HEAD/skills/browser-testing-with-devtools

---
From Pluginboard (https://pluginboard.ai).