LG-6114: Use Cleave.js to format personal key (IdV app) #6217
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.
Why: So that the value is more readable as the user types, and to ensure feature parity with the existing experience.
Testing Instructions:
idv_api_enabled: "true"
in localconfig/application.yml
Implementation Notes:
Cleave.js includes a built-in React component: https://github.com/nosir/cleave.js#reactjs-component-usage
Initially I had tried to custom-implement the formatting, since Cleave.js is a pretty large dependency, but opted against this approach after realizing it's a pretty tricky implementation!
For follow-up: We should upgrade our version of
@testing-library/user-event
, since we're using an older version of the API, which will require some breaking changes to upgrade.