braintree / braintree-web

A suite of tools for integrating Braintree in the browser
https://developer.paypal.com/braintree/docs/start/hello-client/javascript/v3
MIT License
444 stars 134 forks source link

Local Payment Method (iDeal) Popups are blocked by Safari #718

Closed mikkael131 closed 2 weeks ago

mikkael131 commented 4 months ago

General information

Issue description

We have recently implemented Braintree iDeal for our Dutch market. However during testing we have noticed, that the Braintree SDK fails to open the Localy Payment PopUp when using Safari with default settings. Everything works for Chrome/Edge/Firefox.

In our investigation we found out, that this is only an issue when the "BuyNow"-Button not only triggers the "StartPayment" but also does an asynchronous request to our backend to start the order process.

Here is a simple example which demonstartes the issue: https://codepen.io/mikkael131/pen/xxNvQPL (please provide the tokenization key as CLIENT_AUTHORIZATION and the merchantAccountId as MERCHANT_ACCOUNT_ID to test it)

The following error is being logged to the console: image

Our expectation is, that we do not have to worry about blocked popups or different browsers, as this should be abstracted by Braintree and the SDK. As a result, Braintree SDK should handle failed popup openings and should provide a way to redirect the user offsite with utilizing the provided fallbackUrl to return the customer back into the shop.

jplukarski commented 4 months ago

Hello @mikkael131 , thanks for writing in. We are aware of this issue. This is due to a recent change with Safari iOS now defaulting to block popups.

We are currently working on a full-page redirect solution for this issue as you describe above. We currently don't have a set timeline but hope to have that available by this fall.

In the meantime, the best workaround we can suggest is to have the buyer disable popups on iOS Safari or recommend using a different browser.

We'll keep this issue open until we are able to provide a full page redirect solution.

braintreeps commented 2 weeks ago

Hi @mikkael131! Thank you for reporting this issue. We've released a new Full Page Redirect feature for Local Payment Methods that should solve the issue you're seeing. You can read more about it on our official docs: https://developer.paypal.com/braintree/docs/guides/local-payment-methods/client-side-custom/javascript/v3/#redirect-flow