fix: ensure async block assigns correct nodes to effect #18371
Merged
Conversation
If a block has a sole component child, we apply an optimization to not need a template. But if that sole child is wrapped in `$.async`, it can happens that the block's effect is assigned the wrong end node. In the reproduction this happens because we have two components inside a Child which is rendered only after an async block resolves. In `$.append` we have logic to not reassign nodes when the active effect didn't already run, which it has by the time we come across it (because the async work had to resolve first; we added this in #17120 to prevent the opposite, nodes being "rewinded" to an earlier position) and so the second sibling component's `$.append` will not set its end node to the effect. As a result the end node is wrong (too early). To fix this we assign the nodes in `$.async`. We could also use `compareDocumentPosition` in `$.append` to only ever go forward, but that feels a bit heavier performance-wise.
🦋 Changeset detectedLatest commit: 13bbaa2 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
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 |
Contributor
|
Rich-Harris
approved these changes
Jun 3, 2026
Merged
dummdidumm
pushed a commit
that referenced
this pull request
Jun 4, 2026
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## svelte@5.56.2 ### Patch Changes - fix: properly track effect end node for async sibling component ([#18371](#18371)) - fix: prevent false-positive reactivity loss warning ([#18373](#18373)) - chore: bump esrap dependency ([#18372](#18372)) - fix: ignore declaration tags for animation directive ([#18366](#18366)) - fix: reject pending async deriveds on discard ([#18308](#18308)) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
If a block has a sole component child, we apply an optimization to not need a template. But if that sole child is wrapped in
$.async, it can happens that the block's effect is assigned the wrong end node.In the reproduction this happens because we have two components inside a Child which is rendered only after an async block resolves. In
$.appendwe have logic to not reassign nodes when the active effect didn't already run, which it has by the time we come across it (because the async work had to resolve first; we added this in #17120 to prevent the opposite, nodes being "rewinded" to an earlier position) and so the second sibling component's$.appendwill not set its end node to the effect. As a result the end node is wrong (too early).To fix this we assign the nodes in
$.async. We could also usecompareDocumentPositionin$.appendto only ever go forward, but that feels a bit heavier performance-wise.