chrome-devtools-debugging

name	chrome-devtools-debugging
description	Use Chrome DevTools Protocol through Playwright to capture richer browser diagnostics such as console errors, failed requests, coverage, and performance metrics when normal logs are insufficient.
owner	any
trigger	null
version	2

Chrome DevTools Debugging

Use this when browser issues need deeper diagnostics than standard Playwright assertions or console output.

Good Uses

• runtime exceptions that are hard to reproduce from server logs
• failed network requests or suspicious slow responses
• memory or performance regressions
• JS coverage or dead-code investigation
• canvas, WebGL, or rendering issues in Chromium

References

• Read references/chrome-devtools-recipes.md when you need concrete CDP snippets for console capture, failed requests, performance metrics, or JS coverage.
• Keep the SKILL body focused on when CDP is justified; load the reference only for the specific capture you need.

Workflow

1. Start from the smallest useful capture.
2. Add one diagnostic dimension at a time: console, network, performance, then coverage.
3. Prefer short-lived instrumentation around the failing flow instead of broad always-on logging.

Start with the smallest useful capture and add more only when needed.