braintree / braintree-web

A suite of tools for integrating Braintree in the browser
https://developer.paypal.com/braintree/docs/start/hello-client/javascript/v3
MIT License
444 stars 134 forks source link

No event triggered if card has the same brand when number pasted #694

Open ruslantimofeev opened 1 year ago

ruslantimofeev commented 1 year ago

General information

Issue description

In our case when the user enters the card number we get the card details using tokenize method. I noticed if the user enters e.g. a VISA card 4929122456568726 then again copy-pastes a VISA but with other number e.g. 4916052077447437 the SDK doesn't trigger any events besides focus/blur. So there is no way to understand that the user entered another card and get its details.

Can the SDK be improved to trigger validityChange or empty/notEmpty to track the field has changed the value?

jplukarski commented 1 year ago

Hey @ruslantimofeev, thanks for writing in.

I'm not sure if it makes sense to trigger validityChange, empty, or notEmpty in this specific scenario because if you go from a valid card to another valid card there is neither a change in validity, nor a change in empty/not empty.

To better understand your use-case for this, what details are you hoping to get from the newly pasted card number? These events all return a state object payload with these hosted fields data for each field. This information would not change if a user pastes a different, valid card number that is the same brand.

ruslantimofeev commented 1 year ago

Hi @jplukarski , I see your point.

Our use-case is when the user enters card number we get the card countryOfIssuance to display different options depending on the country. Thus, if the user pastes another valid card number of the same brand we still display the options for the previously entered card even if the pasted one is issued by other country.

Perhaps, it makes sense to add a new event like cardNumberChanged, what do you think?

jplukarski commented 1 year ago

@ruslantimofeev thanks for the clarification. So you listen for change events and tokenize as soon as the card number is ready and valid? That makes sense; let me know if I am mistaken.

We can look into adding something like cardNumberChanged or a more generic onChange or onPaste event to our SDK for all fields. I'll make a ticket in our backlog, but we do have some other higher priority work in our pipeline so I cannot guarantee this will be completed soon. I will leave this issue open to help gauge interest in this feature from others.

In the meantime, would listening for the inputSubmitRequest help you achieve this? It wouldn't be perfect because it would rely on the user to hit enter or the mobile equivalent before displaying new information but it could be of some help to you here?

For internal tracking -> 3000

ruslantimofeev commented 1 year ago

@jplukarski

So you listen for change events and tokenize as soon as the card number is ready and valid?

That's correct.

I'll make a ticket in our backlog

Thank you

would listening for the inputSubmitRequest help you achieve this?

will take a look, thanks