fix(recorder): reattach toolbar if it was unmounted by framework hydration#32637
fix(recorder): reattach toolbar if it was unmounted by framework hydration#32637Skn0tt merged 6 commits intomicrosoft:mainfrom
Conversation
| install() { | ||
| this._injectedScript.document.documentElement.appendChild(this._glassPaneElement); | ||
|
|
||
| this._glassPaneInterval = setInterval(() => { |
There was a problem hiding this comment.
I've tried using MutationObserver as the more canonical solution over setInterval, but couldn't get that to work.
dgozman
left a comment
There was a problem hiding this comment.
This seems to be only relevant to the recorder. Should we put the code there instead?
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
good call, done! |
This comment has been minimized.
This comment has been minimized.
Test results for "tests 1"1 failed 2 flaky35465 passed, 659 skipped Merge workflow run. |
|
@Skn0tt, thanks a lot for this change. How can I give it a test drive? |
|
We publish a nightly release under the |
|
@Skn0tt, pretty sure I miss something, but I still receive:
I had |
|
Right, you won't be able to get around that. It's just a consequence of how React's rehydration works. Does this cause any errors except for this warning though? |
|
@Skn0tt, the toolbar still disappears in the current alpha release. Unfortunately, the recent bugfix didn't resolve this issue (at least for me in my reproduction repository). |
Closes #32632. A side effect of Remix's hydration implementation is that it throws away the entire DOM. This is broadly discussed in remix-run/remix#4822 - there might be a fix in coming React versions, but who knows.
Besides breaking browser extensions, this also deletes our toolbar!
This PR fixes it by periodically checking in on
x-pw-glass, and remounting it if it was unmounted. Hacky but effective!