TraceFlow

TraceFlow turns any browser tab into a live HTTP debugger. Every fetch and XMLHttpRequest the page issues is captured with full request and response payloads, ready to inspect, edit, and replay — using the page's own cookies, session tokens, and CSRF headers. Think Postman, except it doesn't need you to copy-paste auth. ⚡ WHAT YOU CAN DO • Capture — every fetch and XHR the page issues, with headers, body, response, status, and timing, streamed live into the side panel. • Edit & replay — change URL, method, headers, or body and re-send from the page's own origin. Cookies, Authorization headers, SameSite rules, and CORS all just work because the request runs in the page's context. • Save requests per site — star any request to bookmark its full payload. Saved entries persist across reloads and stay replayable even when the page didn't fire that request this session. • Environment variables — define {{baseUrl}}, {{token}}, {{apiKey}} once, switch environments with one click, and see live green/red highlighting in the editor for resolved vs missing tokens before you hit Send. • Copy as cURL — right-click any row to copy a shell-ready curl command (method, headers, body included) for terminal, scripts, or sharing in tickets. • Keyboard shortcut — Alt+Shift+A (Ctrl+Shift+A on Mac) toggles the side panel without leaving the keyboard. 🎯 WHO IT'S FOR • Frontend engineers debugging API integration without DevTools clutter. • QA engineers reproducing edge-case payloads against staging vs production. • Backend engineers verifying their endpoints against a real authenticated browser session. • Anyone who has ever copy-pasted a curl out of DevTools just to tweak one header. 🔒 PRIVACY TraceFlow runs entirely in your browser. Captured requests are stored locally in IndexedDB on your machine and never leave your device. No analytics, no telemetry, no remote servers. The extension only activates on tabs you open the side panel on. 🛠️ HOW IT WORKS (FOR THE CURIOUS) A tiny script runs in the page's main world and patches window.fetch and XMLHttpRequest, cloning bodies before the page consumes them. Replays use the original un-patched fetch in the page's own JavaScript realm, so authentication, CORS, and credentialed requests behave exactly as they did during capture. Nothing is rewritten, nothing is intercepted at the network layer. ⌨️ KEYBOARD SHORTCUTS • Alt+Shift+A (Win/Linux) / Ctrl+Shift+A (Mac) — toggle side panel. • Click extension icon — same as the shortcut. 📩 FEEDBACK Found a bug or want a feature? Use the Support link on this listing.