Support Auto-Fill of Credit Card Information

[MichaReiser]

Hy

I registered today as a Project-R Member and stumbled upon the fact that 1Password wasn't capable to automatically fill the credit card information. I did some research on how the fields need to be named that autofill should work and found the following article from Google.

Would it be appreciated to change the field names to ease the checkout process?

Cheers, Micha

[MichaReiser]

Ok, I was wrong. I tested the auto functionality in more detail and found out, that it is more related to a timing issue.

What I see is that the fields are filled out by 1Password but after a very short delay, the values in the month and year fields are overridden by React with empty values. So it seems that the form is updated with outdated data (probably from an old state or so) instead of using the latest bound values in the form.

What I see is that there is an HTTP request taking place. So probably the form is updated in an async call without reading the latest values from the state or props.

The error does not occur if the credit card information has been filled out once, has been erased and is then filled in again.

Unfortunately, I'm unable to get the backend running on my machine. So I'm unable to debug the issue myself.

[tpreusse]

Hey Micha,

Thank you for reporting.

We are aware of this issue and haven't found an easy solution with react yet.

The solution will be to upgrade stripe.js and not manage credit card fields with react.js. We are currently one major version behind. Once we migrate to stripe.js v3 this will be mitigated afaik—the fields will then be managed by stripe.js without react.js. I'll leave the issue open in the mean time.