browser-testing-with-devtools

github:addyosmani/agent-skills · first seen 2026-10-30 · source · badge

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.

Works with

performance-optimization
Shares devtools, chrome, console, performance0.27

webapp-testing
Shares dom, browser, debugging, testing0.15

debugging-and-error-recovery
Shares debugging, guessing, console, logs0.15

playwright-interactive
Shares debugging, console, browser, interaction0.14

playwright
Shares debugging, browser, dom, real0.13

Used with

performance-optimization
Shares devtools, chrome, console, performance0.27

webapp-testing
Shares dom, browser, debugging, testing0.15

debugging-and-error-recovery
Shares debugging, guessing, console, logs0.15

playwright-interactive
Shares debugging, console, browser, interaction0.14

Skill Health 100 (freshness and quality) estimated by backskills

Listed, not yet scored. This skill has no public model test yet. It is in the scoring queue; submitted skills go first, then the most-installed.

Freshness 100 · Quality 100 · Efficacy not yet tested

Version history

2026-10-31T09:00:38+00:00 · sha256 e28dd45416e6

2026-10-30T20:36:17 · sha256 4e3aacd6a380

Diff at 2026-10-31T09:00:38+00:00

--- previous
+++ current
@@ -136,6 +136,8 @@
    ├── Confirm console is clean
    └── Run automated tests
 ```
+
+After a viewport or font change, measure layout only after fonts and resize observers have settled.
 
 ### For Network Issues