From 90dc9fc329f61404dc3b5307d0e7b50b00c051bf Mon Sep 17 00:00:00 2001
From: Nic <162764842+Nic-Polumeyv@users.noreply.github.com>
Date: Mon, 12 Oct 2026 23:58:41 -0400
Subject: [PATCH 1/2] test: cover branch commit order and merged blocking
 pending

---
 .../async-branch-commit-order/_config.js      | 31 +++++++++++++++
 .../async-branch-commit-order/main.svelte     | 30 +++++++++++++++
 .../async-merge-blocking-pending/_config.js   | 38 +++++++++++++++++++
 .../async-merge-blocking-pending/main.svelte  | 38 +++++++++++++++++++
 4 files changed, 137 insertions(+)
 create mode 100644 packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/main.svelte

diff --git a/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/_config.js b/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/_config.js
new file mode 100644
index 0000000000..a006f88c29
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/_config.js
@@ -0,0 +1,31 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+const buttons =
+	'<button>a</button><button>b</button><button>resolve a1</button><button>resolve b1</button>';
+
+export default test({
+	async test({ assert, target }) {
+		await tick();
+		const [a, b, resolve_a1, resolve_b1] = target.querySelectorAll('button');
+
+		assert.htmlEqual(target.innerHTML, `<p>0</p><p>0</p>${buttons}`);
+
+		// batch A waits on its key; batch B registers its key right away
+		a.click();
+		await tick();
+		b.click();
+		await tick();
+		assert.htmlEqual(target.innerHTML, `<p>0</p><p>0</p>${buttons}`);
+
+		// the older batch commits first
+		resolve_a1.click();
+		await tick();
+		assert.htmlEqual(target.innerHTML, `<p>0</p><p>1</p>${buttons}`);
+
+		// the newer batch commits with its own branch
+		resolve_b1.click();
+		await tick();
+		assert.htmlEqual(target.innerHTML, `<p>1</p><p>B</p>${buttons}`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/main.svelte b/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/main.svelte
new file mode 100644
index 0000000000..c232f535a9
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/main.svelte
@@ -0,0 +1,30 @@
+<script>
+	let a = $state(0);
+	let b = $state(0);
+	let pend = false;
+
+	const pending = new Map();
+
+	function delay(key, value) {
+		if (!pend) return value;
+		return new Promise((resolve) => pending.set(key, () => resolve(value)));
+	}
+
+	function resolve(key) {
+		pending.get(key)();
+		pending.delete(key);
+	}
+
+	const k = $derived(b === 0 ? await delay(`a${a}`, a) : 'B');
+</script>
+
+<p>{await delay(`b${b}`, b)}</p>
+
+{#key k}
+	<p>{k}</p>
+{/key}
+
+<button onclick={() => { pend = true; a = 1; }}>a</button>
+<button onclick={() => { pend = true; b = 1; }}>b</button>
+<button onclick={() => resolve('a1')}>resolve a1</button>
+<button onclick={() => resolve('b1')}>resolve b1</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/_config.js b/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/_config.js
new file mode 100644
index 0000000000..be95f3a159
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/_config.js
@@ -0,0 +1,38 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+const buttons =
+	'<button>X</button><button>Y</button><button>Z</button><button>W</button><button>resolve e</button><button>resolve x1</button>';
+
+export default test({
+	async test({ assert, target, logs }) {
+		await tick();
+		const [X, Y, Z, W, resolve_e, resolve_x1] = target.querySelectorAll('button');
+
+		assert.htmlEqual(target.innerHTML, `<p>n = 0</p><p>x = 0</p>${buttons}`);
+
+		// X is deferred on its own await
+		X.click();
+		await tick();
+		// Y is deferred on the await inside the new branch
+		Y.click();
+		await tick();
+		// Z hides that branch again, merges into Y, which merges into X
+		Z.click();
+		await tick();
+		assert.htmlEqual(target.innerHTML, `<p>n = 0</p><p>x = 0</p>${buttons}`);
+		assert.deepEqual(logs, ['delay x0', 'delay x1', 'delay e']);
+
+		// the branch's await resolves while it is hidden
+		resolve_e.click();
+		await tick();
+		// W shows the branch again and merges into X
+		W.click();
+		await tick();
+
+		// nothing is pending any more, so X commits
+		resolve_x1.click();
+		await tick();
+		assert.htmlEqual(target.innerHTML, `<p>n = 4</p><p>x = 1</p><p>cond: e</p>${buttons}`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/main.svelte b/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/main.svelte
new file mode 100644
index 0000000000..d4d03aa6eb
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/main.svelte
@@ -0,0 +1,38 @@
+<script>
+	let n = $state(0);
+	let x = $state(0);
+	let cond = $state(false);
+	let pend = false;
+
+	const pending = new Map();
+
+	function delay(key, value) {
+		console.log(`delay ${key}`);
+		if (!pend) return value;
+		return new Promise((resolve) => pending.set(key, () => resolve(value)));
+	}
+
+	function resolve(key) {
+		pending.get(key)();
+		pending.delete(key);
+	}
+</script>
+
+<svelte:boundary>
+	<p>n = {n}</p>
+	<p>x = {await delay(`x${x}`, x)}</p>
+	{#if cond}
+		<p>cond: {await delay('e', 'e')}</p>
+	{/if}
+
+	{#snippet pending()}
+		<p>loading</p>
+	{/snippet}
+</svelte:boundary>
+
+<button onclick={() => { pend = true; n++; x = 1; }}>X</button>
+<button onclick={() => { n++; cond = true; }}>Y</button>
+<button onclick={() => { n++; cond = false; }}>Z</button>
+<button onclick={() => { n++; cond = true; }}>W</button>
+<button onclick={() => resolve('e')}>resolve e</button>
+<button onclick={() => resolve('x1')}>resolve x1</button>

From 5d7eef91f06e06155f5d137411a394225fc1de78 Mon Sep 17 00:00:00 2001
From: Nic <162764842+Nic-Polumeyv@users.noreply.github.com>
Date: Tue, 13 Oct 2026 00:09:23 -0400
Subject: [PATCH 2/2] simplify the two tests

---
 .../async-branch-commit-order/_config.js      | 12 +++------
 .../async-branch-commit-order/main.svelte     | 18 +++++--------
 .../async-merge-blocking-pending/_config.js   | 22 +++++++---------
 .../async-merge-blocking-pending/main.svelte  | 25 ++++++-------------
 4 files changed, 27 insertions(+), 50 deletions(-)

diff --git a/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/_config.js b/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/_config.js
index a006f88c29..11c3bce995 100644
--- a/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/_config.js
@@ -1,30 +1,26 @@
 import { tick } from 'svelte';
 import { test } from '../../test';
 
-const buttons =
-	'<button>a</button><button>b</button><button>resolve a1</button><button>resolve b1</button>';
+const buttons = '<button>a</button><button>b</button><button>shift</button>';
 
 export default test({
 	async test({ assert, target }) {
 		await tick();
-		const [a, b, resolve_a1, resolve_b1] = target.querySelectorAll('button');
-
-		assert.htmlEqual(target.innerHTML, `<p>0</p><p>0</p>${buttons}`);
+		const [a, b, shift] = target.querySelectorAll('button');
 
 		// batch A waits on its key; batch B registers its key right away
 		a.click();
 		await tick();
 		b.click();
 		await tick();
-		assert.htmlEqual(target.innerHTML, `<p>0</p><p>0</p>${buttons}`);
 
 		// the older batch commits first
-		resolve_a1.click();
+		shift.click();
 		await tick();
 		assert.htmlEqual(target.innerHTML, `<p>0</p><p>1</p>${buttons}`);
 
 		// the newer batch commits with its own branch
-		resolve_b1.click();
+		shift.click();
 		await tick();
 		assert.htmlEqual(target.innerHTML, `<p>1</p><p>B</p>${buttons}`);
 	}
diff --git a/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/main.svelte b/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/main.svelte
index c232f535a9..d0b1a57053 100644
--- a/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/async-branch-commit-order/main.svelte
@@ -3,22 +3,17 @@
 	let b = $state(0);
 	let pend = false;
 
-	const pending = new Map();
+	const deferred = [];
 
-	function delay(key, value) {
+	function delay(value) {
 		if (!pend) return value;
-		return new Promise((resolve) => pending.set(key, () => resolve(value)));
+		return new Promise((resolve) => deferred.push(() => resolve(value)));
 	}
 
-	function resolve(key) {
-		pending.get(key)();
-		pending.delete(key);
-	}
-
-	const k = $derived(b === 0 ? await delay(`a${a}`, a) : 'B');
+	const k = $derived(b === 0 ? await delay(a) : 'B');
 </script>
 
-<p>{await delay(`b${b}`, b)}</p>
+<p>{await delay(b)}</p>
 
 {#key k}
 	<p>{k}</p>
@@ -26,5 +21,4 @@
 
 <button onclick={() => { pend = true; a = 1; }}>a</button>
 <button onclick={() => { pend = true; b = 1; }}>b</button>
-<button onclick={() => resolve('a1')}>resolve a1</button>
-<button onclick={() => resolve('b1')}>resolve b1</button>
+<button onclick={() => deferred.shift()()}>shift</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/_config.js b/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/_config.js
index be95f3a159..9cd8eba0b3 100644
--- a/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/_config.js
@@ -1,37 +1,33 @@
 import { tick } from 'svelte';
 import { test } from '../../test';
 
-const buttons =
-	'<button>X</button><button>Y</button><button>Z</button><button>W</button><button>resolve e</button><button>resolve x1</button>';
+const buttons = '<button>x</button><button>toggle</button><button>pop</button>';
 
 export default test({
-	async test({ assert, target, logs }) {
+	async test({ assert, target }) {
 		await tick();
-		const [X, Y, Z, W, resolve_e, resolve_x1] = target.querySelectorAll('button');
-
-		assert.htmlEqual(target.innerHTML, `<p>n = 0</p><p>x = 0</p>${buttons}`);
+		const [x, toggle, pop] = target.querySelectorAll('button');
 
 		// X is deferred on its own await
-		X.click();
+		x.click();
 		await tick();
 		// Y is deferred on the await inside the new branch
-		Y.click();
+		toggle.click();
 		await tick();
 		// Z hides that branch again, merges into Y, which merges into X
-		Z.click();
+		toggle.click();
 		await tick();
 		assert.htmlEqual(target.innerHTML, `<p>n = 0</p><p>x = 0</p>${buttons}`);
-		assert.deepEqual(logs, ['delay x0', 'delay x1', 'delay e']);
 
 		// the branch's await resolves while it is hidden
-		resolve_e.click();
+		pop.click();
 		await tick();
 		// W shows the branch again and merges into X
-		W.click();
+		toggle.click();
 		await tick();
 
 		// nothing is pending any more, so X commits
-		resolve_x1.click();
+		pop.click();
 		await tick();
 		assert.htmlEqual(target.innerHTML, `<p>n = 4</p><p>x = 1</p><p>cond: e</p>${buttons}`);
 	}
diff --git a/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/main.svelte b/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/main.svelte
index d4d03aa6eb..d4cbd8c5b6 100644
--- a/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/async-merge-blocking-pending/main.svelte
@@ -4,25 +4,19 @@
 	let cond = $state(false);
 	let pend = false;
 
-	const pending = new Map();
+	const deferred = [];
 
-	function delay(key, value) {
-		console.log(`delay ${key}`);
+	function delay(value) {
 		if (!pend) return value;
-		return new Promise((resolve) => pending.set(key, () => resolve(value)));
-	}
-
-	function resolve(key) {
-		pending.get(key)();
-		pending.delete(key);
+		return new Promise((resolve) => deferred.push(() => resolve(value)));
 	}
 </script>
 
 <svelte:boundary>
 	<p>n = {n}</p>
-	<p>x = {await delay(`x${x}`, x)}</p>
+	<p>x = {await delay(x)}</p>
 	{#if cond}
-		<p>cond: {await delay('e', 'e')}</p>
+		<p>cond: {await delay('e')}</p>
 	{/if}
 
 	{#snippet pending()}
@@ -30,9 +24,6 @@
 	{/snippet}
 </svelte:boundary>
 
-<button onclick={() => { pend = true; n++; x = 1; }}>X</button>
-<button onclick={() => { n++; cond = true; }}>Y</button>
-<button onclick={() => { n++; cond = false; }}>Z</button>
-<button onclick={() => { n++; cond = true; }}>W</button>
-<button onclick={() => resolve('e')}>resolve e</button>
-<button onclick={() => resolve('x1')}>resolve x1</button>
+<button onclick={() => { pend = true; n++; x = 1; }}>x</button>
+<button onclick={() => { n++; cond = !cond; }}>toggle</button>
+<button onclick={() => deferred.pop()()}>pop</button>