I can't use my number pad for 2FA codes
By @edent
· HTML javascript security ui ux · 10 comments · 400 words · read ~5,040 times.
This has to be the most infuriating bug report I've ever submitted.
I went to type in my 2FA code on a website - but no numbers appeared on screen. Obviously, I was an idiot and had forgotten to press the NumLock button. D'oh! I toggled it on and typed again. No numbers appeared. I switched to another tab, my numbers appeared when I typed them. So I was reasonably confident that my keyboard was working.
I swapped back to the 2FA entry and tried again. Still nothing. Then I tried typing the numbers using the number row on my keyboard. My 2FA code appeared.
WHAT IN THE SAINTED NAME OF ALPHONSE CHAPANIS IS GOING ON?!?!?
Developers often use JavaScript to "improve" the standard features of HTML. For example, using <input type="number"> has some accessibility concerns and using inputmode="numeric" is great for showing a number key board on mobile, but not much else.
So a developer wants a reliable way to make sure a user can only type numbers. Fair enough.
There are two ways to do this - a right way and a wrong way - using KeyboardEvent.
One way is to listen for the character being sent from the keyboard - known as the key.
The other is to listen for the button being pressed on the keyboard - known as the code.
A good demo of this is at keyjs.dev - play around with it to see what keyboard buttons your browser can detect.
When I press 7 on the top row of my keyboard, the key is 7 and the code is Digit7.
But when I press 7 on my number pad, the key is 7 but the code is Numpad7.
The JavaScript on the website was rejecting any key code which wasn't a "Digit"!
Perhaps I am a weirdo for insisting on both having and using my numpad? Perhaps developers need to test on something other than MacBooks? Perhaps JavaScript was a mistake and the Web would be better without it?
Either way, don't be like that website. Let users type in using whatever keys they like.
Mastodon
Twitter
Facebook
LinkedIn
Reddit
HackerNews
Lobsters
Pocket
WhatsApp
Telegram
@blog Sometimes I think that ability to add dynamic code, like JavaScript, to websites was a mistake...
@Edent Sorry, our app only supports 60% layout mechanical keyboards, it's in the TOS.
@blog I've run into this too some time ago, it's infuriating to say the least!
Can you not remap your numberpad keys so that that send "Digit7" etc?
Not that you should have to, but needs must...
@Edent
Can't boost this enough.
I've experienced this in the past, too.
It matches the lack of thinking of the devs that block copy/paste.
🤯
I can't use my number pad for 2FA codes | Hacker News
@Edent the bright javascript developers who decided to override system input mechanisms are fucking anathema.
(in many payment interfaces i cannot use compose key to type my proper name because some fucking genius decided that they will accept only raw keystrokes. ah, and of course no paste. because why would i want to paste my credit card number from my secret vault, when i can fucking type it.)
You are a weirdo for having and using a numpad, but the developers of that website are even more wrong than you!
@Edent
That’s almost as bad as when they disable pasting into password fields. Way to encourage people to use crappy short passwords.
IMO browsers shouldn’t even permit that. It’s -my- browser on -my- computer. If I want to paste and the websty doesn’t want me to, too bad. I could not care less about what they want even if you paid me to.
I also built a demo page showing JavaScript keyboard events and their codes. I'm sharing here hoping it helps other developers: https://codepen.io/denilsonsa/pen/epmoma
More comments on Mastodon.