Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Charts never render with Reflex 0.10: the /_xy namespace socket is never connected

Open Beginner friendly
  • Is something wrong?
#526 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
78/100
Issue type
Bug
Clarity
Clearly specified
Activity status
Active
Tech stack
javascript, python, react
Domain
backend, frontend

Research direction

Start with XYChart.jsx and trace how xySocket() creates or reuses the Socket.IO namespace socket alongside Reflex’s createSocket in reflex_base/.templates/web/utils/state.js. Check the socket.io-client connection behavior described in the issue, then reproduce with Reflex 0.10. Done means the namespace connects and charts render with a canvas; verify the existing behavior on Reflex 0.9.13 remains intact.

Written by the indexing model from the issue text.

Description

Summary

With Reflex 0.10.0, every xy chart in a Reflex app renders empty: the chart's wrapper div mounts, the figure token arrives in state, but no canvas is ever created. Reflex 0.9.13 with the same app and xy[reflex]==0.0.7 renders normally.

Root cause

Reflex 0.10 creates its Socket.IO socket ahead of time with autoConnect: false (reflex_base/.templates/web/utils/state.js, createSocket, used for the "warm socket"). None of 0.9.8 to 0.9.13 does that.

XYChart.jsx's xySocket() deliberately shares Reflex's manager (same URL and path, so io() returns a namespace socket on the cached Manager). A namespace socket only opens itself when the manager was created with autoConnect on (if (this.io._autoConnect) this.open() in socket.io-client's Socket constructor). Because Reflex now creates the manager first with autoConnect: false, the /_xy namespace socket is never connected:

  • no 40/_xy CONNECT packet ever goes out on the websocket;
  • with localStorage.xy_debug = "1", the effect logs effect run {... hasEl: true} for every chart, but never xy namespace connected nor xy connect_error;
  • every sub emit is buffered forever, so no figure payload arrives.

Reproduction

  1. A Reflex app using reflex_xy.XYPlugin() and any live chart (figure= handle).
  2. reflex==0.10.0, xy[reflex]==0.0.7, Chrome.
  3. Open a page with a chart: the container is empty and document.querySelectorAll("canvas").length === 0.
  4. Downgrade to reflex==0.9.13: the charts render.

Suggested fix

Connect the namespace explicitly instead of relying on the shared manager's autoConnect, e.g. in xySocket():

sharedSocket = io(nsUrl.href, { /* unchanged options */ });
sharedSocket.on("connect", () => dbg("xy namespace connected"));
sharedSocket.on("connect_error", (e) => dbg("xy connect_error", String(e)));
if (!sharedSocket.connected) sharedSocket.connect();
return sharedSocket;

connect() is a no-op on an already-active socket, so this is safe whichever side creates the manager first.

Dominant language
Python
Stars
1.9k
Forks
75
Avg merge
1h 25m
Merged PRs (30d)
5

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from reflex-dev/xy

All issues in reflex-dev/xy

Similar issues

More Python issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.