diff --git a/CHANGELOG.md b/CHANGELOG.md index e5e886646c..5c4ca12b51 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ * Include selector in message of `unused-css-selector` warning ([#5252](https://github.com/sveltejs/svelte/issues/5252)) * Fix using ``s in child `{#await}`/`{#each}` contexts ([#5255](https://github.com/sveltejs/svelte/issues/5255)) * Fix using `` in `{:catch}` ([#5259](https://github.com/sveltejs/svelte/issues/5259)) +* Fix setting one-way bound `` `value` to `undefined` when it has spread attributes ([#5270](https://github.com/sveltejs/svelte/issues/5270)) ## 3.24.1 diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index 8c2c0344e9..b3533d2fa0 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -725,6 +725,18 @@ export default class ElementWrapper extends Wrapper { block.chunks.update.push(b` if (${block.renderer.dirty(Array.from(dependencies))} && ${data}.multiple) @select_options(${this.var}, ${data}.value); `); + } else if (this.node.name === 'input' && this.attributes.find(attr => attr.node.name === 'value')) { + const type = this.node.get_static_attribute_value('type'); + if (type === null || type === "" || type === "text" || type === "email" || type === "password") { + block.chunks.mount.push(b` + ${this.var}.value = ${data}.value; + `); + block.chunks.update.push(b` + if ('value' in ${data}) { + ${this.var}.value = ${data}.value; + } + `); + } } } diff --git a/test/runtime/samples/spread-element-input-value-undefined/_config.js b/test/runtime/samples/spread-element-input-value-undefined/_config.js new file mode 100644 index 0000000000..d66e215cde --- /dev/null +++ b/test/runtime/samples/spread-element-input-value-undefined/_config.js @@ -0,0 +1,12 @@ +export default { + async test({ assert, component, target, window }) { + const input = target.querySelector("input"); + component.value = undefined; + + assert.equal(input.value, "undefined"); + + component.value = "foobar"; + + assert.equal(input.value, "foobar"); + } +}; diff --git a/test/runtime/samples/spread-element-input-value-undefined/main.svelte b/test/runtime/samples/spread-element-input-value-undefined/main.svelte new file mode 100644 index 0000000000..5c9121dc03 --- /dev/null +++ b/test/runtime/samples/spread-element-input-value-undefined/main.svelte @@ -0,0 +1,5 @@ + + + \ No newline at end of file