Skip to content
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/ninety-pandas-move.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': patch
---

fix: flush effects scheduled during boundary's pending phase
2 changes: 1 addition & 1 deletion packages/svelte/src/internal/client/dom/blocks/boundary.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ import { queue_micro_task } from '../task.js';
import * as e from '../../errors.js';
import * as w from '../../warnings.js';
import { DEV } from 'esm-env';
import { Batch, effect_pending_updates } from '../../reactivity/batch.js';
import { Batch, current_batch, effect_pending_updates } from '../../reactivity/batch.js';
import { internal_set, source } from '../../reactivity/sources.js';
import { tag } from '../../dev/tracing.js';
import { createSubscriber } from '../../../../reactivity/create-subscriber.js';
Expand Down
2 changes: 1 addition & 1 deletion packages/svelte/src/internal/client/reactivity/batch.js
Original file line number Diff line number Diff line change
Expand Up @@ -685,7 +685,7 @@ export function suspend() {
batch.activate();
batch.decrement();
} else {
batch.deactivate();
batch.flush();
}

unset_context();
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
<script>
function renderContent(node) {
node.textContent = 'foo';
}
const test = await Promise.resolve('foo');
</script>

<p>{test}</p>
<div {@attach renderContent}></div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import { tick } from 'svelte';
import { test } from '../../test';

export default test({
async test({ assert, target }) {
await tick();
assert.htmlEqual(target.innerHTML, '<button>toggle</button> <p>foo</p><div>foo</div>');

const [toggle] = target.querySelectorAll('button');
toggle.click();
await tick();
assert.htmlEqual(target.innerHTML, '<button>toggle</button>');

toggle.click();
await tick();
assert.htmlEqual(target.innerHTML, '<button>toggle</button> <p>foo</p><div>foo</div>');
}
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
<script>
import Inner from './Inner.svelte';

let show = $state(true);
</script>

<svelte:boundary>
<button onclick={() => show = !show}>toggle</button>
{#if show}
<Inner />
{/if}

{#snippet pending()}
<p>pending</p>
{/snippet}
</svelte:boundary>
Loading