I've build a web page that let's you select a page name from a drop down list and then transfers the browser to that page. The code that does the transfer is

if (url){
    window.open(url, '_blank');
} 

where "url" is the page selected.

A console log just before the window.open line prints something like:

    executing: window.open('.html', '_blank')

and then the browsers opens the page in a new tab.

This works fine on Windows 7 for all the browsers, including Safari.

On an iMac it works for Firefox but not for Safari.

Does anyone know why iMac/Safari won't do this?

I've build a web page that let's you select a page name from a drop down list and then transfers the browser to that page. The code that does the transfer is

if (url){
    window.open(url, '_blank');
} 

where "url" is the page selected.

A console log just before the window.open line prints something like:

    executing: window.open('http://www.mywebsite.com/44/threats.html', '_blank')

and then the browsers opens the page in a new tab.

This works fine on Windows 7 for all the browsers, including Safari.

On an iMac it works for Firefox but not for Safari.

Does anyone know why iMac/Safari won't do this?

• javascript
• macos
• safari

12 Answers 12

Safari is blocking any call to window.open() which is made inside an async call.

The solution that I found to this problem is to call window.open before making an asnyc call and set the location when the promise resolves.

var windowReference = window.open();

myService.getUrl().then(function(url) {
     windowReference.location = url;
});

Using setTimeout

EDIT: A few people are reporting that this method doesn't work anymore on the latest Safari.

Wrapping your window.open(url, '_blank') line of code in the async function with a setTimeout works as well,

setTimeout(() => {
    window.open(url, '_blank');
})

setTimeout code runs on the main thread, instead of the asynchronous one. Tested in Chrome and Safari.

To use window.open() in safari you must put it in an element's onclick event attribute.

For example: <button class='btn' onclick='window.open("https://www.google.com", "_blank");'>Open Google search</button>

You can't rely on window.open because browsers may have different policies. I had the same issue and I used the code below instead.

let a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
a.href = <your_url>;
a.download = <your_fileName>;
a.click();
document.body.removeChild(a);

window.location.assign(url) this fixs the window.open(url) issue in ios devices

Taken from the accepted answers comment by Steve on Dec 20, 2013:

Actually, there's a very easy way to do it: just click off "Block popup windows" in the iMac/Safari browser and it does what I want.

To clarify, when running Safari on Mac OS X El Capitan:

1. Safari -> Preferences
2. Security -> Uncheck 'Block pop-up windows'

Open link in a new tab, programatically with JavaScript for: safari, mobile safari and other browsers:

const link = 'https://google.com';

const a = document.createElement("a");
a.setAttribute('href', link);
a.setAttribute('target', '_blank');
a.click();

There's a setting in Safari under "Tabs" that labeled Open pages in tabs instead of windows: with a drop down with a few options. I'm thinking yours may be set to Always. Bottom line is you can't rely on a browser opening a new window.

It will not work simply because safari has no support for that.

Check MDN Docs for compatibility - https://developer.mozilla.org/en-US/docs/Web/API/Window/open#browser_compatibility

This should work: window.location.assign(url); Usually it is important to save the state, before leaving the page, so have this in mind as well.

That works like a charm in angular project

in HTML

<button #payBtn style="display: none" (click)="navigateToPay()"></button>

and in ts

@ViewChild('payBtn', { static: false, read: ElementRef }) payBtn: ElementRef;
pay_url: string = '';

after getting URL will use

this.pay_url = "your url";
     setTimeout(() => {
              this.payBtn.nativeElement.click();
       })


navigateToPay() {
    window.open(this.pay_url, "_blank");
  }

The correct syntax is window.open(URL,WindowTitle,'_blank') All the arguments in the open must be strings. They are not mandatory, and window can be dropped. So just newWin=open() works as well, if you plan to populate newWin.document by yourself. BUT you MUST use all the three arguments, and the third one set to '_blank' for opening a new true window and not a tab.