[BUG] Card Error Causes Inoperable Checkout Button

There is a bug with your plugin causing the checkout button to become inoperable after some specific payment errors. I think it only occurs after a 3DS2 payment error but I wouldn’t know if that’s the extent without digging through your code.

I encountered this bug in a real world scenario, not during testing as a developer. I was trying to make a real purchase on a live website that I have no affiliation with.

I mistakenly used a card which had recently expired instead of my new one that hasn’t yet arrived in the mail. Some card brands will expire on the month, whereas some card brands will expire at the end of the month. In this case, my credit card expired on 09/24 not the end of 09/24 so the client-side validation doesn’t (and shouldn’t) catch this as a validation error.

My card provider required 3DS verification because I was delivering to an overseas address where I’m currently located and this would have been flagged as unusual activity; regardless of why 3DS verification was required, it should work, particularly in regions where 3DS is triggered on every new transaction.

The 3DS challenge dialog had opened but then immediately closed with an error – no user interaction, it just opened and closed automatically.

I don’t remember the exact wording of the error but it was vague like “Your card was declined.” Regardless of what the error said, I knew my mistake was having used my old card so I used my bank app to locate the new card details, since the card hasn’t physically arrived yet but when trying to press the checkout button it didn’t do anything.

I tried using another payment method (PayPal) on their website but again the checkout button didn’t work.

I eventually figured the checkout button wasn’t doing anything, something had made it disabled it.

As a developer myself, their checkout payment methods all looked pretty standard and familiar; and this scenario I encountered myself is quite plausible to occur by others in the real world so its a situation that should be tested for and handled.

I retested this with my own customers websites who were using your Stripe plugin, again using my expired card and sure enough the same bug was encountered.

I setup a development site and retested the bug using the test cards in Stripe which I was able to reproduce the problems under a sandbox scenario too.

KEY POINTS

• Checkout button is disabled after some payment failure errors using the Stripe payment method.
• After such error, no other payment method can be used.
• Refreshing the page makes the checkout button operable again.
• Does not occur on the WooCommerce Checkout Block Elements in my limited testing.
• Occurs in the WooCommerce Classic Checkout.
• Such payment errors seem to be related to unexpected 3DS errors but I don’t know if that’s truely a factor or if it just so happens to touch related code.
• I have not tested with subscription products. Tested only with physical goods (simple and variable products).
• It doesn’t matter if you’re logged-in or a guest checkout.

HOW TO REPRODUCE

1. Configure your test environment to use the classic WooCommerce checkout page.
2. Navigate to the classic checkout page.
3. Card details:
   1. In test sandbox mode use: 4000 0084 0000 1280
   2. In live production mode, use any card which expired on the current month & year date.
4. When pressing the complete checkout button it will have an error about the card being declined.
5. The error itself (persistently disables the checkout button)
   1. Try providing a valid credit card and pressing the checkout button, it won’t work.
   2. Try changing to another payment method and pressing the checkout button, it won’t work.

I have been able to reproduce this bug on any live website using this plugin production by using my card.

Video demo of this bug: https://youtu.be/lQsmTOjQ3HM