undefined value on input and other elements

[PatrickG]

Describe the bug
The value prop behaves differently in various situations.

Suppose we have a variable let value = undefined.

If you use it on an input element with two-way binding <input bind:value />, the value is not set (this is the correct behavior, it got fixed in #3430).
If you use it on an input element like this: <input {value} />, the input elements value property is set to the string 'undefined' (not the attribute).
If you use it on any other element, like: <option {value} />, the value attribute is set to "undefined".

To Reproduce
https://svelte.dev/repl/9a8cf877df9a47948eb0cd3b04ea8372?version=3.19.1

Expected behavior
I think the value attribute (without two-way binding) should behave like the disabled attribute in the repl.

Severity
low

Additional context
You can get around it with <input value={value || ''} />

[Conduitry]

Is this the same as #3569?

[PatrickG]

Not really. Its more about the inconsistency when not using two-way binding vs using two-way binding.

[dgellow]

You can get around it with <input value={value || ''} />

That doesn't work as expected when using <input type="submit value={value || ''} />. That results in a submit button with no text instead of the expected "Submit".

Edit: it's a detail, just worth pointing out that this workaround has some unexpected effect.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[PatrickG]

This is fixed in Svelte 5

[theodorejb]

This is fixed in Svelte 5

It doesn't seem to be fixed completely. I just ran into this issue with Svelte 5.19.0.

When an input element is initially rendered, if the value attribute is undefined, then the attribute isn't added to the DOM (as expected). However, if the value attribute is not undefined, and then the bound value changes to undefined, then the input unexpectedly displays "undefined". This behavior is unexpected, and inconsistent with two-way bindings, where undefined is never displayed. It is also inconsistent with null, which is never displayed in either case.

Reproduction (click the "Toggle value" button twice): https://svelte.dev/playground/9a8cf877df9a47948eb0cd3b04ea8372?version=5.19.0#H4sIAAAAAAAACn1RQU7DMBD8ymrFoZWASByDm4obdxAXzCFNtq2FWVvxpqGK8ndsp4hKQE_WzszOzMojcv1BWOIjWetgcJ1t8Rq3xlLA8nVEOfpEJyDiJ_GD97fhQFYStqkD_YU3joVYog2q0HTGS6VZiyUBoSCwgqsgtdBieR_xyGx7bsQ4BnG7naWX2vaRhDFxWk47-VlDzy1tDVMLJWhMoMZkI5NmVfzEsdrfVdkJTIDxSTrDu0XSLydVRC5rfG6mNr1Iio8nrzTOk0Zw3FjTvK_Gs15T9ZwHOKRJFbO4SuH-29Ow7wUGI3tQjWupGjVmeXSKBSaNsUImYOGYbob6CBvDbWy4LGcfNXucb0FxyT_tl_-FyOAuhPxazUnxI4U-BUvp4tVv0xfc95kSMQIAAA==