top-level await

Author: Rich-Harris

packages/svelte/src/compiler/phases/2-analyze/index.js

@@ -450,7 +450,8 @@ export function analyze_component(root, source, options) {
 		source,
 		undefined_exports: new Map(),
 		snippet_renderers: new Map(),
-		snippets: new Set()
+		snippets: new Set(),
+		is_async: false
 	};
 
 	if (!runes) {

packages/svelte/src/compiler/phases/2-analyze/visitors/AwaitExpression.js

@@ -6,9 +6,17 @@
  * @param {Context} context
  */
 export function AwaitExpression(node, context) {
+	if (!context.state.analysis.runes) {
+		throw new Error('TODO runes mode only');
+	}
+
 	if (context.state.expression) {
 		context.state.expression.is_async = true;
 	}
 
+	if (context.state.ast_type === 'instance' && context.state.scope.function_depth === 1) {
+		context.state.analysis.is_async = true;
+	}
+
 	context.next();
 }

packages/svelte/src/compiler/phases/3-transform/client/transform-client.js

@@ -355,7 +355,7 @@ export function client_component(analysis, options) {
 	const push_args = [b.id('$$props'), b.literal(analysis.runes)];
 	if (dev) push_args.push(b.id(analysis.name));
 
-	const component_block = b.block([
+	let component_block = b.block([
 		...store_setup,
 		...legacy_reactive_declarations,
 		...group_binding_declarations,
@@ -367,6 +367,24 @@ export function client_component(analysis, options) {
 		.../** @type {ESTree.Statement[]} */ (template.body)
 	]);
 
+	if (analysis.is_async) {
+		const body = b.function_declaration(
+			b.id('$$body'),
+			[b.id('$$anchor'), b.id('$$props')],
+			component_block
+		);
+		body.async = true;
+
+		state.hoisted.push(body);
+
+		component_block = b.block([
+			b.var('fragment', b.call('$.comment')),
+			b.var('node', b.call('$.first_child', b.id('fragment'))),
+			b.stmt(b.call(body.id, b.id('node'), b.id('$$props'))),
+			b.stmt(b.call('$.append', b.id('$$anchor'), b.id('fragment')))
+		]);
+	}
+
 	if (!analysis.runes) {
 		// Bind static exports to props so that people can access them with bind:x
 		for (const { name, alias } of analysis.exports) {

packages/svelte/src/compiler/phases/types.d.ts

@@ -85,6 +85,10 @@ export interface ComponentAnalysis extends Analysis {
 	 * Every snippet that is declared locally
 	 */
 	snippets: Set<AST.SnippetBlock>;
+	/**
+	 * true if uses top-level await
+	 */
+	is_async: boolean;
 }
 
 declare module 'estree' {