diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js index 5d1aa7bad0..b8c0f438a1 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js @@ -61,12 +61,14 @@ export function build_template_chunk(values, visit, state) { '??', /** @type {Expression} */ (visit(node.expression, state)), b.literal('') - ) + ), + is_async ) ) ) ); - expressions.push(b.call('$.get', id)); + + expressions.push(is_async ? b.await(b.call('$.get', id)) : b.call('$.get', id)); } else if (values.length === 1) { // If we have a single expression, then pass that in directly to possibly avoid doing // extra work in the template_effect (instead we do the work in set_text). diff --git a/packages/svelte/src/compiler/utils/builders.js b/packages/svelte/src/compiler/utils/builders.js index ecb595d74d..f79028a947 100644 --- a/packages/svelte/src/compiler/utils/builders.js +++ b/packages/svelte/src/compiler/utils/builders.js @@ -426,12 +426,15 @@ export function thunk(expression, async = false) { /** * Replace "(arg) => func(arg)" to "func" - * @param {ESTree.Expression} expression + * @param {ESTree.ArrowFunctionExpression} expression * @returns {ESTree.Expression} */ export function unthunk(expression) { + if (expression.async && expression.body.type === 'AwaitExpression') { + return unthunk(arrow(expression.params, expression.body.argument)); + } + if ( - expression.type === 'ArrowFunctionExpression' && expression.async === false && expression.body.type === 'CallExpression' && expression.body.callee.type === 'Identifier' &&