browser-testing-with-devtools

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.

Quality

83%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Low

Low-risk findings worth noting

Quality

Content

73%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body delivers concrete, well-sequenced debugging workflows with strong verification checkpoints and thoughtful security guidance. It is somewhat verbose and everything sits in one file rather than using progressive disclosure.

Suggestions

Trim explanatory padding — the ASCII content-boundary box, the 'Common Rationalizations' table, and the ERROR/WARN/LOG console-level definitions restate knowledge Claude already has.

Move the detailed security rules, console analysis patterns, and the full test-plan template into reference files (e.g. references/security.md, references/test-plans.md) and link them from the overview to shorten SKILL.md.

Add one or two concrete MCP tool invocation examples (e.g. an actual screenshot or DOM-inspect call) so the actionable guidance extends from setup into execution.

Dimension	Reasoning	Score
Conciseness	Mostly efficient but includes some unnecessary padding — the ASCII content-boundary box, the 'Common Rationalizations' table, and explanatory prose around console levels restate concepts Claude already knows and could be tightened.	3 / 5
Actionability	Provides copy-paste-ready .mcp.json config, concrete numbered workflows with specific checks (e.g. 'PATCH /api/tasks/:id with { status: "completed" }'), and a detailed test-plan template; minor gaps in showing actual MCP tool invocations.	4 / 5
Workflow Clarity	Three clearly sequenced workflows (UI bugs, network, performance) each with explicit verification checkpoints — screenshot before/after comparison, 'Confirm console is clean', and performance re-measure against baseline — plus a final verification checklist.	5 / 5
Progressive Disclosure	Well-organized into clearly headed sections with no nested references, but the ~310-line single file inlines content (detailed security rules, console patterns, test-plan template) that could live in separate bundle files for a leaner overview.	4 / 5
	Total	16 / 20 Passed

Description

92%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description is specific, trigger-rich, and clearly separates what the skill does from when to invoke it. It is concise yet comprehensive, with minimal conflict risk.

Dimension	Reasoning	Score
Specificity	Lists multiple concrete actions — 'inspect the DOM, capture console errors, analyze network requests, profile performance, or verify visual output' — giving comprehensive coverage of the skill's capabilities.	5 / 5
Completeness	Explicitly answers 'what' ('Tests in real browsers via Chrome DevTools MCP') and 'when' with two concrete 'Use when...' trigger clauses covering building, debugging, and specific inspection needs.	5 / 5
Trigger Term Quality	Strong natural phrases users would say ('building or debugging anything that runs in a browser', 'capture console errors', 'profile performance'), though a few common synonyms like 'browser testing' or 'frontend bugs' are absent.	4 / 5
Distinctiveness Conflict Risk	Niche is clearly bounded to Chrome DevTools MCP browser testing with distinct triggers; minimal overlap risk with other skills.	5 / 5
	Total	19 / 20 Passed

Validation

100%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository: addyosmani/agent-skills
Path: skills/browser-testing-with-devtools/SKILL.md
Commit: df1edb2

Reviewed: about 19 hours ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.