Playwright Toolkit

Audits Progressive Web App readiness: manifest validation, service worker status and scope, offline capability test, HTTPS enforcement, installability criteria, push notification permission, and cache strategy analysis. Produces a PWA scorecard with pass/fail per criterion.

Comprehensive SEO audit: meta tags, Open Graph/Twitter Card validation, heading hierarchy, image alt coverage, structured data (JSON-LD) extraction, hreflang, internal/external link analysis, and robots.txt/sitemap.xml checking.

Analyze all forms on a page: validation states, autocomplete attribute coverage, label/input association, required field audit, submission behavior interception, password field security, and ARIA attributes on custom controls.

Capture timed screenshots during page load, overlay with network waterfall data, and produce a visual narrative of the loading experience with annotated filmstrip.

Comprehensive security posture audit: TLS certificate validation, CSP analysis, mixed content detection, cookie security flags, SRI checks, security headers (HSTS, X-Frame-Options), and open redirect detection via CDP Security and Audits domains.

Detect the frontend framework (React, Vue, Angular, Svelte) and inspect application state: React fiber tree traversal with component props/state/hooks via __REACT_DEVTOOLS_GLOBAL_HOOK__, Vue instance tree via __VUE__, and store inspection for Redux, Vuex, Pinia, Zustand, MobX, and Jotai. Supports state snapshots before/after user actions for diffing.

Test light and dark color scheme rendering by emulating prefers-color-scheme via CDP, capturing screenshots in both modes, computing WCAG 2.1 contrast ratios for all visible text, detecting hardcoded colors that ignore scheme changes, and validating color-scheme meta/CSS declarations.

Compare two URLs (or same URL at different viewports, or before/after deployment) visually and structurally using pixel diffing and accessibility tree comparison.

Dump and analyze all client-side storage: localStorage, sessionStorage, cookies with full attributes, IndexedDB schemas and record counts, Cache API contents, and storage quota usage via CDP Storage and IndexedDB domains.

Monitor WebSocket connections via CDP: lifecycle events, message payloads with JSON auto-parse, frequency and size analysis, latency measurement, reconnection tracking, and Socket.IO/engine.io protocol detection.

Profile CSS and JS animations: identify all running animations via CDP Animation domain, measure frame rates with requestAnimationFrame, detect expensive layout-triggering property animations vs compositor-only, audit will-change usage, and detect jank via long-animation-frame entries.

Identify which DOM subtrees cause excessive mutations and jank by injecting MutationObserver and Long Animation Frame instrumentation. Correlates DOM churn with long frames to pinpoint the source of visual instability.

Audits font loading behavior: FOIT/FOUT detection via timed screenshots, font-display validation per family, font file sizes and format efficiency (WOFF2 vs WOFF vs TTF), preload link validation, unused font declarations, and subsetting opportunities. Produces a font-by-font report with loading timeline and recommendations.

Categorizes every third-party script by type (analytics, ads, social, tag managers, CDN libraries, fonts). Measures blocking time per script via Long Task attribution, byte weight per category, render-blocking identification, and connection cost per unique domain. Produces an impact breakdown report.

Set up request interception to mock API responses: record real responses for baseline, replay them deterministically, modify response fields, add latency per endpoint, simulate errors, and persist mocks across navigation. Supports both Playwright page.route() and CDP Fetch domain for lower-level control.

Capture and categorize all console output with stack traces, source attribution, frequency deduplication, and temporal grouping. Uses CDP Runtime and Log domains for browser-level entries and unhandled exceptions.

Collect CSS rule usage via Chrome DevTools Protocol (CDP) and report per-stylesheet coverage with unused selector analysis.

Detect JavaScript memory leaks by measuring JS heap size and DOM node count across repeated interactions. Uses CDP HeapProfiler.collectGarbage for forced GC, analyzes growth trends, and reports leak rate per iteration.

Audit keyboard navigation by tabbing through a page, capturing focus state at each stop, and running axe-core for WCAG violations.

Measure Core Web Vitals (LCP, INP, CLS) with full attribution across mobile, tablet, and desktop viewports. Produces a multi-viewport report card with pass/fail grades, element-level attribution, and annotated screenshots.

Compute a composite 0-100 efficiency score using JS/CSS coverage, render-blocking resources, transfer size, and navigation timing via CDP.

Track element visibility during scroll using IntersectionObserver and generate an exposure heatmap showing which content users actually see.

Test application resilience by injecting failures: offline mode, blocked resources, API error responses (500/403/timeout), JS exceptions, localStorage quota exceeded, and slow network (3G). Captures app response to each failure including error UI, console errors, and graceful degradation.

Analyzes every image on a page: format efficiency (WebP/AVIF vs legacy), dimension vs display size ratio, lazy loading correctness, responsive images (srcset/sizes/picture), above-fold images that should not be lazy, total weight with savings estimate, missing width/height (CLS risk), and broken images. Produces an image-by-image report with actionable recommendations.

Tests a page across a six-device viewport matrix (Mobile S/M/L, Tablet, Desktop, Ultrawide). For each viewport captures a screenshot, detects active CSS media queries, checks horizontal overflow, validates touch targets (min 48x48), font readability (min 16px body), viewport meta tag, and image srcset/sizes. Produces a comparison table with per-viewport issue counts.

Record video of browser interactions, extract frames at scene-change boundaries, pixel-diff consecutive frames, and produce a filmstrip of meaningful visual transitions.

Intercept all HTTP requests/responses with full headers, timing breakdown (DNS, connect, TLS, TTFB, download), status codes, payload sizes, CORS validation, and redirect chain analysis via CDP Network domain.

Capture and analyze every user interaction with full Event Timing API breakdown (inputDelay, processingTime, presentationDelay). Correlate with Long Animation Frames and console errors to produce a ranked report of the slowest interactions and compute INP.