Post by Alexandra Negovora
Senior Fullstack Developer ∙ Fullstack Engineer | 8+ YoE | React, TypeScript, Node.js | Enterprise SaaS, AI Search and Knowledge Platforms | Open to new opportunities
Suppose a progress event is visible in the browser, but the handler never logs. Receipt and callback entry need separate checks. The debugging record includes this frame, with a blank line after data: event: progress data: {"stage":"retrieving"} The client uses only source.onmessage = handler. The first line of handler logs entry; a later line updates React state. That puts receipt, native event dispatch, and the state update at different points in the investigation. Native EventSource uses the event field as the dispatched type. This frame names progress; onmessage handles message events, the default when no type is supplied. Change the subscription to source.addEventListener("progress", handler); to match the type sent by the server. The blank line terminates the event block for dispatch. With no handler entry log, investigating React rendering skips the step that would call the state update. Visible network bytes alone cannot establish that the callback ran. If the named callback runs but the screen stays unchanged, continue from its state update to the rendered UI. #React #JavaScript #SSE #Frontend