From 6ca0c71fcda15981c3bb0c4b664a3cd2b3158dbf Mon Sep 17 00:00:00 2001 From: adiguba Date: Fri, 7 Feb 2025 21:10:08 +0100 Subject: [PATCH 1/4] set value/checked by JS --- .../svelte/src/internal/client/dom/elements/attributes.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js index eab27e6c02d5..0bdc4c772acd 100644 --- a/packages/svelte/src/internal/client/dom/elements/attributes.js +++ b/packages/svelte/src/internal/client/dom/elements/attributes.js @@ -387,10 +387,14 @@ export function set_attributes( let prev = input.defaultValue; input.removeAttribute(name); input.defaultValue = prev; + input.value = ''; + // @ts-ignore + input.__value = null; } else { let prev = input.defaultChecked; input.removeAttribute(name); input.defaultChecked = prev; + input.checked = false; } } else { element.removeAttribute(key); From 47b99143eea9252eff5ba9a9a18b687c763b6ee5 Mon Sep 17 00:00:00 2001 From: adiguba Date: Fri, 7 Feb 2025 21:29:26 +0100 Subject: [PATCH 2/4] test --- .../samples/attribute-spread-input/_config.js | 33 +++++++++++++++++++ .../attribute-spread-input/main.svelte | 22 +++++++++++++ 2 files changed, 55 insertions(+) create mode 100644 packages/svelte/tests/runtime-runes/samples/attribute-spread-input/_config.js create mode 100644 packages/svelte/tests/runtime-runes/samples/attribute-spread-input/main.svelte diff --git a/packages/svelte/tests/runtime-runes/samples/attribute-spread-input/_config.js b/packages/svelte/tests/runtime-runes/samples/attribute-spread-input/_config.js new file mode 100644 index 000000000000..ab941255037e --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/attribute-spread-input/_config.js @@ -0,0 +1,33 @@ +import { flushSync } from 'svelte'; +import { test } from '../../test'; + +export default test({ + async test({ target, assert }) { + // Test for https://github.com/sveltejs/svelte/issues/15237 + const [setValues, clearValue] = target.querySelectorAll('button'); + const [text1, text2, check1, check2] = target.querySelectorAll('input'); + + assert.equal(text1.value, ''); + assert.equal(text2.value, ''); + assert.equal(check1.checked, false); + assert.equal(check2.checked, false); + + flushSync(() => { + setValues.click(); + }); + + assert.equal(text1.value, 'message'); + assert.equal(text2.value, 'message'); + assert.equal(check1.checked, true); + assert.equal(check2.checked, true); + + flushSync(() => { + clearValue.click(); + }); + + assert.equal(text1.value, ''); + assert.equal(text2.value, ''); + assert.equal(check1.checked, false); + assert.equal(check2.checked, false); + } +}); diff --git a/packages/svelte/tests/runtime-runes/samples/attribute-spread-input/main.svelte b/packages/svelte/tests/runtime-runes/samples/attribute-spread-input/main.svelte new file mode 100644 index 000000000000..4bb4365ee270 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/attribute-spread-input/main.svelte @@ -0,0 +1,22 @@ + + + + + + + + + + From 577a8637e051415d73810e3ffd004dc0d1f5ea21 Mon Sep 17 00:00:00 2001 From: adiguba Date: Fri, 7 Feb 2025 21:34:13 +0100 Subject: [PATCH 3/4] changeset --- .changeset/fuzzy-zoos-repeat.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/fuzzy-zoos-repeat.md diff --git a/.changeset/fuzzy-zoos-repeat.md b/.changeset/fuzzy-zoos-repeat.md new file mode 100644 index 000000000000..3fb3f0502e57 --- /dev/null +++ b/.changeset/fuzzy-zoos-repeat.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: value/checked not correctly set using spread From 0531f279c50306462903379930e14b7ecd66b3c4 Mon Sep 17 00:00:00 2001 From: adiguba Date: Fri, 7 Feb 2025 22:37:30 +0100 Subject: [PATCH 4/4] fix test form-default-value-spread --- .../internal/client/dom/elements/attributes.js | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js index 0bdc4c772acd..21f347729c48 100644 --- a/packages/svelte/src/internal/client/dom/elements/attributes.js +++ b/packages/svelte/src/internal/client/dom/elements/attributes.js @@ -382,19 +382,18 @@ export function set_attributes( if (name === 'value' || name === 'checked') { // removing value/checked also removes defaultValue/defaultChecked — preserve let input = /** @type {HTMLInputElement} */ (element); - + const use_default = prev === undefined; if (name === 'value') { - let prev = input.defaultValue; + let previous = input.defaultValue; input.removeAttribute(name); - input.defaultValue = prev; - input.value = ''; + input.defaultValue = previous; // @ts-ignore - input.__value = null; + input.value = input.__value = use_default ? previous : null; } else { - let prev = input.defaultChecked; + let previous = input.defaultChecked; input.removeAttribute(name); - input.defaultChecked = prev; - input.checked = false; + input.defaultChecked = previous; + input.checked = use_default ? previous : false; } } else { element.removeAttribute(key);