search

woocommerce / woocommerce-gateway-stripe

The official Stripe Payment Gateway for WooCommerce
https://wordpress.org/plugins/woocommerce-gateway-stripe/
237 stars 206 forks source link

onChange handler not triggered when card details are autofilled #2550

Open alexflorisca opened 1 year ago

alexflorisca commented 1 year ago

Describe the bug

When using the stripe gateway plugin on the Checkout Block, the onChange handler here is not being triggered, and so the sourceId is not being reset.

This leads to the current payment attempt using an old sourceId, which inevitably fails. A good example of this is a user tries a card which fails (4000 0000 0000 0002), then a card which is valid (4242 4242 4242 4242). If the valid card is filled via a password manager for example, and is autofilled, then the onChange event is not triggered and the payment will use a stale sourceId.

To reproduce

  1. Store 2 cards in your password manager (bad: 4000 0000 0000 0002 and good: 4242 4242 4242 4242).
  2. Go to the Checkout Block with the Stripe Gateway plugin installed
  3. Use your password manager to fill in the bad card
  4. Click "Place Order"
  5. You should see a "Card is declined" error. All good.
  6. Fill in the card details with the good card using your password manager's autofill feature
  7. You should see the process hang for a while, then an error saying Sorry, we are unable to process your payment at this time. Please retry later.

    Expected behavior

I should be able to checkout successfully with a valid card, at any time

wjrosa commented 10 months ago

I tested the behavior with UPE disabled and could not reproduce it (the onChange handler is called for me). But it does not work for other team members. I will take a further look 👀

wjrosa commented 9 months ago

I was able to reproduce this issue later. This happens when you click the "Place Order" button directly without clicking anywhere on the screen before (which would force a blur in the field).

Despite apparently related to the blur call, I have included a log inside the onBlur element method and it is called even without forcing the blur (following the steps mentioned above). So, it must be something else.

I tried to fix this issue with a "hack": trigger the blur event before submitting the form. But I could not find a way to call it before the card form is disabled (so it had no effect). We need help here from someone more expert in the frontend I guess.

github-actions[bot] commented 1 month ago

Hi, This issue has gone 150 days (5 months) without any activity. This means it is time for a check-in to make sure it is still relevant. If you are still experiencing this issue with the latest version, you can help the project by responding to confirm the problem and by providing any updated reproduction steps. Thanks for helping out.

github-actions[bot] commented 1 week ago

This issue has gone 180 days (6 months) without any activity.