2016-05-17 16:02:54 -07:00
|
|
|
# `window.open` Function
|
2015-03-04 08:47:04 -08:00
|
|
|
|
2016-04-22 11:42:54 -07:00
|
|
|
> Open a new window and load a URL.
|
2016-04-21 15:35:29 -07:00
|
|
|
|
2015-08-28 23:21:09 -07:00
|
|
|
When `window.open` is called to create a new window in a web page, a new instance
|
|
|
|
of `BrowserWindow` will be created for the `url` and a proxy will be returned
|
2015-07-14 16:37:52 +01:00
|
|
|
to `window.open` to let the page have limited control over it.
|
2015-03-04 08:47:04 -08:00
|
|
|
|
2015-08-28 23:21:09 -07:00
|
|
|
The proxy has limited standard functionality implemented to be
|
|
|
|
compatible with traditional web pages. For full control of the new window
|
2015-03-04 08:47:04 -08:00
|
|
|
you should create a `BrowserWindow` directly.
|
|
|
|
|
2016-07-22 15:00:10 -07:00
|
|
|
The newly created `BrowserWindow` will inherit the parent window's options by
|
|
|
|
default. To override inherited options you can set them in the `features`
|
2015-09-22 22:46:44 +08:00
|
|
|
string.
|
|
|
|
|
2015-08-28 23:21:09 -07:00
|
|
|
### `window.open(url[, frameName][, features])`
|
2015-03-04 08:47:04 -08:00
|
|
|
|
|
|
|
* `url` String
|
2015-08-28 23:21:09 -07:00
|
|
|
* `frameName` String (optional)
|
|
|
|
* `features` String (optional)
|
2015-03-04 08:47:04 -08:00
|
|
|
|
2016-12-19 09:40:07 -08:00
|
|
|
Returns [`BrowserWindowProxy`](browser-window-proxy.md) - Creates a new window
|
|
|
|
and returns an instance of `BrowserWindowProxy` class.
|
2015-03-04 08:47:04 -08:00
|
|
|
|
2015-09-22 22:46:44 +08:00
|
|
|
The `features` string follows the format of standard browser, but each feature
|
|
|
|
has to be a field of `BrowserWindow`'s options.
|
|
|
|
|
2016-09-23 09:08:32 +02:00
|
|
|
**Notes:**
|
2016-10-25 12:35:18 +09:00
|
|
|
|
2016-10-04 14:41:37 +09:00
|
|
|
* Node integration will always be disabled in the opened `window` if it is
|
|
|
|
disabled on the parent window.
|
2017-04-21 11:00:31 -07:00
|
|
|
* Context isolation will always be enabled in the opened `window` if it is
|
|
|
|
enabled on the parent window.
|
|
|
|
* JavaScript will always be disabled in the opened `window` if it is disabled on
|
|
|
|
the parent window.
|
2016-10-04 14:41:37 +09:00
|
|
|
* Non-standard features (that are not handled by Chromium or Electron) given in
|
|
|
|
`features` will be passed to any registered `webContent`'s `new-window` event
|
|
|
|
handler in the `additionalFeatures` argument.
|
2016-03-30 10:55:16 -07:00
|
|
|
|
2015-08-28 23:21:09 -07:00
|
|
|
### `window.opener.postMessage(message, targetOrigin)`
|
2015-03-04 08:47:04 -08:00
|
|
|
|
|
|
|
* `message` String
|
|
|
|
* `targetOrigin` String
|
|
|
|
|
|
|
|
Sends a message to the parent window with the specified origin or `*` for no
|
|
|
|
origin preference.
|
2017-03-19 18:35:12 +09:00
|
|
|
|
2017-05-24 11:12:57 -07:00
|
|
|
### Using Chrome's `window.open()` implementation
|
2017-03-19 18:35:12 +09:00
|
|
|
|
2017-05-24 11:12:57 -07:00
|
|
|
If you want to use Chrome's built-in `window.open()` implementation, set
|
|
|
|
`nativeWindowOpen` to `true` in the `webPreferences` options object.
|
2017-03-19 18:35:12 +09:00
|
|
|
|
2017-05-24 11:12:57 -07:00
|
|
|
Native `window.open()` allows synchronous access to opened windows so it is
|
|
|
|
convenient choice if you need to open a dialog or a preferences window.
|
|
|
|
|
|
|
|
This option can also be set on `<webview>` tags as well:
|
|
|
|
|
|
|
|
```html
|
|
|
|
<webview webpreferences="nativeWindowOpen=yes"></webview>
|
|
|
|
```
|
|
|
|
|
|
|
|
The creation of the `BrowserWindow` is customizable via `WebContents`'s
|
|
|
|
`new-window` event.
|
2017-03-19 18:35:12 +09:00
|
|
|
|
|
|
|
```javascript
|
2017-03-19 20:30:07 +09:00
|
|
|
// main process
|
|
|
|
const mainWindow = new BrowserWindow({
|
|
|
|
width: 800,
|
|
|
|
height: 600,
|
|
|
|
webPreferences: {
|
|
|
|
nativeWindowOpen: true
|
|
|
|
}
|
|
|
|
})
|
2017-03-19 18:35:12 +09:00
|
|
|
mainWindow.webContents.on('new-window', (event, url, frameName, disposition, options, additionalFeatures) => {
|
2017-03-19 20:30:07 +09:00
|
|
|
if (frameName === 'modal') {
|
2017-03-19 18:35:12 +09:00
|
|
|
// open window as modal
|
|
|
|
event.preventDefault()
|
|
|
|
Object.assign(options, {
|
|
|
|
modal: true,
|
|
|
|
parent: mainWindow,
|
|
|
|
width: 100,
|
|
|
|
height: 100
|
|
|
|
})
|
2017-03-28 19:50:45 +09:00
|
|
|
event.newGuest = new BrowserWindow(options)
|
2017-03-19 18:35:12 +09:00
|
|
|
}
|
2017-03-19 20:09:52 +09:00
|
|
|
})
|
2017-03-19 18:35:12 +09:00
|
|
|
```
|
2017-03-19 20:30:07 +09:00
|
|
|
|
|
|
|
```javascript
|
|
|
|
// renderer process (mainWindow)
|
|
|
|
let modal = window.open('', 'modal')
|
|
|
|
modal.document.write('<h1>Hello</h1>')
|
|
|
|
```
|