For input[type=number] bound value not equal event value

[saibotsivad]

Reproduction of issue in this REPL: https://svelte.technology/repl?version=1.20.2&gist=348577339ab2e03462b1279b38d9975b

This issue occurs when using a bound value and the on:change event for an <input type="number"> element.

• What I did: enter a value in the input element, kill focus by clicking away, clear contents of input element, kill focus by clicking away.
• What happens: the first value shows up as the bound value and the event value as expected, but after clearing the input element and killing focus, the bound value is 0 while the event value is "".
• What I expect to happen: when an input element is cleared, the emitted on:change event value should allow for the empty string, and not coerce the value to 0.

[Conduitry]

Here's where type='range' and 'type='number' bound input values are getting converted to numbers. This was introduced in #436. I'm honestly not sure what the best path is here. Having access to the value as a number is nice. Is the empty string the only situation where we might lose information by doing that?

I've had unpleasant experiences in the past trying to do cross-browser stuff with input[type=number] and Angular 1. I'd rather users not have to deal with undefined vs an empty string vs a string that's a number vs an actual number. Having the bound value be set to "" when the field is empty may well be the best solution, but I'm wary about just jumping into that.

[Rich-Harris]

What about treating the empty string as undefined for number and range inputs? That seems to me like the most appropriate way to handle this case.

[Rich-Harris]

Opened #606 which implements that. Let me know what you think.

Is the empty string the only situation where we might lose information by doing that?

Yes, it's the only non-numeric value it's possible to enter in a number input — if you type anything else the browser just ignores you.

[saibotsivad]

Sorry for the absence. It works for me now, so thanks so much for finding a solution!