InputNumber: Cannot insert value on Android

[nankoviliya]

Describe the bug

Describe the bug

I'm trying to insert value into the InputNumber component on https://primereact.org/inputnumber/ using my Android device, but the input doesn't accepted. Please, watch screen record below.

Tried this on Iphone 11, Safari, Firefox, cannot reproduce the issue.

Screen Recorded : https://github.com/primefaces/primereact/assets/63155421/c3e4434a-be16-4f39-bd24-4e2b0bcd13f9

Device: Redmi 7; Android 10

Reproducer

No response

PrimeReact version

10.6.2

React version

17.x

Language

TypeScript

Build / Runtime

Create React App (CRA)

Browser(s)

Chrome 123.0.6312.80

Steps to reproduce the behavior

No response

Expected behavior

Input accepted

[nankoviliya]

The issue is presented in MI Browser too.

[melloware]

@ilis08 can you go here and type the number 5 on your Android and show the results:

https://w3c.github.io/uievents/tools/key-event-viewer.html

For example in Windows when I press 5 this is what it looks like

[melloware]

OK yeah its an Android problem . See that your keycode is 229 and unidentified. Not sure what version of Android you are using but that looks like a bug. The number 5 should register as Digit5 and keycode 52 not generic 229. I bet all your numbers are showing up as 229. Android is a mess like this...

[virgil31]

Yeah we have the same problem at work. I personally can confirm this same issue using:

*Device: Redmi Note 10 Pro
*OS: Miui 14.0.9 Global
*Android version: 13
*Browser tested: Chrome, Brave

Of course I experience the very same problem both on our fresh Vite-started project and the PrimeReact components'showcase/demo.

[virgil31]

I want to add that switching to the "9.6.5-SNAPSHOT" version in the component showcase (https://v9.primereact.org/inputnumber/) make the problem go away and it is working as intended on my mobile device (see previous comment for infos).

[melloware]

Android is a total mess see: https://stackoverflow.com/questions/36753548/keycode-on-android-is-always-229

Only device/browser that doesn't properly implement onKeyDown and onKeyUp. cc @FlipWarthog

Did a bit research for this one, seems it's an Android chrome browser issue. The keyup and keydown events always return key code 229 as a composition that buffers the user’s keystrokes.

This has great info: https://javascript.info/keyboard-events#mobile-keyboards

Here are some discussion but no solution presented:

facebook/react#6176

http://stackoverflow.com/questions/30743490/capture-keys-typed-on-android-virtual-keyboard-using-javascript

https://bugs.chromium.org/p/chromium/issues/detail?id=118639#c259

[melloware]

10.6.3 is released can you try again @ilis08 @virgil31

[virgil31]

10.6.3 is released can you try again @ilis08 @virgil31

It works!
Both our fresh Vite-started project and the PrimeReact components'showcase/demo are ok.
Multiple Android devices tested (Xiaomi, Redmi, Samsung).

Thanks for your time and feedback @melloware !

[melloware]

@virgil31 thanks to @FlipWarthog for lending me an Android device!

[FlipWarthog]

@melloware all this complaining about Android I had to get you in front of one. It was a fun puzzle

[nankoviliya]

10.6.3 is released can you try again @ilis08 @virgil31

It works! Both our fresh Vite-started project and the PrimeReact components'showcase/demo are ok. Multiple Android devices tested (Xiaomi, Redmi, Samsung).

Thanks for your time and feedback @melloware !

Yep, I can confirm it works on my Redmi 7. Thanks @melloware , great job!