Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: improve race condition connectivity handling #2342

Merged
merged 1 commit into from
Dec 21, 2024
Merged

Conversation

stipsan
Copy link
Member

@stipsan stipsan commented Dec 21, 2024

Follows up on #2308, turns out the root cause is a race condition that happens on fast machines and optimal race conditions. Where <VisualEditing /> winds up sending await comlink.fetch before <PresentationTool /> has had time to mount relevant PostMessage components, and run their useEffect's that sets up comlink.on() handlers on the other side.

See the https://github.com/sanity-io/visual-editing/compare/debug branch for examples, in the test studio: https://visual-editing-studio-git-debug.sanity.dev/page-builder-demo/presentation/dndTestPage/60a2a9dd-7514-4b3c-8a2a-af06fb4cc31e?preview=/dnd

The short term fix is to delay a bit when the comlink is set in <VisualEditing /> hoping its setup by then. The real long term fix is to refactor <PresentationTool /> itself to use a state machine to handle comlink, and thus have all the handlers ready right away as soon as the iframe is loaded.

cc @rdunk so you see this eventually, after 🎄❤️

@stipsan stipsan requested a review from a team as a code owner December 21, 2024 16:30
Copy link

vercel bot commented Dec 21, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
live-visual-editing-next 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-astro 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-next 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-next-with-i18n 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-nuxt 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-page-builder-demo 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-remix 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-storybook 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-studio 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm
visual-editing-svelte 🔄 Building (Inspect) Visit Preview 💬 Add feedback Dec 21, 2024 4:30pm

@@ -75,8 +75,8 @@ export type Node<S extends Message, R extends Message> = {
handler: (event: U['data']) => U['response'],
) => () => void
onStatus: (
handler: (status: Omit<Status, 'disconnected'>) => void,
filter?: Omit<Status, 'disconnected'>,
handler: (status: Exclude<Status, 'disconnected'>) => void,
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Omit on string types doesn't work, with Exclude I managed to find a few places that still expected onStatus to emit a disconnected event 🙌

Comment on lines +540 to +542
if (cachedStatus) {
handler(cachedStatus)
}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This logic ensures that although useComlink itself now uses onStatus = connected to determine when to forward the comlink to <Overlays />, other hooks are still able to subscribe to onStatus and reach eventual consistency even though the connected event has happened before they subscribed.

@@ -517,6 +517,8 @@ export default function PresentationTool(props: {
<Flex direction="column" flex={1} height="fill" ref={setBoundaryElement}>
<BoundaryElementProvider element={boundaryElement}>
<Preview
// Make sure the iframe is unmounted if the targetOrigin has changed
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is more of a "protecting against future bugs" kind of thing

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant