SSE DevTools Panel

Debug SSE / NDJSON / Connect+JSON streaming responses in a DevTools panel

SSE DevTools Panel is a Chrome DevTools panel for debugging streaming responses: SSE, EventSource, NDJSON, and Connect+JSON. Chrome Network already helps with standard SSE, but many AI and product streams use fetch + custom protocols. Response data is often hard to read, timing is unclear, and chat-like payloads (thinking, content, tools, search sources) stay buried in raw frames. This extension gives you a dedicated workbench for those streams. What you get • Capture streams from fetch, EventSource, and XHR without changing how the page works • Streams sidebar with URL search and transport filters • Events table with JSON tree, text/regex filter, and resizable columns • Request view for headers and body (sensitive headers redacted) • Conversation view that merges fragments into Content / Thinking / Tools / Meta channels • Timeline for arrival timing, stall highlights (≥250ms), gap distribution, and reconnect markers • Raw text view with one-click copy • Stats, Anomalies, Spec checks, and Search All across streams • Import / export (JSON, CSV, .sse) and local archives Who it is for Developers building or debugging AI chat UIs, notification pushes, progress streams, and other long-lived streaming APIs in Chromium browsers (Chrome, Edge, and similar). How to use 1. Install the extension 2. Open your page → press F12 → open the SSE DevTools panel 3. Refresh the page, then trigger a streaming request 4. Pick a stream in the sidebar and inspect Events, Request, Conversation, Timeline, or Raw Notes • Chromium DevTools only (no Firefox / Safari panel yet) • Does not capture requests started inside a page Service Worker • Conversation support depends on site protocols and may need updates when vendors change their formats Open source: https://github.com/FatMii/sse-devtools-panel