instanceCounterMap and Remix
SimonVanherweghe opened this issue · 2 comments
Question
I'm writing an LTI in Remix and I get some hydration errors. I've implemented the InstUISettingsProvider with the instanceCounterMap. As far as I can grasp it, it lists all the components in the document and hands out an ID for them, right?
This doesn't seem to work for Remix, probably because they handle it differently than Nextjs. But I can't pinpoint where it -exactly- goes wrong. Any ideas?
When I run it without the instanceCounterMap, the ID's keep on incrementing with every refresh. How does this happen?
Maybe this question could be coupled to #1415
Code Sample
https://github.com/devinekask/remix-instructureui
excerpt from the logs:
+ id="RadioInput_1"
- id="RadioInput_0"
...
+ id="RadioInput_3"
- id="RadioInput_1"
...
+ id="RadioInput_5"
- id="RadioInput_2"
Additional Details
Hi!
I am not too familiar with remix, but this seems strange to me. By refresh, you mean f5, page refresh? If so, I think remix does something behind the scenes which persists some things?
What instanceCounterMap does is that it keeps a log of the number of "registered" components by type. If a component needs an id, it'll go to the instanceCounterMap and asks for a new one. It'll get a unique id based on its name and the number of same-type components that came before. This is the idea.
What's not working exactly? Do the ids duplicate? Or no id gets assigned?
Yes, I mean a page refresh
The ID's differ from what the SSR is generating and what the frontend hydration generates (I hope I'm using the right terminology here)