CardPayment Brick bug

[joxpulp]

Hi, I was trying to do a test payment and i notice that with this card numbers:

• 031755734530604 (15 length)
• 12554545454545 (14 length)

the card number input does not show an error message in the form:

Then when im trying to do a purchase, in the console this error is shown, this confuse users because they dont know where the error is unless they open devtools and see the console:

I notice that some generic error is shown:

But when using hidePaymentButton in true, the error is not showed

[meliguicarvalho]

Hi! Good afternoon!

Thanks for your feedback. Since you mentioned a few different situations, I will divide my answer in topics to make it easier to follow.

1 - The cardNumber input field currently cannot show an error when the card format is valid but the card is not supported by us or non-existent (the case you mentioned). This is a known issue that we have in our improvements backlog.

2 - When an user inputs a card number that is not supported, we do two things:
1 - Show an error in the form. (Improving this message is also in our backlog)
2 - Send a error in the onError callback for the seller so they can take action in the manner they seem most appropriate.
If the user ignores the error that was displayed when the card failed, and still tries to proceed with the payment, it will fail, because there is no payment information for that card, and therefore the payment cannot be fulfilled. We are aware that this is not ideal, and your feedback is important for us so we can prioritize improving this flow, and show clearer messages for our users.

3 - When the form button is hidden, we do not show an error message because we cannot know where the form ends (the seller can have more field in their form, for example). So we only give the seller feedback via the onError callback in the Brick, and it is up to the seller to handle this error in the manner they feel is more appropriate for their particular implementation.

Hope this answers your question. Your feedback is important so we can improve our error handling.

[joxpulp]

To me is really important that the error should be shown below the cardNumber input, like any other error from a validation, i just tried to do something like that using onError callback to show an error below the cardNumber input, but here is no a simple way to know when the user typed a valid card, since we dont have a validityChange event, to delete the error message.

--- Most simple way is to trigger a modal indicating that the card is invalid when user click on my custom buy button, since the modal can be dismissed or closed on user interaction this is the most simple way to handle this kind of errors, but is an awful user experience.

[icaldana]

Hello @joxpulp, we have taken your suggestion into consideration we are working on a improvement for that experience. We will let you know once the change is deployed.

Thank you for our contribution and partnership 💪🏼

[icaldana]

Good morning @joxpulp, the fix was deployed today! ❤️

[joxpulp]

@icaldana thank you, just tried and it works perfectly! 🙌🏽🕺🏽