Input with "delay" on Android web browsers based on Chromium (Chrome, Edge, Samsung Internet...)

[AndreiMartini]

Current behavior

When I type any value in a input field, it only fire the input event after a second value typed.
for example, I have an percentage field where I inform how much the percentage sales commission will be, then I set this value to another field and from that field it calculates the comission from this sales, but it has an delay and only recongnizes all of the value after I press the space or other key.

Expected behavior

At the time that I type any value, the input event should be fired at the same time, just like it happens at desktop web browsers.

Steps to reproduce the problem

1. Use autoNumeric version v4.10.0
2. In the browser Chrome or Chromium Based version 122.0.6261.90
3. On the Android 13 operating system
4. Type any value into an input field and set this number to another field.
5. It will only set the number after a next input

Link to live example (ie. Codepen)

https://jsfiddle.net/AndreiMartini/j3zc6ghy/

[AlexandreBonneau]

Everything works as expected with no delay :

• On desktop Firefox
• On desktop Chromium
• On Android 11 Firefox
• On Android 11 Chrome
  Sorry but I cannot reproduce that bug. Perhaps this is only on Android 13?
  Have you tried on another phone?

[AndreiMartini]

Yes, I've also tried on Samsung Tablet A9 with Android 10, maybe I couldn't explain myself correctly, when I said "delay", I meant that the last value entered would only be defined in the field that is used for the calculation after some other value has been entered or even the space,
for example, if I type 4.5 on the input field, the value defined it's going to be 4, not the 4.5 that I've typed.
If I made a video showing what is happening, would help?

[AlexandreBonneau]

I did not notice any 'delay' like you meant.
Android key input management has always been pretty bad compared to the desktop, so it might be possible that could be the cause on your device.

Either a video, or better yet, a smaller reproducible test case, because your code could be the cause too (and not AutoNumeric per se)

[AndreiMartini]

Ok, I've recorded the video from my phone, using Chrome and this test code https://jsfiddle.net/AndreiMartini/j3zc6ghy/

Screen_Recording_20240301_161729_Chrome.mp4

As you can see in the video, the value that I enter in the "% Comissão Atendente (Preço Especial)" field is only defined in the "Comissão Atendente:" field after some other value has been typed or pressed on the space, that is, for the field receive the value, you need to press a key

[AlexandreBonneau]

I've created a reproducible test case with only the code that is related to AutoNumeric here.

Please test this on your device

[AndreiMartini]

Hello!
I was able to reproduce the problem with your code.
May I ask you, how are you testing? Because I've tried with Android Simulator and the problem didn't occur, but with and Android Phone the problem occurred.

[AndreiMartini]

Another example is when you run Chrome in debug mode. If the input comes from the computer keyboard the code works great but when the input comes from the device the problem occurs

The first video shows me using Chrome in Debug mode and typing on the tablet:

DevTools.-.codepen.io_AnotherLinuxUser_pen_XWQJXrz_editors.1011.2024-03-04.09-52-321.mp4

As you can see, the last value I type is 100,000 and the only way it recognizes this value is when I press another key(space bar for example), then it calculates the value using 100,000

The second video shows me using Chrome in Debug mode and typing on my computer keyboard:

DevTools.-.codepen.io_AnotherLinuxUser_pen_XWQJXrz_editors.1011.2024-03-04.09-52-591.mp4

here, when I type the value, it calculate at the same time and I don't need to press another key to make it do it

The behavior is different in both cases, it depends on where the input comes from, if it is from the Android device the problem appears, but if the problem comes from a computer keyboard the code runs without problems

[AndreiMartini]

Hi, I don't know if this could help or give you a direction
But I tried setting the input type to "tel" instead of text and with the numeric keypad that appears, the problem no longer happened. Even in your code it didn't happen anymore after making this change.

[AlexandreBonneau]

Thanks for following-up @AndreiMartini. Your last comment gives more insight to the problem, thanks.

Fixing bugs introduced by the way mobile devices handle inputs are always very, very tricky and time consuming.
The best help would be a PR of course :)
Otherwise this will get fixed..whenever I'll have enough time to investigate this, sorry.