Base.Events: Event [payments.validated] callback resulted in an exception: TypeError: Cannot read property 'nonce' of undefined

[hrncek]

General information

dropin 1.19.0 Production Chrome Version 75.0.3770.142 (Official Build) (64-bit)

Issue description

Random errors in console log during using of credit card and paying

https://includes.ccdc02.com/cardinalcruise/v1/ec76e625fd00ce8210aa/1.ec76e625fd00ce8210aa.songbird.js Base.Events: Event [payments.setupComplete] callback resulted in an exception: TypeError: i._getDfReferenceIdResolveFunction is not a function

and https://includes.ccdc02.com/cardinalcruise/v1/ec76e625fd00ce8210aa/1.ec76e625fd00ce8210aa.songbird.js Base.Events: Event [payments.validated] callback resulted in an exception: TypeError: Cannot read property 'nonce' of undefined

Using 3DS

// Initialization
braintree.dropin.create({
                authorization: self.braintreeToken,
                container: '#braintree-payment-form',
                paypal: {
                    flow: 'vault',
                    buttonStyle: {
                        color: 'blue',
                        shape: 'rect',
                        size: 'medium'
                    }
                },
                threeDSecure: {
                    amount: self.price()
                }
            }, function (createErr, instance) {
                if (createErr) {
                    failedToInitialize();
                }
                self.braintreeInstance = instance;
            });

[crookedneighbor]

Added code blocks around your snippet to make it a little easier to read.

Do you have a staging site where we can inspect the error that is occurring?

[hrncek]

Unfortunately no, but I can provide sources if needed to you on private

[hrncek]

Also this one during initialization

1.ec76e625fd00ce8210aa.songbird.js:17 Base.Message.Init: Init completed slowly n.cerror @ 1.ec76e625fd00ce8210aa.songbird.js:17 n.sendLogItemsConsole @ 1.ec76e625fd00ce8210aa.songbird.js:17 i.sendBatch @ 1.ec76e625fd00ce8210aa.songbird.js:17 i.log @ 1.ec76e625fd00ce8210aa.songbird.js:17 t.log @ 1.ec76e625fd00ce8210aa.songbird.js:17 t.error @ 1.ec76e625fd00ce8210aa.songbird.js:17 (anonymous) @ 12.ec76e625fd00ce8210aa.songbird.js:2

[crookedneighbor]

Send a reproducible example to: https://help.braintreepayments.com/

Please provide a sample client token as well.

[hrncek]

Hey I created test environment: https://wachete-test-ne.azurewebsites.net/ Click sign in -> enter email hrncek@gmail.com and password testing Click -> profile -> Buy subscription -> Start free 7 days trial -> Fill company name and choose country -> click next

When braintree loads the Error Base.Message.Init: Init completed slowly shows in console.

If you would enter Credit card and continue the other error will pop up

[Adam4224]

I'm getting the exact same issue at braintree.dropin.create. Contents of my console log:

`VM3048:1 Cross-Origin Read Blocking (CORB) blocked cross-origin response https://www.paypal.com/xoplatform/logger/api/logger with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details.

5.83a3dc284ae5fa04311c.songbird.js:2 Base.Events: Event [payments.setupComplete] callback resulted in an exception: TypeError: i._getDfReferenceIdResolveFunction is not a function

VM3048:1 Cross-Origin Read Blocking (CORB) blocked cross-origin response https://www.paypal.com/xoplatform/logger/api/logger with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details.

---

I should add that I'm lazy-loading these scripts: https://js.braintreegateway.com/web/3.47.0/js/client.min.js https://js.braintreegateway.com/web/3.47.0/js/data-collector.min.js

And eager-loading this one: https://js.braintreegateway.com/web/dropin/1.19.0/js/dropin.min.js

On the page. All have been loaded at the point where the error occurs.

---

Edit: The same happens if all three scripts are eagerly loaded. Testing on localhost.

[hgshoggins]

Randomly happening to me as well on Firefox. The console reads:

Base.Events: Event [payments.setupComplete] callback resulted in an exception: TypeError: self._getDfReferenceIdResolveFunction is not a function

Although I cannot see a direct link, it seems that this error then leads to a TypeError: "payload is undefined" after instance.requestPaymentMethod(function (requestPaymentMethodErr, payload) is fired, and so the nonce is never generated and the transaction cannot complete.

Braintree-web version is 3.50.0 Braintree-web-drop-in version is 1.19.0

Both are loaded in a browserified script with modules retrieved from npm.

[crookedneighbor]

^ we just figured out that error this morning. Hoping to get a release out this week.

[crookedneighbor]

This is fixed in the underlying SDK. The next release of Drop-in will include the fix. Will update here when it's out.

[hgshoggins]

Version 3.50.1 of braintree-web is out on npm, however I'm still getting the same error.

[crookedneighbor]

@hgshoggins That's because the underlying sdk needed to be updated in Drop-in, which we've just done in v1.20.0. Issue should be fixed now.

[fzan]

got this error today on braintree-web-drop-in 1.20.1

That's the full stacktrace:

[hgshoggins]

Are you using the latest version(s)? My problems disappeared with up-to-date libraries.

[fzan]

yes. The version is ^1.20.1 in my package.json.

Please note that is in a sandbox environment, still not going live

[crookedneighbor]

@fzan please contact our support team so we can figure out exactly what went wrong.

https://help.braintreepayments.com/

[tassamartz]

I faced the same issue with the latest version 1.22.1, however when trying with the version 1.20.2 it is working fine. Could you please provide an update on the issue here ?

[crookedneighbor]

@tassamartz please contact our support team with steps to reproduce and we'd be happy to look into it and fix it if the problem is at the SDK level.

https://help.braintreepayments.com/