ReactJS Invalid Hook Call

[Archmonger]

This error periodically shows client side and will completely break IDOM, but seems to fix itself if clearing browser cache. Something notable is I have never seen this issue when Django-IDOM was using idom==0.33.0.

This error was generated using the latest Django IDOM commit reactive-python/reactpy-django@253448f

react-dom.js:8 Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at a (react.js:2:4779)
    at n.useState (react.js:2:6903)
    at react-bootstrap.js:2:44831
    at ql (react-dom.js:6:52870)
    at Uu (react-dom.js:6:60908)
    at gs (react-dom.js:10:10631)
    at ms (react-dom.js:10:933)
    at pf (react-dom.js:10:864)
    at Et (react-dom.js:10:724)
    at xi (react-dom.js:8:10854)
ai @ react-dom.js:8
react-dom.js:10 Uncaught Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at a (react.js:2:4779)
    at n.useState (react.js:2:6903)
    at react-bootstrap.js:2:44831
    at ql (react-dom.js:6:52870)
    at Uu (react-dom.js:6:60908)
    at gs (react-dom.js:10:10631)
    at ms (react-dom.js:10:933)
    at pf (react-dom.js:10:864)
    at Et (react-dom.js:10:724)
    at xi (react-dom.js:8:10854)
client.js:23649 The above error occurred in the <_ImportedElement> component:

    at _ImportedElement (http://127.0.0.1:7575/static/django_idom/client.js:31103:29)
    at ImportedElement (http://127.0.0.1:7575/static/django_idom/client.js:31075:28)
    at Element (http://127.0.0.1:7575/static/django_idom/client.js:31046:20)
    at div
    at StandardElement (http://127.0.0.1:7575/static/django_idom/client.js:31060:28)
    at Element (http://127.0.0.1:7575/static/django_idom/client.js:31046:20)
    at Layout (http://127.0.0.1:7575/static/django_idom/client.js:31034:19)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
logCapturedError @ client.js:23649
client.js:2691 Uncaught Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at a (react.js:2:4779)
    at n.useState (react.js:2:6903)
    at react-bootstrap.js:2:44831
    at ql (react-dom.js:6:52870)
    at Uu (react-dom.js:6:60908)
    at gs (react-dom.js:10:10631)
    at ms (react-dom.js:10:933)
    at pf (react-dom.js:10:864)
    at Et (react-dom.js:10:724)
    at xi (react-dom.js:8:10854)

[rmorshea]

I think I may have observed this too. If you're able, could you try and find a code sample that reproduces this when this happens again. Or, if it's hard to reproduce, maybe we could have a session to try and debug this in context.

[Archmonger]

I've been trying but haven't been able to figure out how to reproduce it. It happens with the Conreq homepage component.

There was one scenario where it happened after a WS reconnect, following a Windows sleep overnight. I haven't attempted to reproduce that yet. I'll give it a shot.

Another scenario I saw it happen was from upgrading django-idom from 0.0.1 to 0.0.2

[rmorshea]

Let’s see if we can resolve this before releasing.

[Archmonger]

Sure.

I don't believe this is django-idom specific. Pretty sure it's correlated to idom>=0.34.0, so it's probably best to transfer this issue over to the IDOM core repo.

[Archmonger]

See #646 (comment) for the determined root cause.

This discussion can be locked.

[rmorshea]

I invited you to a triage team for the core repo so I think you should be able to lock it.

[Archmonger]

Nope, can't lock.