fix: keep flushing new eager effects (#18102)

The previous code "swallowed" new additions to the array of eager
effects that happened while flushing since `eager_flush` did not clear
the array before running, only afterwards. Now it clears the beforehand,
causing newly added eager effects to run, too.

An example where this can happen is `$state.eager` and `$effect.pending`
in combination: first `$state.eager` is flushed, then due to `flushSync`
the `queue_micro_task` inside `boundary.js` that flushes
`$effect.pending` is triggered synchronously, adding new entries to the
`eager_versions` array. If they're only cleared at the end of
`eager_flush`, new entries are swallowed.

Related to #18095 (but not fixing it yet)

.changeset/sweet-boxes-unite.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: keep flushing new eager effects

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

@@ -1074,15 +1074,13 @@ export function schedule_effect(effect) {
 let eager_versions = [];
 
 function eager_flush() {
-	try {
+	flushSync(() => {
-		flushSync(() => {
+		const eager = eager_versions;
-			for (const version of eager_versions) {
-				update(version);
-			}
-		});
-	} finally {
 		eager_versions = [];
-	}
+		for (const version of eager) {
+			update(version);
+		}
+	});
 }
 
 /**

packages/svelte/tests/runtime-runes/samples/async-effect-pending-eager/_config.js

@@ -0,0 +1,35 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target }) {
+		await tick();
+		const [increment, shift] = target.querySelectorAll('button');
+
+		increment.click();
+		await tick();
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<button>increment</button>
+				<button>shift</button>
+				1
+				<p>pending: 1</p>
+				<p>loading...</p>
+			`
+		);
+
+		shift.click();
+		await tick();
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<button>increment</button>
+				<button>shift</button>
+				1
+				<p>pending: 0</p>
+				<p>1</p>
+			`
+		);
+	}
+});

packages/svelte/tests/runtime-runes/samples/async-effect-pending-eager/main.svelte

@@ -0,0 +1,27 @@
+<script>
+	let value = $state(0);
+	let queued = [];
+
+	function delayed(v) {
+		if (!v) return v;
+		return new Promise((resolve) => {
+			queued.push(() => resolve(v));
+		});
+	}
+</script>
+
+<button onclick={() => value++}>increment</button>
+<button onclick={() => queued.shift()?.()}>shift</button>
+
+{$state.eager(value)}
+
+{#if 1}
+	<p>pending: {$effect.pending()}</p>
+
+	{@const tmp = await delayed(value)}
+	{#if $effect.pending() > 0}
+		<p>loading...</p>
+	{:else}
+		<p>{tmp}</p>
+	{/if}
+{/if}