add test

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

@@ -0,0 +1,92 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target, raf }) {
+		const [shift, increment, commit] = target.querySelectorAll('button');
+
+		shift.click();
+		await tick();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<button>shift</button>
+				<button>increment</button>
+				<button>commit</button>
+				<p>count: 0</p>
+				<p>eager: 0</p>
+				<p>even</p>
+			`
+		);
+
+		increment.click();
+		await tick();
+
+		shift.click();
+		await tick();
+
+		// nothing updates until commit
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<button>shift</button>
+				<button>increment</button>
+				<button>commit</button>
+				<p>count: 0</p>
+				<p>eager: 0</p>
+				<p>even</p>
+			`
+		);
+
+		commit.click();
+		await tick();
+
+		// nothing updates until commit
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<button>shift</button>
+				<button>increment</button>
+				<button>commit</button>
+				<p>count: 1</p>
+				<p>eager: 1</p>
+				<p>odd</p>
+			`
+		);
+
+		increment.click();
+		await tick();
+
+		commit.click();
+		await tick();
+
+		// eager state updates on commit
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<button>shift</button>
+				<button>increment</button>
+				<button>commit</button>
+				<p>count: 1</p>
+				<p>eager: 2</p>
+				<p>odd</p>
+			`
+		);
+
+		shift.click();
+		await tick();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<button>shift</button>
+				<button>increment</button>
+				<button>commit</button>
+				<p>count: 2</p>
+				<p>eager: 2</p>
+				<p>even</p>
+			`
+		);
+	}
+});

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

@@ -0,0 +1,37 @@
+<script>
+	import { fork } from 'svelte';
+
+	let count = $state(0);
+
+	const resolvers = [];
+	let f = null;
+
+	function push(value) {
+		const { promise, resolve } = Promise.withResolvers();
+		resolvers.push(() => resolve(value));
+		return promise;
+	}
+</script>
+
+<button onclick={() => resolvers.shift()?.()}>shift</button>
+<button onclick={async () => {
+	f = await fork(() => {
+		count += 1;
+	});
+}}>increment</button>
+<button onclick={() => f?.commit()}>commit</button>
+
+<p>count: {count}</p>
+<p>eager: {$state.eager(count)}</p>
+
+<svelte:boundary>
+	{#if await push(count) % 2 === 0}
+		<p>even</p>
+	{:else}
+		<p>odd</p>
+	{/if}
+
+	{#snippet pending()}
+		<p>loading...</p>
+	{/snippet}
+</svelte:boundary>