Open a new window and load a URL.
- When
window.open
is called to create a new window on a web page, a new Browser Window instance will be made for theurl
.- A Proxy will be returned to
window.open
to let the page have limited control over it.
- The proxy has limited standard functionality implemented to be compatible with traditional web pages.
-
For complete control of the new window, you should create a
BrowserWindow
directly. -
The newly created
BrowserWindow
will inherit the parent window’s options by default. -
To override inherited options, you can set them in the
features
string.
window.open(url[, frameName][, features])
url
StringframeName
String (optional)features
String (optional)
Returns
BrowserWindowProxy
– Creates a new window and returns an instance of BrowserWindowProxy` class.
The features
string follows the standard browser format, but each feature has to be a field of BrowserWindow
‘s options. These are the features you can set via the features
string.
zoomFactor
nodeIntegration
preload
javascript
contextIsolation
webviewTag
.
js window open
For example:
window.open('https://github.com', '_blank', 'nodeIntegration=no')
Notes:
- Node integration will always be disabled in the opened
window
if disabled on the parent window. - Context isolation will always be enabled in the opened
window
if enabled on the parent window. - JavaScript will always be disabled in the opened
window
if disabled on the parent window. - Non-standard features (that are not handled by Chromium or Electron) given in
features
will be passed to any registeredwebContent
‘snew-window
event handler in theadditionalFeatures
argument.
window.opener.postMessage(message, targetOrigin)
message
StringtargetOrigin
String
It Sends a message to the parent window with the specified origin or *
for no origin preference.
Using Chrome’s window.open() implementation
-
If you want to use Chrome’s built-in
window.open()
implementation, set
nativeWindowOpen
totrue
in thewebPreferences
options object. -
Native
window.open()
allows synchronous access to opened windows, so it is a convenient choice if you need to open a dialogue or a preferences window. -
It can set this option on
<webview>
tags as well:
<webview webpreferences="nativeWindowOpen=yes"></webview>
The creation of the BrowserWindow
is customizable via WebContents
‘s new-window
event.
// main process const mainWindow = new BrowserWindow({ width: 800, height: 600, webPreferences: { nativeWindowOpen: true } }) mainWindow.webContents.on('new-window', (event, url, frameName, disposition, options, additionalFeatures) => { if (frameName === 'modal') { // open window as modal event.preventDefault() Object.assign(options, { modal: true, parent: mainWindow, width: 100, height: 100 }) event.newGuest = new BrowserWindow(options) } })
// renderer process (mainWindow) let modal = window.open('', 'modal') modal.document.write('<h1>Hello</h1>')