Session Recorder

Session Recorder is a free, open-source, local-first Chrome extension for recording web bugs for AI coding agents. It captures clicks, console errors, network requests and responses, screenshots, video, voice narration, DOM interactions, annotations, and uploaded files, then exports an LLM-ready Markdown report for Claude Code, Codex, Cursor, ChatGPT, and other coding agents. Reproducing a bug for an AI coding agent means describing a hundred little things: what you clicked, what the app requested, the error in the console, what you expected. Session Recorder captures all of it while you use your web app, then exports one clean report your agent can actually read — so it can reproduce the bug and reason about what went wrong. Hit record, use your app like normal, then export. That's the whole loop. WHAT IT CAPTURES • Clicks, typing, scrolls, and keys — every interaction, with the element you touched • Network activity — requests, responses, headers, timing, websockets, and failures (via Chrome's DevTools Protocol) • Console logs, exceptions, and failed requests • Page and SPA route changes as you move through the app • Screenshots as you go, at a frequency you choose, with near-duplicate frames deduped • Video of the tab, with its sound — pause and resume as you go; clips play inline in the report • Text you select on the page, so a highlight becomes part of the story • New tabs the app opens — recording follows you there and back • Voice narration — talk through what you're doing while you record • Annotations — freeze the screen and mark it up with arrows, boxes, highlights, and text • Files you upload to the app, plus files you attach yourself • Markers and notes you drop at the exact moment something matters • Optionally, an OpenAPI spec compiled from the requests your app made Everything lands on one timeline, in the order it happened, so the report reads as a coherent story instead of a pile of logs. EVERYTHING STAYS ON YOUR MACHINE There is no account and no backend. Sessions are stored locally in your browser and exported as a zip file you save yourself. Nothing is uploaded. The only exception is voice transcription, and only if you turn it on: if you add your own API key for a transcription provider (Deepgram, OpenAI, or ElevenLabs), the recorded audio is sent to that provider to produce a text transcript. Without a key, audio never leaves your machine. SECRETS ARE HIDDEN BY DEFAULT Redaction is on out of the box. Authorization headers, token-like JSON and form fields, sensitive URL parameters, and password inputs are masked at capture time — before anything is written to storage. You can add your own rules, or turn redaction off per session, on the options page. RIGHT-SIZED FOR ANY MODEL Long sessions get big. At export you pick a detail level and see a live token estimate for each, so the report fits your model's context window: • Full — everything, nothing omitted • Standard — trimmed bodies, static assets and analytics collapsed • Compact — bodies reduced to a shape summary, repeated requests collapsed • Minimal — a concise narrative skeleton Your explicit signals — voice transcript, annotations, markers, notes, errors, and file metadata — are never trimmed, at any level. The same recording can be re-exported at a different level later without recording again. HOW TO USE THE REPORT Unzip the export and hand report.md to your coding agent. It's a chronological narrative with [mm:ss] timestamps that ties interactions, network summaries, errors, narration, and annotations together. At the more compact levels it stands on its own without the asset files. • Claude Code — unzip into the repo and point it at report.md • Cursor — attach the report to the Agent with @report.md • Codex — read it locally, or commit it for a cloud task • ChatGPT — upload one self-contained file instead of pasting screenshots Step-by-step workflow guides for each, plus a complete example report: https://azimi.me/session-recorder-chrome-extension/ Built for developers. Manifest V3. Free and open source.