HTMLInputElement type number fun fact

I am a web developer by day and was working on a feature that was supposed to create an input field that could only accept numbers. Super easy right?!

<input type="number" />

I’m demoing said feature to the client (after having tested this) and I’m bashing on the home row and nothing is printing. I type some numbers and they print. Then I grab some text and paste it in an bam, a single letter e. That’s weird. I try another word. Another letter e. Hmm. I tell the client we’ll look into it.

I shared this with a coworker and they were able to produce the same behavior. I then decided to look up the issue on the internet and of course this is a well known thing. I dig a little deeper and realize that the HTML spec allows for this behavior because of floating point numbers. For instance 2e5.

Anyways, that was a fun little journey.

Link to the HTML spec for input type=number

I was listening to the FunFact (@funfactfm) podcast recently and they mentioned this website. I finally got around to looking at it and it’s so cool! Here is the site by Neal Agarwal (@nealagarwal) about the deep sea. He also has a bunch of other cool sites at his website. Enjoy!