Paypal-checkout-components: [Bug] Unexpected behavior when closing the PayPal window before it loads

[romrz]

🐞 Describe the Bug

There is an issue when the PayPal popup window is closed before it loads. It shows a loading element that keeps loading forever and the PayPal button is no longer clickable.

It seems it only happens when there's an onClick callback. For some reason it makes the window load slower, it seems.

🔬 Minimal Reproduction

• Add an onClick callback to the Buttons implementation.
• Click the PayPal button
• Close the popup window before it loads

Here's a codepen where you can reproduce it: https://codepen.io/romrz/pen/GRoNQKx

😕 Actual Behavior

The window is closed, but then the overlay appears with a loading element that keeps loading forever. No console errors are shown.
After closing that overlay, the PayPal button is left unresponsive.

🤔 Expected Behavior

The popup window is closed and then you can click the PayPal button again to re-initiate the payment process

🌍 Environment

• Browser version: 81.0.4044.129
• OS version: Mac OS Catalina (10.15.4)
• SDK version (window.paypal.version): 5.0.128

Affected browsers

Tested on Chrome and FireFox

➕ Additional Context

Here's a video of the issue in the codepen shared above: https://share.vidyard.com/watch/1jAbWvn7Z925VpDePdH4mx?

[mnicpt]

Hi, @romrz! I was unable to reproduce clicking on the PayPal Button but was able to with the PayPal Credit button. I noticed you didn't have a Credit button in the video.

[mnicpt]

@romrz Do you have a live site that this was occurring in? I am unable to reproduce on our live site: https://developer.paypal.com/demo/checkout/#/pattern/client

Could be something going on with CodePen.

[romrz]

Thanks for the reply @mnicpt. Yes, it's happening on a live site (I'll share it with you if you can't reproduce). But I think you just have to be quick enough to close the window before the background overlay shows up. You can also try using a keyboard shortcut to close the window faster (cmd + w on mac, ctrl + w on ubuntu and ctrl + shift + w on windows I think).

[romrz]

@mnicpt and it's not happening on your live site because it seems it only happens when you have an onClick callback on the buttons implementation.

[mnicpt]

@romrz You can add onClick on our site and it will refresh. I was able to reproduce on CodePen for the Credit button only, but maybe I wasn't clicking fast enough.

[romrz]

@mnicpt I added onClick on your live site and I was able to reproduce it there too: https://share.vidyard.com/watch/cfwQbhRLAzvsDekk5A6cZz?

[mnicpt]

@romrz Thanks for confirming.

[romrz]

@mnicpt Hi, were you able to reproduce? Do you have any updates on this? Let me know if you need anything else from me. Thanks!

[mnicpt]

@romrz I was able to reproduce. While this is an edge-case, I am looking into a fix. Thank you for your patience.

[romrz]

@mnicpt Thank you very much!

[mnicpt]

@romrz This has been fixed in the latest release. Thank you for bringing this to our attention.

[romrz]

Thank you very much for taking care of this @mnicpt

[mnicpt]

My pleasure @romrz :)

[github-actions[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.