diff --git a/.changeset/hot-crews-notice.md b/.changeset/hot-crews-notice.md new file mode 100644 index 000000000000..5b11a82fda86 --- /dev/null +++ b/.changeset/hot-crews-notice.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: transform `$bindable` after `await` expressions diff --git a/packages/svelte/src/compiler/phases/3-transform/shared/transform-async.js b/packages/svelte/src/compiler/phases/3-transform/shared/transform-async.js index 444b8d7d9446..6ec789345230 100644 --- a/packages/svelte/src/compiler/phases/3-transform/shared/transform-async.js +++ b/packages/svelte/src/compiler/phases/3-transform/shared/transform-async.js @@ -55,7 +55,7 @@ export function transform_body(instance_body, runner, transform) { if (visited.declarations.length === 1) { return b.thunk( - b.assignment('=', s.node.id, visited.declarations[0].init ?? b.void0), + b.assignment('=', visited.declarations[0].id, visited.declarations[0].init ?? b.void0), s.has_await ); } diff --git a/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/Child.svelte b/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/Child.svelte new file mode 100644 index 000000000000..4214a85f3714 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/Child.svelte @@ -0,0 +1,8 @@ + + + +{value} + diff --git a/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/_config.js b/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/_config.js new file mode 100644 index 000000000000..a4ff70a8dc02 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/_config.js @@ -0,0 +1,35 @@ +import { tick } from 'svelte'; +import { test } from '../../test'; + +export default test({ + mode: ['async-server', 'client', 'hydrate'], + ssrHtml: ` + initial
initial
+ `, + + async test({ assert, target }) { + await tick(); + + assert.htmlEqual( + target.innerHTML, + ` + + initial +initial
+ ` + ); + + const button = target.querySelector('button'); + button?.click(); + await tick(); + + assert.htmlEqual( + target.innerHTML, + ` + + updated +updated
+ ` + ); + } +}); diff --git a/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/main.svelte b/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/main.svelte new file mode 100644 index 000000000000..e053fdda6a17 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-bindable-prop/main.svelte @@ -0,0 +1,9 @@ + + +{value}
+