Paypal Lightbox Won't Open In Iphone Safari/web App; 'win.location' Undefined

(works fine in Chrome on the iPhone) I get this error: TypeError: 'undefined' is not an object (evaluating 'win.location') in dg.js line 3 And the lightbox does not open. The co

Solution 1:

I can explain why you are seeing this error. Safari on iOS only allows a window to be opened as a result of a user click/touch event.

The DGFlow._render() function executes:

window.open('', "PPDG");

which returns null if triggered by anything other than a user click/touch event.

I am guessing you are issuing an XMLHttpRequest to generate a PayRequest/PayKey on the server and then in the onsuccess callback you are calling DGFlow.startFlow().

The solution is two split the process into two steps:

1. When the user is ready to checkout, issue the call to the server to generate the pay key.
2. Then, present the user with a button to Checkout with PayPal and when that is clicked, call DGFlow.startFlow()

Solution 2:

Found a couple of ways to get around this...location.replace with the PayPal URL or using your own lightbox. I used easybox.

// Replace
dg.startFlow('https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey);

// withvar RUNNING_AS_WEB_APP = (window.navigator.standalone == true ? true : false);
if (RUNNING_AS_WEB_APP === false) {
    dg.startFlow('https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey);
} else {
    location.replace('https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey);
    // Or, lightbox option: // $.easybox([{url: 'https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey, width: 320, height: 480}]);
} 

Solution 3:

Try using the mini browser experience where expType=mini. Seems to work better than the lightbox on mobile devices.

Adaptive Payments without modal box or popups?