From 7907d1d04a9bee9d1f688797bc534915633ff972 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 24 Jan 2025 15:13:12 -0500
Subject: [PATCH] await derived in module

---
 .../samples/async-derived-module/Child.svelte | 20 ++++++
 .../samples/async-derived-module/_config.js   | 65 +++++++++++++++++++
 .../samples/async-derived-module/main.svelte  | 15 +++++
 .../async-derived-module/state.svelte.js      |  9 +++
 4 files changed, 109 insertions(+)
 create mode 100644 packages/svelte/tests/runtime-runes/samples/async-derived-module/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/async-derived-module/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/async-derived-module/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/async-derived-module/state.svelte.js

diff --git a/packages/svelte/tests/runtime-runes/samples/async-derived-module/Child.svelte b/packages/svelte/tests/runtime-runes/samples/async-derived-module/Child.svelte
new file mode 100644
index 0000000000..f803a30c37
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/async-derived-module/Child.svelte
@@ -0,0 +1,20 @@
+<script>
+	import { create_derived } from './state.svelte.js';
+
+	let { promise, num } = $props();
+
+	let derived = await create_derived(
+		() => promise,
+		() => num
+	);
+
+	$effect(() => {
+		console.log(`$effect ${derived.value} ${num}`);
+	});
+
+	$effect.pre(() => {
+		console.log(`$effect.pre ${derived.value} ${num}`);
+	});
+</script>
+
+<p>{derived.value}{console.log(`template ${derived.value} ${num}`)}</p>
diff --git a/packages/svelte/tests/runtime-runes/samples/async-derived-module/_config.js b/packages/svelte/tests/runtime-runes/samples/async-derived-module/_config.js
new file mode 100644
index 0000000000..b81f2a192a
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/async-derived-module/_config.js
@@ -0,0 +1,65 @@
+import { flushSync, tick } from 'svelte';
+import { deferred } from '../../../../src/internal/shared/utils.js';
+import { test } from '../../test';
+
+/** @type {ReturnType<typeof deferred>} */
+let d;
+
+export default test({
+	html: `<p>pending</p>`,
+
+	get props() {
+		d = deferred();
+
+		return {
+			promise: d.promise,
+			num: 1
+		};
+	},
+
+	async test({ assert, target, component, logs }) {
+		d.resolve(42);
+		await Promise.resolve();
+		await Promise.resolve();
+		await Promise.resolve();
+		await Promise.resolve();
+		await Promise.resolve();
+		await Promise.resolve();
+		await Promise.resolve();
+		flushSync();
+		await tick();
+		assert.htmlEqual(target.innerHTML, '<p>42</p>');
+
+		component.num = 2;
+		await Promise.resolve();
+		await Promise.resolve();
+		await Promise.resolve();
+		await tick();
+		assert.htmlEqual(target.innerHTML, '<p>84</p>');
+
+		d = deferred();
+		component.promise = d.promise;
+		await tick();
+		assert.htmlEqual(target.innerHTML, '<p>pending</p>');
+
+		d.resolve(43);
+		await Promise.resolve();
+		await Promise.resolve();
+		await tick();
+		assert.htmlEqual(target.innerHTML, '<p>86</p>');
+
+		assert.deepEqual(logs, [
+			'outside boundary 1',
+			'$effect.pre 42 1',
+			'template 42 1',
+			'$effect 42 1',
+			'outside boundary 2',
+			'$effect.pre 84 2',
+			'template 84 2',
+			'$effect 84 2',
+			'$effect.pre 86 2',
+			'template 86 2',
+			'$effect 86 2'
+		]);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/async-derived-module/main.svelte b/packages/svelte/tests/runtime-runes/samples/async-derived-module/main.svelte
new file mode 100644
index 0000000000..e90bbf720e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/async-derived-module/main.svelte
@@ -0,0 +1,15 @@
+<script>
+	import Child from './Child.svelte';
+
+	let { promise, num } = $props();
+</script>
+
+<svelte:boundary>
+	<Child {promise} {num} />
+
+	{#snippet pending()}
+		<p>pending</p>
+	{/snippet}
+</svelte:boundary>
+
+{console.log(`outside boundary ${num}`)}
diff --git a/packages/svelte/tests/runtime-runes/samples/async-derived-module/state.svelte.js b/packages/svelte/tests/runtime-runes/samples/async-derived-module/state.svelte.js
new file mode 100644
index 0000000000..a53fbb8c6f
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/async-derived-module/state.svelte.js
@@ -0,0 +1,9 @@
+export async function create_derived(get_promise, get_num) {
+	let value = $derived((await get_promise()) * get_num());
+
+	return {
+		get value() {
+			return value;
+		}
+	};
+}