Merge 0f620e8efc into 08b3b66865

packages/svelte/src/internal/client/reactivity/batch.js

@@ -379,7 +379,7 @@ export class Batch {
 	flush() {
 		if (queued_root_effects.length > 0) {
 			flush_effects();
-		} else {
+		} else if (this.#pending === 0) {
 			this.#commit();
 		}
 
@@ -417,6 +417,7 @@ export class Batch {
 		this.#pending -= 1;
 
 		if (this.#pending === 0) {
+			Batch.enqueue(() => {
 				for (const e of this.#dirty_effects) {
 					set_signal_status(e, DIRTY);
 					schedule_effect(e);
@@ -431,6 +432,7 @@ export class Batch {
 				this.#effects = [];
 
 				this.flush();
+			});
 		} else {
 			this.deactivate();
 		}
@@ -670,20 +672,14 @@ export function schedule_effect(signal) {
 export function suspend() {
 	var boundary = get_pending_boundary();
 	var batch = /** @type {Batch} */ (current_batch);
-	var pending = boundary.pending;
 
 	boundary.update_pending_count(1);
-	if (!pending) batch.increment();
+	batch.increment();
 
 	return function unsuspend() {
 		boundary.update_pending_count(-1);
-
-		if (!pending) {
 		batch.activate();
 		batch.decrement();
-		} else {
-			batch.deactivate();
-		}
 
 		unset_context();
 	};
@@ -694,4 +690,5 @@ export function suspend() {
  */
 export function clear() {
 	batches.clear();
+	tasks.length = 0;
 }

packages/svelte/src/internal/client/reactivity/deriveds.js

@@ -135,11 +135,10 @@ export function async_derived(fn, location) {
 		prev = promise;
 
 		var batch = /** @type {Batch} */ (current_batch);
-		var pending = boundary.pending;
 
 		if (should_suspend) {
 			boundary.update_pending_count(1);
-			if (!pending) batch.increment();
+			batch.increment();
 		}
 
 		/**
@@ -151,7 +150,7 @@ export function async_derived(fn, location) {
 
 			current_async_effect = null;
 
-			if (!pending) batch.activate();
+			batch.activate();
 
 			if (error) {
 				if (error !== STALE_REACTION) {
@@ -181,7 +180,7 @@ export function async_derived(fn, location) {
 
 			if (should_suspend) {
 				boundary.update_pending_count(-1);
-				if (!pending) batch.decrement();
+				batch.decrement();
 			}
 
 			unset_context();

packages/svelte/tests/runtime-runes/samples/async-attachment/Inner.svelte

@@ -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>

packages/svelte/tests/runtime-runes/samples/async-attachment/_config.js

@@ -0,0 +1,9 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target }) {
+		await tick();
+		assert.htmlEqual(target.innerHTML, '<p>foo</p><div>foo</div>');
+	}
+});

packages/svelte/tests/runtime-runes/samples/async-attachment/main.svelte

@@ -0,0 +1,11 @@
+<script>
+	import Inner from './Inner.svelte';
+</script>
+
+<svelte:boundary>
+	<Inner />
+
+	{#snippet pending()}
+		<p>pending</p>
+	{/snippet}
+</svelte:boundary>