-
-
Notifications
You must be signed in to change notification settings - Fork 2.5k
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
Unmount framework components when islands are destroyed #8264
Conversation
🦋 Changeset detectedLatest commit: 7b1c4f3 The changes in this PR will be included in the next version bump. Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
86d6855
to
b0a3573
Compare
render( | ||
h( | ||
Wrapper, | ||
null, | ||
h(Component, props, children != null ? h(StaticHtml, { value: children }) : children) | ||
), | ||
parent, | ||
element |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This was a hacky solution instead of just using the built-in hydrate
function, so I refactored to use that.
// Only replace the existing body *AFTER* persistent elements are moved over | ||
// This avoids disconnecting `astro-island` nodes multiple times | ||
document.body.replaceWith(doc.body); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This change was actually important! We replace the persistent islands first, then swap the <body>
element. Previously, we would trigger multiple disconnectedCallback
in a row when using transition:persist
.
Changes
astro:unmount
event when islands are destroyedTesting
Tested manually but I would love to add some E2E tests
Docs
We don't really document how to build a new renderer, but this would be a detail for renderers to handle.