[SOLVED] Window.open() doesn't work in Safari in iPhone

[lenvanthis]

window.open() doesn’t work in safari in iPhone.
“Doesn’t work” means it does not open a window when it is called. Nothing happens.

It works in Safari in iPad.
It works in Safari in desktop.
It works in chrome in anywhere.

Has anybody addressed this problem yet?

[Leonidas]

Hi @lenvanthis,

Yes, that’s an issue with Safari on iPhone, not related with PlayCanvas.

I’m not sure if there is anything you can do with JavaScript to address that. The only way is to show some HTML elements that include a clickable a href link for the user to click.

[lenvanthis]

Thank you for the response. By any chance, do you know any example of clickable html element with a href link? All so too new to me. Thanks a lot.

[Leonidas]

So, go to this example and fork it:

https://developer.playcanvas.com/en/tutorials/htmlcss-ui/

And from there update the html asset with the following HTML:

<div class='button'>BUTTON</div>
<div class='counterBox'>
    times clicked <span class='counter'>0</span>
</div>
<div class='text'>
    Hit the button to <a href="https://playcanvas.com" target="_blank">increment</a> the counter<br />
</div>

That will make the increment word become a link that opens the playcanvas.com page on a new tab.

[yaustar]

Are you trying to do this on a PlayCanvas UI button? If so, you may want to do something similar to Capturing a screenshot | Learn PlayCanvas where we use a HTML element and call click on it.

[lenvanthis]

Yaustar,

That is a freaking helpful info. Amazing. Looking forward to testing out what I learned from your code.

Thanks, again.

[lenvanthis]

Thank you for the info again, Leonidas.

[lenvanthis]

OMG… Yaustar & Leonidas,

I am happy to inform you it perfectly worked. Let me show what I did.
Thank you for the help!!

ViewModeManager.prototype.initialize = function() {
    // Add a <a> to use to download an image file
    var linkElement = document.createElement('a');
    linkElement.id = 'link';
    window.document.body.appendChild(linkElement);
};

// When the button is clicked, I replaced window.open() with the following codes
        var menuAddress = "https://url.address/";
        //window.open(menuAddress);

        // Thanks https://stackoverflow.com/a/44487883
        var link = document.getElementById('link');
        link.setAttribute('href', menuAddress);
        link.click();

[yaustar]

Thanks for posting your solution

[SprayArks]

@lenvanthis

OMG… Yaustar & Leonidas,

I am happy to inform you it perfectly worked. Let me show what I did.
Thank you for the help!!

ViewModeManager.prototype.initialize = function() {
    // Add a <a> to use to download an image file
    var linkElement = document.createElement('a');
    linkElement.id = 'link';
    window.document.body.appendChild(linkElement);
};

// When the button is clicked, I replaced window.open() with the following codes
        var menuAddress = "https://url.address/";
        //window.open(menuAddress);

        // Thanks https://stackoverflow.com/a/44487883
        var link = document.getElementById('link');
        link.setAttribute('href', menuAddress);
        link.click();

does this still working I’ve been testing it with no sucsess ?

[naveen_lb]

Didn’t work for me

[lenvanthis]

@naveen_lb @SprayArks

I have just tested this on my iPhone X from playcanvas launch.

It worked there.

But I do have other errors from iPhone which is related to security issues from
playcanvas-stable.min.js.
I will create a thread on this if there is any already.