Controlled number input doesn't handle e, - and . properly

[dhruska]

A controlled number input, without a corresponding setState function, still allows e, - and . to be entered (and numbers can be inputted afterwards). I could be incorrect but I don't believe this is the desired behavior.

Here's a JSFiddle demonstrating the issue.

[jimfb]

Sounds like a bug, probably a good first one.

[zpao]

It's probably not a "good first bug" (it will surely involve at least looking at our event system, which is anything but good for a first dive into the code). But people are welcome to try :)

[jimfb]

Yeah, I was torn on labeling this one. We need a "good third bug" label :).

The reason I thought it might be a reasonable first one is that the code from controlled text inputs can probably be copy-pasted here nearly verbatim. In fact, I'm a little surprised it doesn't already follow the same code path.

[zpao]

I'm pretty sure that typing in a <input type="number"> doesn't fire the same events (or only fires them for some interactions) so we just don't even know anything is happening. Otherwise I'm mostly sure the we don't differentiate between text and number types so we're already running the same code.

[syranide]

I'm pretty sure this is just another case of these special inputs not playing well with being controlled, -e. are all part of valid numbers but only specific combinations actually translate to valid numbers. If the content does not translate to a valid number then the reported value is '' and it acts as if nothing has changed, AFAIK there is no way around this, at all.

[jimfb]

Yep, @syranide is correct. https://jsfiddle.net/1tscfoLf/

Not sure if there is anything we can do about this at the moment, short of writing our own handlers based on cursor position and keystrokes. Maybe that's what we need to do. (or request revisions from W3C, but that's a longer term thing)

[ccorcos]

I found this bug too!

https://jsfiddle.net/tmbbau6a/

Any ideas for work arounds?