braintree-web
braintree-web copied to clipboard
Specific PayPal API error message handling
General information
- SDK version: 3.106.0
- Environment: Sandbox
- Browser and OS Version 127.0.6533.120 (Official Build) (64-bit) on Windows 11 Enterprise 23H2
Issue description
When creating a PayPal Checkout there isn't a way to intercept a user closing the pop out modal before it has fully loaded - when a user does this the onError callback returns the following message Error: Detected popup close.
The current solution is to handle the error this way:
onCancel: () => {
showInfoBanner('PayPal Payment cancelled');
},
onError: (e) => {
switch (e.toString()) {
case 'Error: Detected popup close':
showInfoBanner('PayPal Payment cancelled');
break;
default:
showError('PayPal error');
}
},
This solution however isn't ideal. The error stack trace seems to indicate that the generic message is retrieved from the PayPal SDK but isn't parsed in any meaningful way.
Error: Detected popup close
at https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:118015
at e.dispatch (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:14426)
at e.resolve (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:13483)
at e.dispatch (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:14646)
at e.resolve (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:13483)
at https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:13127
Error: Detected popup close
at no.error (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:76410)
at Array.<anonymous> (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:84791)
at JSON.parse (<anonymous>)
at o (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:84650)
at po (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:84803)
at Oo.u.on (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:89387)
at Oo (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:89507)
at https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:95826
at n.try (https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:17031)
at https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:95623
at https://www.paypal.com/sdk/js?components=buttons¤cy=GBP&vault=false&disable-funding=card&intent=authorize&client-id=CLIENTID:3:95875
at sentryWrapped (http://localhost:8080/static/js/bundle.js:116681:17)
Ideally it would be handy to have a enum of all possible error types or specific callbacks for errors such as these, something akin to:
onError: (errorObject) => {
switch (errorObject) {
case errorTypes.detectedPopOutClose:
showInfoBanner('PayPal Payment cancelled');
break;
default:
showError('PayPal error');
}
},