diff --git a/.changeset/eleven-cases-sing.md b/.changeset/eleven-cases-sing.md new file mode 100644 index 0000000000..fa6edda180 --- /dev/null +++ b/.changeset/eleven-cases-sing.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: ensure async static props/attributes are awaited diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js index 4d34d83df2..2b57f61c77 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js @@ -171,8 +171,6 @@ export function build_component(node, component_name, context) { attribute.value, context, (value, metadata) => { - if (!metadata.has_state && !metadata.has_await) return value; - // When we have a non-simple computation, anything other than an Identifier or Member expression, // then there's a good chance it needs to be memoized to avoid over-firing when read within the // child component (e.g. `active={i === index}`) diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js index 436d262d3a..d199cfd66b 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js @@ -122,7 +122,7 @@ export function build_attribute_value(value, context, memoize = (value) => value return { value: memoize(expression, chunk.metadata.expression), - has_state: chunk.metadata.expression.has_state || chunk.metadata.expression.has_await + has_state: chunk.metadata.expression.has_state || chunk.metadata.expression.is_async() }; } diff --git a/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/Child.svelte b/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/Child.svelte new file mode 100644 index 0000000000..e93bbe3dc0 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/Child.svelte @@ -0,0 +1,5 @@ + + +{value} diff --git a/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/_config.js b/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/_config.js new file mode 100644 index 0000000000..eff988e0d6 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/_config.js @@ -0,0 +1,11 @@ +import { tick } from 'svelte'; +import { test } from '../../test'; + +export default test({ + mode: ['async-server', 'client', 'hydrate'], + ssrHtml: 'value
', + async test({ assert, target }) { + await tick(); + assert.htmlEqual(target.innerHTML, 'value
'); + } +}); diff --git a/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/main.svelte b/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/main.svelte new file mode 100644 index 0000000000..c681586c63 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-static-prop-after-await/main.svelte @@ -0,0 +1,10 @@ + + + +