Mobile strange repeated codes
lesrpo opened this issue · comments
Hello There!
While testing the mobile capabilities, I notice some strange behavior on deleting and typing again the number.
To replicate I use chrome on my mobile phone with the examples page
https://catamphetamine.gitlab.io/react-phone-number-input/?#with-country-select
I tested 'Force international format' examples
Record_2023-02-02-01-19-13.mp4
Do you have any idea why is this happening?
Thank you
In the first case, you first erase the input so that the caret position becomes 0.
Then you enter a digit X and the caret position becomes 1.
Then the <input/> triggers onChange() event and the component sets the <input/> value to +X which should also reset the caret position (it should move it to the end). At least that's what it does in a desktop web browser. But for some weird reason, the mobile browser doesn't reset the caret position in that case.
So I'd say it's incorrect browser behavior.
In the second case, you erase the 7 character and the cursor "falls through" it. But it shouldn't do that: it should be placed at the end of the <input/> because its value has been changed externally.
Same issue.