tweak test for new behavior

packages/svelte/tests/runtime-runes/samples/async-each-controlled-empty-pending/_config.js

@@ -6,24 +6,12 @@ import { test } from '../../test';
 // before destroy_effects walks pending keys.
 export default test({
 	mode: ['client'],
-
 	async test({ assert, target }) {
 		await tick();
 
-		assert.htmlEqual(
-			target.innerHTML,
-			`
-				<button>startA</button>
-				<button>startB</button>
-				<button>settleB</button>
-				<p>A0/B0</p>
-				<div><span>1</span><span>2</span></div>
-			`
-		);
-
-		const [startA, startB, settleB] = target.querySelectorAll('button');
+		const [startA, startB, settleB, settleA] = target.querySelectorAll('button');
 
-		// Batch A: add key 9, then block forever on gate A.
+		// Batch A: add key 9, then blocks on gate A.
 		startA.click();
 		await tick();
 
@@ -32,17 +20,32 @@ export default test({
 		await tick();
 
 		// Settle B first so B commits while A is still pending.
-		// Without the fix this throws reading `.e` of undefined and leaves a/b stuck.
+		// Should not take the fast path in each block to clear state.items prematurely.
 		settleB.click();
 		await tick();
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<button>startA</button>
+				<button>startB</button>
+				<button>settleB</button>
+				<button>settleA</button>
+				<p>A0/B0</p>
+				<div><span>1</span><span>2</span></div>
+			`
+		);
 
+		// Settle A so empty array of B can be committed
+		settleA.click();
+		await tick();
 		assert.htmlEqual(
 			target.innerHTML,
 			`
 				<button>startA</button>
 				<button>startB</button>
 				<button>settleB</button>
-				<p>A0/B1</p>
+				<button>settleA</button>
+				<p>A1/B1</p>
 				<div></div>
 			`
 		);

packages/svelte/tests/runtime-runes/samples/async-each-controlled-empty-pending/main.svelte

@@ -4,12 +4,13 @@
 	let tickA = $state(0);
 	let tickB = $state(0);
 
-	// Two independent sources so the batches touch disjoint source sets
-	// and are not merged.
-	const items = $derived(extraKey === null ? base : [...base, extraKey]);
+	// Two independent sources so the batches touch disjoint source sets and are not merged.
+	const items = $derived(base.length ? extraKey === null ? base : [...base, extraKey] : []);
 
 	/** @type {((value: string) => void) | undefined} */
 	let resolveB;
+	/** @type {((value: string) => void) | undefined} */
+	let resolveA;
 
 	/**
 	 * @param {string} name
@@ -20,6 +21,7 @@
 			? Promise.resolve(`${name}0`)
 			: new Promise((r) => {
 					if (name === 'B') resolveB = r;
+					else resolveA = r;
 				});
 
 	const a = $derived(await gate('A', tickA));
@@ -38,11 +40,15 @@
 	function settleB() {
 		resolveB?.('B1');
 	}
+	function settleA() {
+		resolveA?.('A1');
+	}
 </script>
 
 <button onclick={startA}>startA</button>
 <button onclick={startB}>startB</button>
 <button onclick={settleB}>settleB</button>
+<button onclick={settleA}>settleA</button>
 
 <p>{a}/{b}</p>