fix: overhaul each blocks
#17150
each blocksClosing issues
Describe the bug
Hi,
When testing await in the script tag of a component, I found a bug that I can't understand. I don't know if this is really a bug or if I'm doing something wrong.
I'm simply using an await to simulate an async load in my components, which I display via an {#each} on my main component, with an "add one value" button to add an element.
- there is no problem if I add the elements one by one, waiting for them to load
- but if I click the button multiple times, the rendering may be broken :
- On a non-keyed
{#each}, some component are not correctly rendered (no children), and others are missing - On a keyed
{#each}, there are even more missing components!
- On a non-keyed
Exemple (there should be 10 numbered circles on each line) :
Reproduction
Reproduction : https://svelte.dev/playground/c7e416c4b97446468ee85f3abf4bc676?version=5.41.4
Logs
No error
System Info
REPL with Svelte 5.41.4
Severity
annoyance
Describe the bug
The rendered state doesn't update. Not sure what the exact issue is.
Reproduction
<script>
let value = $state("Apple");
const foo = $derived(await value);
const bar = $derived(foo === value && [0]);
</script>
<select bind:value>
<option value="Apple">Apple</option>
<option value="Banana">Banana</option>
</select>
{#each bar}
Selected fruit: {value}
{/each}
Logs
System Info
Svelte playground
Severity
annoyance
Pull request
As noted in #17126, each blocks are a little buggy when there's async stuff involved. #16977 fixed a bunch of stuff around async blocks/branches, but excluded each blocks because, well, they're complicated. But the time has come to deal with it.
As the commit messages suggest this is very WIP — a bunch of tests are failing, and while it fixes part of the problem (item effects and the fallback effect both need to be created immediately inside the block effect, not later upon commit), it doesn't yet fix the problems relating to overlapping async batches. But I thought I'd open the PR in this unfinished state anyway. Pleasingly, so far it's a net reduction in code and complexity.
Before submitting the PR, please make sure you do the following
- It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs
- Prefix your PR title with
feat:,fix:,chore:, ordocs:. - This message body should clearly illustrate what problems it solves.
- Ideally, include a test that fails without this PR but passes with it.
- If this PR changes code within
packages/svelte/src, add a changeset (npx changeset).
Tests and linting
- Run the tests with
pnpm testand lint the project withpnpm lint
Info
🦋 Changeset detected
Latest commit: e41a8ea
The changes in this PR will be included in the next version bump.
This PR includes changesets to release 1 package
| Name | Type |
|---|---|
| svelte | Patch |
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
pnpm add https://pkg.pr.new/svelte@17150Need to come up with some test cases that test tricky things like out-of-order updates, but this is already way more robust than main. Adapting the repro from #17033:
main— goes absolutely haywire when you spam-click the button
(there is still a bug insofar as it begins at pending=2 rather than 0, but that's presumably unrelated to each blocks)
Thanks — have merged the test in that PR into this branch.
There's more that can be done here as we discover test cases, but since it fixes some stuff already (and apparently doesn't regress anywhere) I've marked it ready for review.
cool — will go ahead and cut a release with this, then open a PR that unskips that new test. The follow-up work can start there
fix: each block losing reactivity when items removed while promise pending (#17151)
• Nov 16, 2025, 2:09 AMCo-authored-by: dylan <[email protected]> Co-authored-by: Rich Harris <[email protected]>
Pro tip: You can prefix GitHub URLs of issues, PRs or discussions with svcl.dev/ to view them on this page! Also try it on a GitHub release ;)