Problem statement: Currently, our requirement is when we change the focus, especially for card-sensitive fields if they are not valid then show the error and disable the pay button. However, this same logic needs to be updated user changing input of card-sensitive fields/mandatory fields, the pay button should be enabled/disabled and no errors should be visible except the card number component.
Changes: Added logic in oninputChange functions for all card sensitive components to enable/disable pay button and to not show errors on it while typing it
Test Steps
If there's any functionality change, please list a step by step guide of how to verify the changes, and/or upload a screen recording for any visible changes.
Add data into all card-sensitive fields and verify the pay button while changing all details of it. For instance, fill in all data for the card number, expiry date and CVV. Then change the data and see the pay button state. On invalid/incomplete data, the pay button would be disabled and no error shown. However, on focus change error will popup
Checklist
Put an x in the boxes that apply. You can also fill these out after creating the PR. If you're unsure about any of them, don't hesitate to ask. We're here to help! This is simply a reminder of what we are going to look for before merging your code.
[X] Reviewers assigned
[X] I have performed a self-review of my code and manual testing
[X] Lint and unit tests pass locally with my changes
[ ] I have added tests that prove my fix is effective or that my feature works
[ ] I have added necessary documentation (if applicable)
Further comments
If this is a relatively large or complex change, kick off the discussion by explaining why you choose the solution you did and what alternatives you considered, etc...
Issue
PIMOB-1631
Proposed changes
Changes: Added logic in oninputChange functions for all card sensitive components to enable/disable pay button and to not show errors on it while typing it
Test Steps
If there's any functionality change, please list a step by step guide of how to verify the changes, and/or upload a screen recording for any visible changes.
Checklist
Put an
xin the boxes that apply. You can also fill these out after creating the PR. If you're unsure about any of them, don't hesitate to ask. We're here to help! This is simply a reminder of what we are going to look for before merging your code.Further comments
If this is a relatively large or complex change, kick off the discussion by explaining why you choose the solution you did and what alternatives you considered, etc...