Using rel="noopener" in window.open()

Question

So I know that I can apply rel="noopener in an a tag when using target="_blank". But I'm trying to pass it as an argument to window.open(), ie:

window.open('http://cats.com', '_blank', 'rel=noopener')

however it doesn't seem to be working the way that I expected, as the opener object still exists on the window after the user clicks on the link.

Is there something I'm missing? Or cannot it not be done the way that I'm intending?

I've found some great articles but they don't quite address my use case as far as I can tell.

https://developer.mozilla.org/en-US/docs/Web/API/Window/open https://mathiasbynens.github.io/rel-noopener/

Much appreciated.

Answer 1

There is no direct example in doc but it can be used like this and it worked for me.

window.open('http://cats.com', '_blank', 'noopener,resizable,scrollbars')

Answer 2

As far as I know, this cannot be achieved with window.open() arguments. There is, however, is a way to get the behavior:

var newWindow = window.open();
newWindow.opener = null;
newWindow.location = 'http://some.url';

Answer 3

This worked for me:

const a = document.createElement("a")
a.href = args.url
a.target = "_blank"
a.rel = "noopener"
a.click()

Answer 4

Cover all your bases

The safest way to redirect is by adding noopener, noreferrer, and window.opener = null.

const openInNewTab = (url) => {
    const newWindow = window.open(url, '_blank', 'noopener,noreferrer')
    if (newWindow) newWindow.opener = null
}

Then call your new funtion

openInNewTab('https://stackoverflow.com')

The third param can also take these optional values, based on your needs.