UI + API Recorder

One-click capture: tab video, network calls, UI actions, and a ready-to-run Playwright spec. All local, nothing uploaded.

UI + API Recorder is a one-click capture tool for frontend, QA, and SDET engineers. Press Start once and get four artifacts in a single zip: * Tab screen recording (video.webm) * Network call timeline (events.json + api-details.json) * UI action steps with role + accessible name (events.json) * A ready-to-run Playwright spec (test.spec.ts) All processed locally. Nothing is uploaded anywhere. KEY FEATURES * Playwright-codegen-grade selector priority testid -> role+name -> label -> placeholder -> text -> cssPath Generated spec is 100% compatible with @playwright/test. * Hover-triggered popups and menus are captured (v0.3.1+) For "mouse over -> popup appears -> click menu item" flows, the hover step is recorded too, and the click carries a triggeredBy field so replay won't fail for missing hover. * Honest single-tab recording UI (v0.3.2+) The recording tab shows a red dot badge; other tabs show a grey dot. The popup shows an orange warning if you're viewing a non-target tab. * Per-artifact toggles Video, API, UI, Playwright spec each have their own switch. Output zip uses "<prefix>-<timestamp>" naming for easy archival. * API filtering via include / exclude regex Capture only the endpoints you care about. * Built-in timeline viewer (viewer.html) Open-and-play interactive viewer with API and UI events on one timeline. Zero external dependencies. Works offline. USE CASES * E2E test scaffolding - record manual flows, let your agent or yourself fill in the assertions * Frontend-backend handoff - see exactly which click triggered which API call * Bug reproduction - ship one zip with video + network + steps to your colleague * API contract review - keep the request/response trail for review PRIVACY AND SECURITY * 100% local processing, zero outbound network requests from the extension * Does not read browser history, bookmarks, passwords, or cookies * Recording only runs while you explicitly press Start * No analytics SDK, no ads, no telemetry * Open source and auditable See the Privacy practices tab for the full policy. INCOGNITO SUPPORT Supports incognito (split) mode - recordings made in incognito stay in incognito; the extension cannot read data across the regular/incognito boundary. SYSTEM REQUIREMENTS * Chromium 109+ (Chrome, Edge, Brave, Arc, etc.) * No external services required OPEN SOURCE AND FEEDBACK Source code and issue tracker: <https://github.com/DingXiaoXiao/ui-api-recorder>