Adyen / adyen-web

Adyen Web Drop-in and Components
https://docs.adyen.com/online-payments
MIT License
181 stars 129 forks source link

PayPal - c.FUNDING undefined is not an object #2385

Closed y-a-v-a closed 1 month ago

y-a-v-a commented 11 months ago

Describe the bug

In our JavaScript error reporting tooling we see a recurring error reported which in short is formulated as follows:

TypeError: undefined is not an object (evaluating 'c.FUNDING')

The only reference I could find in your codebase is here: https://github.com/Adyen/adyen-web/blob/66e0be34f96ab300a7a72a05bd5091c0c0aefebc/packages/lib/src/components/PayPal/components/PaypalButtons.tsx#L51

To Reproduce

I do not know how to reproduce this.

Expected behavior

The error is not thrown or reported.

Screenshots

Screenshot 2023-10-23 at 13 25 57 copy

Desktop (please complete the following information): The error is evenly spread among Device, OS or Browser

Smartphone (please complete the following information): The error is evenly spread among Device, OS or Browser

ribeiroguilherme commented 11 months ago

Hi @y-a-v-a ,

What is the library version that you are using?

y-a-v-a commented 11 months ago

Hi @ribeiroguilherme , we're on "@adyen/adyen-web": "5.51.0",

ribeiroguilherme commented 11 months ago

@y-a-v-a Can you reproduce this in your testing environment? Do you have any insights about network connection speed and devices that caught this problem? This data could help bring some insights.

This problem is caused because PayPal SDK didn't fully load in the window object. So the UI component attempts to render the Button, although the SDK isn't loaded yet. We have proper mechanisms in place to render the button only when the PayPal SDK is fully loaded, but seems like we will need to iterate on this further.

y-a-v-a commented 11 months ago

@ribeiroguilherme I passed your comment on to a developer, we'll get back to you if we have additional info.

y-a-v-a commented 11 months ago

@ribeiroguilherme so far we can see that we have registered this same issue about 1.5 years ago under Adyen ticket #2768747 and was supposedly fixed in https://github.com/Adyen/adyen-web/pull/1837 At the moment we have no clue how to proceed, but I will try to find additional info with regard to the client's context.

y-a-v-a commented 11 months ago

Screenshot 2023-10-24 at 14 48 20

Screenshot 2023-10-24 at 14 51 46

ribeiroguilherme commented 11 months ago

Is the error above related to the first screenshot that you shared? Do you have the device type and iOS version by any chance? So we could try to reproduce it here..

Are you guys using Drop-in or standalone Components?

Regardless, I found this which could be related.

y-a-v-a commented 9 months ago

We're using Drop-in.

ribeiroguilherme commented 8 months ago

@y-a-v-a do you have more insights if this issue happens mainly on Safari browser?

TayyabSalmanMRM1996 commented 6 months ago

ribeiroguilherme do we have any updates on this issue?

The following are replication steps:

  1. Go to the checkout page and click on the PayPal checkbox to display PayPal buttons (Pay Later, PayPal, Venmo)
  2. Place an order with any payment method (Credit Card, GPay, PayPal).
  3. From the order confirmation page, GOTO the PDP by any means (except refreshing the page).
  4. Now add a product to the cart and go to the checkout page, click on the PayPal checkbox.
  5. By doing step 4, Pay Later, PayPal and Venmo buttons will not be displayed and an error (https://github.com/Adyen/adyen-web/issues/2385) will come on the console tab

I'm using Chrome on macOS

ribeiroguilherme commented 5 months ago

Hi @TayyabSalmanMRM1996 ,

Can you replicate this on https://www.mystoredemo.io/ and let us know? That can help us to debug the problem.

TayyabSalmanMRM1996 commented 5 months ago

@ribeiroguilherme I cannot replicate this here (https://www.mystoredemo.io/ ). But I can replicate this here https://adyen-salesforce-pwa-demo.mobify-storefront.com/

camil-adyen commented 2 months ago

Hi all!

A BETA version of Web v6 is now available on Github. Feel free to take a look and give us feedback! We aim to release the official v6 in the coming weeks. More information can be found here.

ribeiroguilherme commented 1 month ago

Hi guys,

We released the v6.0.0 version which has an improvement for this.

In case the PayPal script fails to load, an error will be triggered by theonError callback, containing the parameter error.type with SCRIPT_ERROR . Your code can react to that and update the UI accordingly (Ex: retry to mount the Component). Thanks for reporting it to us.

Cheers!