fix/refactor: rewrite event.code --> event.key #8095
Closed
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fully cross-browser compatible
As we know, there may be issues with tracking event.code on mobile devices. In my experience, it is considered better practice to track key keyboard events rather than codes.
in this connection, I noticed a real bug in the InputOtp component on Chrome for Android: event.code is not even recognized by the browser.
As a result, on Android it is impossible to delete entered characters in InputOtp — the component listens for 'Backspace' via event.code, but the browser never provides it.
I initially started with just fixing the InputOtp bug, but then decided to migrate from event.code to event.key across the entire library for consistency.
All known quirks of event.key in older browsers have been taken into account.
There are many changes, but all of them are logically straightforward — it’s mostly a matter of verifying the event.code ↔ event.key mapping.
P.S. If this PR gets rejected, I’ll of course submit a small bugfix for InputOtp (just a few lines). However, it would be better to apply the event.code → event.key migration across the entire codebase for consistency.