What problem does it solve?
Playwright's high-level API does not expose advanced Chrome DevTools Protocol features like performance tracing, heap snapshots, source-mapped stack traces, and deep network response inspection, leaving developers without a straightforward way to access these critical debugging capabilities within their existing Playwright workflows.
Core Features & Use Cases
- Native CDP Access via Playwright: Use Playwright's built-in newCDPSession method to send Chrome DevTools Protocol commands directly, avoiding the overhead and fragility of external raw websocket tools like websocat.
- Advanced Diagnostic Recipes: Pre-built code snippets for common high-value tasks including performance trace capture, source-mapped exception logging, network response body filtering, and heap snapshot generation for memory leak diagnosis.
- Real-World Use Case: When debugging an intermittent performance regression in a single-page application, use this skill to capture a full Chrome trace of a critical user flow to identify rendering bottlenecks that standard Playwright metrics cannot surface.
Quick Start
Use the chrome-devtools-deep skill to capture a performance trace of a user checkout flow on your test e-commerce page to identify rendering bottlenecks.
