# Chrome Devtools

> Inspect, debug, and automate Chrome through DevTools, including performance and accessibility.

- **Type:** Skill
- **Install:** `agentstack add skill-fmind-dot-chrome-devtools`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [fmind](https://agentstack.voostack.com/s/fmind)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [fmind](https://github.com/fmind)
- **Source:** https://github.com/fmind/dot/tree/main/skills/chrome-devtools
- **Website:** https://fmind.dev

## Install

```sh
agentstack add skill-fmind-dot-chrome-devtools
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Chrome DevTools

Use Chrome DevTools MCP or its experimental CLI for live browser diagnostics. [playwright](../playwright/SKILL.md) owns repeatable end-to-end journeys; [web-frontend](../web-frontend/SKILL.md) owns platform implementation guidance.

## Setup

Require Node.js LTS, `npm`/`npx`, and supported Chrome. Reuse an available DevTools connection; otherwise follow [mcp-setup](../mcp-setup/SKILL.md) for the active harness. The launch command below uses a reviewed package pin; recheck installed help before updating it.

```bash
npx --yes chrome-devtools-mcp@1.9.0 --isolated --headless --no-usage-statistics --no-performance-crux
```

The MCP client starts that process over stdio. Use a dedicated browser profile. Keep remote debugging on loopback; browser content, network bodies, cookies, screenshots, and traces may expose private data. The two opt-out flags disable MCP usage statistics and CrUX URL lookups respectively.

For shell workflows, the same package exposes `chrome-devtools`; resolve it with `npm exec --yes --package=chrome-devtools-mcp@1.9.0 -- chrome-devtools `. Inspect `status` before starting a daemon, then explicitly start the task's session with `start --workspace="$PWD" --no-usage-statistics --no-performance-crux`. The CLI otherwise starts a persistent daemon automatically and enables unrestricted file access by default. Read `start --help` for the installed flags; do not stop or repurpose another task's daemon.

## Workflow

1. **Identify the target**: list pages and select the intended page ID, URL, viewport, and browser mode. Take a fresh accessibility snapshot before using element UIDs; navigation and rerenders can invalidate them.
1. **Reproduce the symptom**: capture console errors and relevant failed requests, then reduce to the smallest repeatable action. Redact credentials and private request data from artifacts.
1. **Measure performance**: record a bounded trace of the same action before and after a change; preserve CPU/network throttling, cache conditions, viewport, and tool versions. Stop traces you started and save artifacts in the authorized workspace.
1. **Check accessibility**: inspect roles, names, focus order, keyboard operation, and visible contrast. Combine automated checks with manual interaction; an accessibility tree or Lighthouse score alone does not establish WCAG conformance.
1. **Investigate memory and cookies**: compare repeated lifecycle actions and heap snapshots when those tools are available; inspect `HttpOnly`, `Secure`, `SameSite`, and partitioning in the request's actual context. A single heap size or cookie attribute is not a diagnosis.
1. **Verify the fix**: repeat the reproduction and relevant measurements, then add a regression test through the owning project workflow. Close task-owned pages and stop only a daemon created for this task.

## Gotchas

- **Tool availability**: inspect the live tool schema or CLI help before calling a capability; optional categories, page routing, and CLI arguments vary by version.
- **Browser mode**: set headed or headless explicitly for reproducibility; the CLI defaults to headless, which need not match a separately configured MCP connection.
- **Lab versus field**: a local trace measures this run. CrUX field data and lab measurements describe different populations and time windows.

## Official Skills

Upstream: [ChromeDevTools/chrome-devtools-mcp skills](https://github.com/ChromeDevTools/chrome-devtools-mcp/tree/main/skills). Use `skills add ChromeDevTools/chrome-devtools-mcp --list`, then follow the shared [vendor-skill policy](../agent-project/references/vendor-skills.md) for the required guidance.

## Documentation

- [Chrome DevTools for agents](https://github.com/ChromeDevTools/chrome-devtools-mcp) · [CLI](https://github.com/ChromeDevTools/chrome-devtools-mcp/blob/main/docs/cli.md) · [Tool reference](https://github.com/ChromeDevTools/chrome-devtools-mcp/blob/main/docs/tool-reference.md)
- Releases: [chrome-devtools-mcp](https://github.com/ChromeDevTools/chrome-devtools-mcp/releases)
- Companion skills: [mcp-setup](../mcp-setup/SKILL.md), [playwright](../playwright/SKILL.md), [web-frontend](../web-frontend/SKILL.md), [benchmark](../benchmark/references/command-http.md), [quality-assurance](../quality-assurance/SKILL.md).

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [fmind](https://github.com/fmind)
- **Source:** [fmind/dot](https://github.com/fmind/dot)
- **License:** MIT
- **Homepage:** https://fmind.dev

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-fmind-dot-chrome-devtools
- Seller: https://agentstack.voostack.com/s/fmind
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.
