Bug Session Recorder

Grava automaticamente a sessao de uso para facilitar a reproducao de bugs.

Bug Session Recorder automatically captures everything that happens on the page as you browse, so reporting a bug stops being "it worked for me" and becomes "here's exactly what happened." Like an airplane's black box, the extension logs session events in the background — no need to click "start recording" — and when something goes wrong, you export the full history, take a screenshot, or record the screen with one click. How it works Open the side panel on the site you want to monitor and turn on "Monitor this site" at the top (you can also manage the full list in Settings). From there, recording is automatic: as soon as the page loads, the extension starts capturing clicks, form submissions, navigations, and network calls — no blinking indicators, no manual start/pause. What gets captured • Clicks and form submissions, with the element's text, CSS selector, and click position • Navigations and route changes (SPA-friendly) • Every HTTP request (fetch and XHR): method, URL, query params, headers, and body — paired with the response (status, headers, body, and response time) • Console errors (console.error, uncaught exceptions, and rejected promises) • Session info: URL, title, browser, operating system, and screen resolution One timeline for everything A DevTools-style side panel shows the whole session in a single, dense list that updates in real time. Each row has an icon or a color-coded method badge (GET blue, POST green, PUT/PATCH amber, DELETE red). Requests appear the moment they are sent, with a "waiting" spinner, and update themselves when the response arrives, with a color-coded status and the response time. Failed requests and console errors are highlighted so they stand out. Find what matters • Search by route, method, or message • Chips for Requests, Actions, and Console, each with a count • An "Errors" switch that keeps only failed requests (no response, 4xx, 5xx) and console errors, whichever types are selected • A Filters panel to narrow requests by status (2xx, 3xx, 4xx, 5xx, failed, pending) and to sort by oldest, most recent, slowest, or status • Hide noisy routes: chatty analytics or polling calls can be hidden from the timeline by route. They are still recorded and included in exports, and you can unhide them at any time from the timeline or from Settings Request details Click any request to see it in two cards, Request and Response, each with Body, Headers, and Query tabs. Bodies are formatted as JSON, with a copy button on every block. Screenshot and screen recording Beyond the event history, you can capture visual evidence on the spot: • Screenshot — one click captures the visible page and downloads it as a PNG • Screen recording — pick the tab or window in Chrome's own picker and record while you reproduce the bug. The panel shows a red "Recording" indicator with a live timer, and stopping it automatically saves the video as a .webm file • Optional audio — before each recording you choose whether to include your microphone (off by default). Tab audio is included when you tick "Share tab audio" in Chrome's picker Share When you find an issue, click "Share" to download: • A JSON file with the full sequence of calls, timeline, and session data — ready for automation or attaching to a ticket • A self-contained HTML report with the same visual timeline, which opens in any browser with no tooling needed — including expandable requests to inspect the request/response You can also download a single request on its own as JSON — handy for quickly reporting that one call that came back with a 500. Run a request on another environment When a request needs to run somewhere else — your local dev server, staging, whatever — open it and use "Run on". Add an environment once (for example localhost:3000 or staging.example.com); it is saved as a chip, and one click runs the same request there: same method, route, query, and body, with only the host swapped. The response shows up right under the request, next to the original status, so you can compare at a glance. Sensitive headers captured earlier are not resent: if the original request carried an Authorization header, the extension fills it only with a token you provide — either a default token saved in Settings or, with the "Use the site's token" switch, the real token from that specific request, kept only for the current browser session and never written to history or exports. Privacy first Passwords, tokens, cookies, and authorization headers are automatically redacted ([REDACTED]) before they're even stored — in saved data and in exported JSON and HTML files. Screenshots and screen recordings show exactly what is on screen, so review them before sharing. Nothing is sent to external servers: everything stays local in your browser. The only exception is "Run on", which sends a request to the address you chose, and only when you click it. Language The interface automatically follows your browser's language (Portuguese or English), with an option to switch manually in Settings at any time. Who it's for Developers, QA, and support teams who need to shrink the time between "the user reported a bug" and "I understand exactly what happened."