sse-viewer
sse-viewer copied to clipboard
maltoze
EventStream blocked, nothing happens
I'm a fullstack dev, using React 18 and Python / FastAPI. I'm using:
- Chrome Version 119.0.6045.105 (Official Build) (64-bit).
- axios Version 1.4.0 for requests.
- SSE Viewer Version 0.1.2
I installed this extension today via Chrome Store. My hope was that it captured the messages and timings of an SSE, for profiling, as the alternative is to copy these one by one.
Following the (incredibly terse) instructions, I clicked on the extension. It turned blue and in both the web page and the Dev Tools, a top pane appeared informing me that 'SSE Viewer' started debugging this browser with a big Cancel button next to it.
Now, I lauch my EventSource request, I go to the Network tab of Dev Tools, the request does appear there and it's marked as eventSource, just like before.
However, when clicking on the request, it does not show the eventSource usual tabs, namely the EventStream tab where messages pile up. It shows the usual Headers, Preview, Response, Initiator and Timing tabs, as if this were yet another xhr.
It also shows under Timing a big yellow sign reading: "CAUTION: Request is not finished yet!". And this stays like this forever.
Obviously, I am looking at both ends of the program, and the backend does its thing and then it closes the connection.
I remind you that there are no instructions whatsoever regarding steps. All we get is a screenshot with something I used to get (before I used this extension!) and no clear indication that one should click "Cancel" at the end of the request, or anything.
Questions:
- Is this because of
axios? Is this extension incompatible withaxiossomehow? - Am I doing something wrong? Am I failing to guess what the steps are here?
I am willing to share a MWE, if any followup happens here.
The limitation with this extension is that it uses await Fetch.getResponseBody which will only resolve when the SSE is completed. If you have a SSE that never finishes until the app is closed (a long lived SSE connection for all events in the app), it looks like you can't use this extension. Another sign of this limitation is the use of Fetch.fulfillRequest, which will complete the SSE event. This works for ChatGPT and Claude, because the SSE completes as soon as the text stops streaming. It's not long lived, it lives only for a few seconds.
https://github.com/maltoze/sse-viewer/blob/3480c8d99f9a204da01e63791baf88e155ec4321/src/service-worker.js#L83-L92
