Remove untranslated files

This commit is contained in:
Kevin Sawicki 2017-02-10 12:06:06 -08:00
parent c49363f521
commit 9dd960fc97
99 changed files with 0 additions and 13740 deletions

View file

@ -1,71 +0,0 @@
# Accelerator
> Define keyboard shortcuts.
Accelerators are Strings that can contain multiple modifiers and key codes,
combined by the `+` character, and are used to define keyboard shortcuts
throughout your application.
Examples:
* `CommandOrControl+A`
* `CommandOrControl+Shift+Z`
Shortcuts are registered with the [`globalShortcut`](global-shortcut.md) module
using the [`register`](global-shortcut.md#globalshortcutregisteraccelerator-callback)
method, i.e.
```javascript
const {app, globalShortcut} = require('electron')
app.on('ready', () => {
// Register a 'CommandOrControl+Y' shortcut listener.
globalShortcut.register('CommandOrControl+Y', () => {
// Do stuff when Y and either Command/Control is pressed.
})
})
```
## Platform notice
On Linux and Windows, the `Command` key does not have any effect so
use `CommandOrControl` which represents `Command` on macOS and `Control` on
Linux and Windows to define some accelerators.
Use `Alt` instead of `Option`. The `Option` key only exists on macOS, whereas
the `Alt` key is available on all platforms.
The `Super` key is mapped to the `Windows` key on Windows and Linux and
`Cmd` on macOS.
## Available modifiers
* `Command` (or `Cmd` for short)
* `Control` (or `Ctrl` for short)
* `CommandOrControl` (or `CmdOrCtrl` for short)
* `Alt`
* `Option`
* `AltGr`
* `Shift`
* `Super`
## Available key codes
* `0` to `9`
* `A` to `Z`
* `F1` to `F24`
* Punctuations like `~`, `!`, `@`, `#`, `$`, etc.
* `Plus`
* `Space`
* `Tab`
* `Backspace`
* `Delete`
* `Insert`
* `Return` (or `Enter` as alias)
* `Up`, `Down`, `Left` and `Right`
* `Home` and `End`
* `PageUp` and `PageDown`
* `Escape` (or `Esc` for short)
* `VolumeUp`, `VolumeDown` and `VolumeMute`
* `MediaNextTrack`, `MediaPreviousTrack`, `MediaStop` and `MediaPlayPause`
* `PrintScreen`

View file

@ -1,908 +0,0 @@
# app
> Control your application's event lifecycle.
Process: [Main](../glossary.md#main-process)
The following example shows how to quit the application when the last window is
closed:
```javascript
const {app} = require('electron')
app.on('window-all-closed', () => {
app.quit()
})
```
## Events
The `app` object emits the following events:
### Event: 'will-finish-launching'
Emitted when the application has finished basic startup. On Windows and Linux,
the `will-finish-launching` event is the same as the `ready` event; on macOS,
this event represents the `applicationWillFinishLaunching` notification of
`NSApplication`. You would usually set up listeners for the `open-file` and
`open-url` events here, and start the crash reporter and auto updater.
In most cases, you should just do everything in the `ready` event handler.
### Event: 'ready'
Returns:
* `launchInfo` Object _macOS_
Emitted when Electron has finished initializing. On macOS, `launchInfo` holds
the `userInfo` of the `NSUserNotification` that was used to open the application,
if it was launched from Notification Center. You can call `app.isReady()` to
check if this event has already fired.
### Event: 'window-all-closed'
Emitted when all windows have been closed.
If you do not subscribe to this event and all windows are closed, the default
behavior is to quit the app; however, if you subscribe, you control whether the
app quits or not. If the user pressed `Cmd + Q`, or the developer called
`app.quit()`, Electron will first try to close all the windows and then emit the
`will-quit` event, and in this case the `window-all-closed` event would not be
emitted.
### Event: 'before-quit'
Returns:
* `event` Event
Emitted before the application starts closing its windows.
Calling `event.preventDefault()` will prevent the default behaviour, which is
terminating the application.
**Note:** If application quit was initiated by `autoUpdater.quitAndInstall()`
then `before-quit` is emitted *after* emitting `close` event on all windows and
closing them.
### Event: 'will-quit'
Returns:
* `event` Event
Emitted when all windows have been closed and the application will quit.
Calling `event.preventDefault()` will prevent the default behaviour, which is
terminating the application.
See the description of the `window-all-closed` event for the differences between
the `will-quit` and `window-all-closed` events.
### Event: 'quit'
Returns:
* `event` Event
* `exitCode` Integer
Emitted when the application is quitting.
### Event: 'open-file' _macOS_
Returns:
* `event` Event
* `path` String
Emitted when the user wants to open a file with the application. The `open-file`
event is usually emitted when the application is already open and the OS wants
to reuse the application to open the file. `open-file` is also emitted when a
file is dropped onto the dock and the application is not yet running. Make sure
to listen for the `open-file` event very early in your application startup to
handle this case (even before the `ready` event is emitted).
You should call `event.preventDefault()` if you want to handle this event.
On Windows, you have to parse `process.argv` (in the main process) to get the
filepath.
### Event: 'open-url' _macOS_
Returns:
* `event` Event
* `url` String
Emitted when the user wants to open a URL with the application. Your application's
`Info.plist` file must define the url scheme within the `CFBundleURLTypes` key, and
set `NSPrincipalClass` to `AtomApplication`.
You should call `event.preventDefault()` if you want to handle this event.
### Event: 'activate' _macOS_
Returns:
* `event` Event
* `hasVisibleWindows` Boolean
Emitted when the application is activated, which usually happens when the user
clicks on the application's dock icon.
### Event: 'continue-activity' _macOS_
Returns:
* `event` Event
* `type` String - A string identifying the activity. Maps to
[`NSUserActivity.activityType`][activity-type].
* `userInfo` Object - Contains app-specific state stored by the activity on
another device.
Emitted during [Handoff][handoff] when an activity from a different device wants
to be resumed. You should call `event.preventDefault()` if you want to handle
this event.
A user activity can be continued only in an app that has the same developer Team
ID as the activity's source app and that supports the activity's type.
Supported activity types are specified in the app's `Info.plist` under the
`NSUserActivityTypes` key.
### Event: 'browser-window-blur'
Returns:
* `event` Event
* `window` BrowserWindow
Emitted when a [browserWindow](browser-window.md) gets blurred.
### Event: 'browser-window-focus'
Returns:
* `event` Event
* `window` BrowserWindow
Emitted when a [browserWindow](browser-window.md) gets focused.
### Event: 'browser-window-created'
Returns:
* `event` Event
* `window` BrowserWindow
Emitted when a new [browserWindow](browser-window.md) is created.
### Event: 'web-contents-created'
Returns:
* `event` Event
* `webContents` WebContents
Emitted when a new [webContents](web-contents.md) is created.
### Event: 'certificate-error'
Returns:
* `event` Event
* `webContents` [WebContents](web-contents.md)
* `url` String
* `error` String - The error code
* `certificate` [Certificate](structures/certificate.md)
* `callback` Function
* `isTrusted` Boolean - Whether to consider the certificate as trusted
Emitted when failed to verify the `certificate` for `url`, to trust the
certificate you should prevent the default behavior with
`event.preventDefault()` and call `callback(true)`.
```javascript
const {app} = require('electron')
app.on('certificate-error', (event, webContents, url, error, certificate, callback) => {
if (url === 'https://github.com') {
// Verification logic.
event.preventDefault()
callback(true)
} else {
callback(false)
}
})
```
### Event: 'select-client-certificate'
Returns:
* `event` Event
* `webContents` [WebContents](web-contents.md)
* `url` URL
* `certificateList` [Certificate[]](structures/certificate.md)
* `callback` Function
* `certificate` [Certificate](structures/certificate.md) (optional)
Emitted when a client certificate is requested.
The `url` corresponds to the navigation entry requesting the client certificate
and `callback` can be called with an entry filtered from the list. Using
`event.preventDefault()` prevents the application from using the first
certificate from the store.
```javascript
const {app} = require('electron')
app.on('select-client-certificate', (event, webContents, url, list, callback) => {
event.preventDefault()
callback(list[0])
})
```
### Event: 'login'
Returns:
* `event` Event
* `webContents` [WebContents](web-contents.md)
* `request` Object
* `method` String
* `url` URL
* `referrer` URL
* `authInfo` Object
* `isProxy` Boolean
* `scheme` String
* `host` String
* `port` Integer
* `realm` String
* `callback` Function
* `username` String
* `password` String
Emitted when `webContents` wants to do basic auth.
The default behavior is to cancel all authentications, to override this you
should prevent the default behavior with `event.preventDefault()` and call
`callback(username, password)` with the credentials.
```javascript
const {app} = require('electron')
app.on('login', (event, webContents, request, authInfo, callback) => {
event.preventDefault()
callback('username', 'secret')
})
```
### Event: 'gpu-process-crashed'
Returns:
* `event` Event
* `killed` Boolean
Emitted when the gpu process crashes or is killed.
### Event: 'accessibility-support-changed' _macOS_ _Windows_
Returns:
* `event` Event
* `accessibilitySupportEnabled` Boolean - `true` when Chrome's accessibility
support is enabled, `false` otherwise.
Emitted when Chrome's accessibility support changes. This event fires when
assistive technologies, such as screen readers, are enabled or disabled.
See https://www.chromium.org/developers/design-documents/accessibility for more
details.
## Methods
The `app` object has the following methods:
**Note:** Some methods are only available on specific operating systems and are
labeled as such.
### `app.quit()`
Try to close all windows. The `before-quit` event will be emitted first. If all
windows are successfully closed, the `will-quit` event will be emitted and by
default the application will terminate.
This method guarantees that all `beforeunload` and `unload` event handlers are
correctly executed. It is possible that a window cancels the quitting by
returning `false` in the `beforeunload` event handler.
### `app.exit([exitCode])`
* `exitCode` Integer (optional)
Exits immediately with `exitCode`. `exitCode` defaults to 0.
All windows will be closed immediately without asking user and the `before-quit`
and `will-quit` events will not be emitted.
### `app.relaunch([options])`
* `options` Object (optional)
* `args` String[] - (optional)
* `execPath` String (optional)
Relaunches the app when current instance exits.
By default the new instance will use the same working directory and command line
arguments with current instance. When `args` is specified, the `args` will be
passed as command line arguments instead. When `execPath` is specified, the
`execPath` will be executed for relaunch instead of current app.
Note that this method does not quit the app when executed, you have to call
`app.quit` or `app.exit` after calling `app.relaunch` to make the app restart.
When `app.relaunch` is called for multiple times, multiple instances will be
started after current instance exited.
An example of restarting current instance immediately and adding a new command
line argument to the new instance:
```javascript
const {app} = require('electron')
app.relaunch({args: process.argv.slice(1).concat(['--relaunch'])})
app.exit(0)
```
### `app.isReady()`
Returns `Boolean` - `true` if Electron has finished initializing, `false` otherwise.
### `app.focus()`
On Linux, focuses on the first visible window. On macOS, makes the application
the active app. On Windows, focuses on the application's first window.
### `app.hide()` _macOS_
Hides all application windows without minimizing them.
### `app.show()` _macOS_
Shows application windows after they were hidden. Does not automatically focus
them.
### `app.getAppPath()`
Returns `String` - The current application directory.
### `app.getPath(name)`
* `name` String
Returns `String` - A path to a special directory or file associated with `name`. On
failure an `Error` is thrown.
You can request the following paths by the name:
* `home` User's home directory.
* `appData` Per-user application data directory, which by default points to:
* `%APPDATA%` on Windows
* `$XDG_CONFIG_HOME` or `~/.config` on Linux
* `~/Library/Application Support` on macOS
* `userData` The directory for storing your app's configuration files, which by
default it is the `appData` directory appended with your app's name.
* `temp` Temporary directory.
* `exe` The current executable file.
* `module` The `libchromiumcontent` library.
* `desktop` The current user's Desktop directory.
* `documents` Directory for a user's "My Documents".
* `downloads` Directory for a user's downloads.
* `music` Directory for a user's music.
* `pictures` Directory for a user's pictures.
* `videos` Directory for a user's videos.
* `pepperFlashSystemPlugin` Full path to the system version of the Pepper Flash plugin.
### `app.setPath(name, path)`
* `name` String
* `path` String
Overrides the `path` to a special directory or file associated with `name`. If
the path specifies a directory that does not exist, the directory will be
created by this method. On failure an `Error` is thrown.
You can only override paths of a `name` defined in `app.getPath`.
By default, web pages' cookies and caches will be stored under the `userData`
directory. If you want to change this location, you have to override the
`userData` path before the `ready` event of the `app` module is emitted.
### `app.getVersion()`
Returns `String` - The version of the loaded application. If no version is found in the
application's `package.json` file, the version of the current bundle or
executable is returned.
### `app.getName()`
Returns `String` - The current application's name, which is the name in the application's
`package.json` file.
Usually the `name` field of `package.json` is a short lowercased name, according
to the npm modules spec. You should usually also specify a `productName`
field, which is your application's full capitalized name, and which will be
preferred over `name` by Electron.
### `app.setName(name)`
* `name` String
Overrides the current application's name.
### `app.getLocale()`
Returns `String` - The current application locale. Possible return values are documented
[here](locales.md).
**Note:** When distributing your packaged app, you have to also ship the
`locales` folder.
**Note:** On Windows you have to call it after the `ready` events gets emitted.
### `app.addRecentDocument(path)` _macOS_ _Windows_
* `path` String
Adds `path` to the recent documents list.
This list is managed by the OS. On Windows you can visit the list from the task
bar, and on macOS you can visit it from dock menu.
### `app.clearRecentDocuments()` _macOS_ _Windows_
Clears the recent documents list.
### `app.setAsDefaultProtocolClient(protocol[, path, args])` _macOS_ _Windows_
* `protocol` String - The name of your protocol, without `://`. If you want your
app to handle `electron://` links, call this method with `electron` as the
parameter.
* `path` String (optional) _Windows_ - Defaults to `process.execPath`
* `args` String[] (optional) _Windows_ - Defaults to an empty array
Returns `Boolean` - Whether the call succeeded.
This method sets the current executable as the default handler for a protocol
(aka URI scheme). It allows you to integrate your app deeper into the operating
system. Once registered, all links with `your-protocol://` will be opened with
the current executable. The whole link, including protocol, will be passed to
your application as a parameter.
On Windows you can provide optional parameters path, the path to your executable,
and args, an array of arguments to be passed to your executable when it launches.
**Note:** On macOS, you can only register protocols that have been added to
your app's `info.plist`, which can not be modified at runtime. You can however
change the file with a simple text editor or script during build time.
Please refer to [Apple's documentation][CFBundleURLTypes] for details.
The API uses the Windows Registry and LSSetDefaultHandlerForURLScheme internally.
### `app.removeAsDefaultProtocolClient(protocol[, path, args])` _macOS_ _Windows_
* `protocol` String - The name of your protocol, without `://`.
* `path` String (optional) _Windows_ - Defaults to `process.execPath`
* `args` String[] (optional) _Windows_ - Defaults to an empty array
Returns `Boolean` - Whether the call succeeded.
This method checks if the current executable as the default handler for a
protocol (aka URI scheme). If so, it will remove the app as the default handler.
### `app.isDefaultProtocolClient(protocol[, path, args])` _macOS_ _Windows_
* `protocol` String - The name of your protocol, without `://`.
* `path` String (optional) _Windows_ - Defaults to `process.execPath`
* `args` String[] (optional) _Windows_ - Defaults to an empty array
Returns `Boolean`
This method checks if the current executable is the default handler for a protocol
(aka URI scheme). If so, it will return true. Otherwise, it will return false.
**Note:** On macOS, you can use this method to check if the app has been
registered as the default protocol handler for a protocol. You can also verify
this by checking `~/Library/Preferences/com.apple.LaunchServices.plist` on the
macOS machine. Please refer to
[Apple's documentation][LSCopyDefaultHandlerForURLScheme] for details.
The API uses the Windows Registry and LSCopyDefaultHandlerForURLScheme internally.
### `app.setUserTasks(tasks)` _Windows_
* `tasks` [Task[]](structures/task.md) - Array of `Task` objects
Adds `tasks` to the [Tasks][tasks] category of the JumpList on Windows.
`tasks` is an array of [`Task`](structures/task.md) objects.
Returns `Boolean` - Whether the call succeeded.
**Note:** If you'd like to customize the Jump List even more use
`app.setJumpList(categories)` instead.
### `app.getJumpListSettings()` _Windows_
Returns `Object`:
* `minItems` Integer - The minimum number of items that will be shown in the
Jump List (for a more detailed description of this value see the
[MSDN docs][JumpListBeginListMSDN]).
* `removedItems` [JumpListItem[]](structures/jump-list-item.md) - Array of `JumpListItem` objects that correspond to
items that the user has explicitly removed from custom categories in the
Jump List. These items must not be re-added to the Jump List in the **next**
call to `app.setJumpList()`, Windows will not display any custom category
that contains any of the removed items.
### `app.setJumpList(categories)` _Windows_
* `categories` [JumpListCategory[]](structures/jump-list-category.md) or `null` - Array of `JumpListCategory` objects.
Sets or removes a custom Jump List for the application, and returns one of the
following strings:
* `ok` - Nothing went wrong.
* `error` - One or more errors occurred, enable runtime logging to figure out
the likely cause.
* `invalidSeparatorError` - An attempt was made to add a separator to a
custom category in the Jump List. Separators are only allowed in the
standard `Tasks` category.
* `fileTypeRegistrationError` - An attempt was made to add a file link to
the Jump List for a file type the app isn't registered to handle.
* `customCategoryAccessDeniedError` - Custom categories can't be added to the
Jump List due to user privacy or group policy settings.
If `categories` is `null` the previously set custom Jump List (if any) will be
replaced by the standard Jump List for the app (managed by Windows).
**Note:** If a `JumpListCategory` object has neither the `type` nor the `name`
property set then its `type` is assumed to be `tasks`. If the `name` property
is set but the `type` property is omitted then the `type` is assumed to be
`custom`.
**Note:** Users can remove items from custom categories, and Windows will not
allow a removed item to be added back into a custom category until **after**
the next successful call to `app.setJumpList(categories)`. Any attempt to
re-add a removed item to a custom category earlier than that will result in the
entire custom category being omitted from the Jump List. The list of removed
items can be obtained using `app.getJumpListSettings()`.
Here's a very simple example of creating a custom Jump List:
```javascript
const {app} = require('electron')
app.setJumpList([
{
type: 'custom',
name: 'Recent Projects',
items: [
{ type: 'file', path: 'C:\\Projects\\project1.proj' },
{ type: 'file', path: 'C:\\Projects\\project2.proj' }
]
},
{ // has a name so `type` is assumed to be "custom"
name: 'Tools',
items: [
{
type: 'task',
title: 'Tool A',
program: process.execPath,
args: '--run-tool-a',
icon: process.execPath,
iconIndex: 0,
description: 'Runs Tool A'
},
{
type: 'task',
title: 'Tool B',
program: process.execPath,
args: '--run-tool-b',
icon: process.execPath,
iconIndex: 0,
description: 'Runs Tool B'
}
]
},
{ type: 'frequent' },
{ // has no name and no type so `type` is assumed to be "tasks"
items: [
{
type: 'task',
title: 'New Project',
program: process.execPath,
args: '--new-project',
description: 'Create a new project.'
},
{ type: 'separator' },
{
type: 'task',
title: 'Recover Project',
program: process.execPath,
args: '--recover-project',
description: 'Recover Project'
}
]
}
])
```
### `app.makeSingleInstance(callback)`
* `callback` Function
* `argv` String[] - An array of the second instance's command line arguments
* `workingDirectory` String - The second instance's working directory
This method makes your application a Single Instance Application - instead of
allowing multiple instances of your app to run, this will ensure that only a
single instance of your app is running, and other instances signal this
instance and exit.
`callback` will be called with `callback(argv, workingDirectory)` when a second
instance has been executed. `argv` is an Array of the second instance's command
line arguments, and `workingDirectory` is its current working directory. Usually
applications respond to this by making their primary window focused and
non-minimized.
The `callback` is guaranteed to be executed after the `ready` event of `app`
gets emitted.
This method returns `false` if your process is the primary instance of the
application and your app should continue loading. And returns `true` if your
process has sent its parameters to another instance, and you should immediately
quit.
On macOS the system enforces single instance automatically when users try to open
a second instance of your app in Finder, and the `open-file` and `open-url`
events will be emitted for that. However when users start your app in command
line the system's single instance mechanism will be bypassed and you have to
use this method to ensure single instance.
An example of activating the window of primary instance when a second instance
starts:
```javascript
const {app} = require('electron')
let myWindow = null
const shouldQuit = app.makeSingleInstance((commandLine, workingDirectory) => {
// Someone tried to run a second instance, we should focus our window.
if (myWindow) {
if (myWindow.isMinimized()) myWindow.restore()
myWindow.focus()
}
})
if (shouldQuit) {
app.quit()
}
// Create myWindow, load the rest of the app, etc...
app.on('ready', () => {
})
```
### `app.releaseSingleInstance()`
Releases all locks that were created by `makeSingleInstance`. This will allow
multiple instances of the application to once again run side by side.
### `app.setUserActivity(type, userInfo[, webpageURL])` _macOS_
* `type` String - Uniquely identifies the activity. Maps to
[`NSUserActivity.activityType`][activity-type].
* `userInfo` Object - App-specific state to store for use by another device.
* `webpageURL` String (optional) - The webpage to load in a browser if no suitable app is
installed on the resuming device. The scheme must be `http` or `https`.
Creates an `NSUserActivity` and sets it as the current activity. The activity
is eligible for [Handoff][handoff] to another device afterward.
### `app.getCurrentActivityType()` _macOS_
Returns `String` - The type of the currently running activity.
### `app.setAppUserModelId(id)` _Windows_
* `id` String
Changes the [Application User Model ID][app-user-model-id] to `id`.
### `app.importCertificate(options, callback)` _LINUX_
* `options` Object
* `certificate` String - Path for the pkcs12 file.
* `password` String - Passphrase for the certificate.
* `callback` Function
* `result` Integer - Result of import.
Imports the certificate in pkcs12 format into the platform certificate store.
`callback` is called with the `result` of import operation, a value of `0`
indicates success while any other value indicates failure according to chromium [net_error_list](https://code.google.com/p/chromium/codesearch#chromium/src/net/base/net_error_list.h).
### `app.disableHardwareAcceleration()`
Disables hardware acceleration for current app.
This method can only be called before app is ready.
### `app.setBadgeCount(count)` _Linux_ _macOS_
* `count` Integer
Returns `Boolean` - Whether the call succeeded.
Sets the counter badge for current app. Setting the count to `0` will hide the
badge.
On macOS it shows on the dock icon. On Linux it only works for Unity launcher,
**Note:** Unity launcher requires the exsistence of a `.desktop` file to work,
for more information please read [Desktop Environment Integration][unity-requiremnt].
### `app.getBadgeCount()` _Linux_ _macOS_
Returns `Integer` - The current value displayed in the counter badge.
### `app.isUnityRunning()` _Linux_
Returns `Boolean` - Whether the current desktop environment is Unity launcher.
### `app.getLoginItemSettings()` _macOS_ _Windows_
Returns `Object`:
* `openAtLogin` Boolean - `true` if the app is set to open at login.
* `openAsHidden` Boolean - `true` if the app is set to open as hidden at login.
This setting is only supported on macOS.
* `wasOpenedAtLogin` Boolean - `true` if the app was opened at login
automatically. This setting is only supported on macOS.
* `wasOpenedAsHidden` Boolean - `true` if the app was opened as a hidden login
item. This indicates that the app should not open any windows at startup.
This setting is only supported on macOS.
* `restoreState` Boolean - `true` if the app was opened as a login item that
should restore the state from the previous session. This indicates that the
app should restore the windows that were open the last time the app was
closed. This setting is only supported on macOS.
**Note:** This API has no effect on
[MAS builds][mas-builds].
### `app.setLoginItemSettings(settings)` _macOS_ _Windows_
* `settings` Object
* `openAtLogin` Boolean (optional) - `true` to open the app at login, `false` to remove
the app as a login item. Defaults to `false`.
* `openAsHidden` Boolean (optional) - `true` to open the app as hidden. Defaults to
`false`. The user can edit this setting from the System Preferences so
`app.getLoginItemStatus().wasOpenedAsHidden` should be checked when the app
is opened to know the current value. This setting is only supported on
macOS.
Set the app's login item settings.
**Note:** This API has no effect on
[MAS builds][mas-builds].
### `app.isAccessibilitySupportEnabled()` _macOS_ _Windows_
Returns `Boolean` - `true` if Chrome's accessibility support is enabled,
`false` otherwise. This API will return `true` if the use of assistive
technologies, such as screen readers, has been detected. See
https://www.chromium.org/developers/design-documents/accessibility for more
details.
### `app.setAboutPanelOptions(options)` _macOS_
* `options` Object
* `applicationName` String (optional) - The app's name.
* `applicationVersion` String (optional) - The app's version.
* `copyright` String (optional) - Copyright information.
* `credits` String (optional) - Credit information.
* `version` String (optional) - The app's build version number.
Set the about panel options. This will override the values defined in the app's
`.plist` file. See the [Apple docs][about-panel-options] for more details.
### `app.commandLine.appendSwitch(switch[, value])`
* `switch` String - A command-line switch
* `value` String (optional) - A value for the given switch
Append a switch (with optional `value`) to Chromium's command line.
**Note:** This will not affect `process.argv`, and is mainly used by developers
to control some low-level Chromium behaviors.
### `app.commandLine.appendArgument(value)`
* `value` String - The argument to append to the command line
Append an argument to Chromium's command line. The argument will be quoted
correctly.
**Note:** This will not affect `process.argv`.
### `app.dock.bounce([type])` _macOS_
* `type` String (optional) - Can be `critical` or `informational`. The default is
`informational`
When `critical` is passed, the dock icon will bounce until either the
application becomes active or the request is canceled.
When `informational` is passed, the dock icon will bounce for one second.
However, the request remains active until either the application becomes active
or the request is canceled.
Returns `Integer` an ID representing the request.
### `app.dock.cancelBounce(id)` _macOS_
* `id` Integer
Cancel the bounce of `id`.
### `app.dock.downloadFinished(filePath)` _macOS_
* `filePath` String
Bounces the Downloads stack if the filePath is inside the Downloads folder.
### `app.dock.setBadge(text)` _macOS_
* `text` String
Sets the string to be displayed in the docks badging area.
### `app.dock.getBadge()` _macOS_
Returns `String` - The badge string of the dock.
### `app.dock.hide()` _macOS_
Hides the dock icon.
### `app.dock.show()` _macOS_
Shows the dock icon.
### `app.dock.isVisible()` _macOS_
Returns `Boolean` - Whether the dock icon is visible.
The `app.dock.show()` call is asynchronous so this method might not
return true immediately after that call.
### `app.dock.setMenu(menu)` _macOS_
* `menu` [Menu](menu.md)
Sets the application's [dock menu][dock-menu].
### `app.dock.setIcon(image)` _macOS_
* `image` ([NativeImage](native-image.md) | String)
Sets the `image` associated with this dock icon.
[dock-menu]:https://developer.apple.com/library/mac/documentation/Carbon/Conceptual/customizing_docktile/concepts/dockconcepts.html#//apple_ref/doc/uid/TP30000986-CH2-TPXREF103
[tasks]:http://msdn.microsoft.com/en-us/library/windows/desktop/dd378460(v=vs.85).aspx#tasks
[app-user-model-id]: https://msdn.microsoft.com/en-us/library/windows/desktop/dd378459(v=vs.85).aspx
[CFBundleURLTypes]: https://developer.apple.com/library/ios/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html#//apple_ref/doc/uid/TP40009249-102207-TPXREF115
[LSCopyDefaultHandlerForURLScheme]: https://developer.apple.com/library/mac/documentation/Carbon/Reference/LaunchServicesReference/#//apple_ref/c/func/LSCopyDefaultHandlerForURLScheme
[handoff]: https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/Handoff/HandoffFundamentals/HandoffFundamentals.html
[activity-type]: https://developer.apple.com/library/ios/documentation/Foundation/Reference/NSUserActivity_Class/index.html#//apple_ref/occ/instp/NSUserActivity/activityType
[unity-requiremnt]: ../tutorial/desktop-environment-integration.md#unity-launcher-shortcuts-linux
[mas-builds]: ../tutorial/mac-app-store-submission-guide.md
[JumpListBeginListMSDN]: https://msdn.microsoft.com/en-us/library/windows/desktop/dd378398(v=vs.85).aspx
[about-panel-options]: https://developer.apple.com/reference/appkit/nsapplication/1428479-orderfrontstandardaboutpanelwith?language=objc

View file

@ -1,139 +0,0 @@
# autoUpdater
> Enable apps to automatically update themselves.
Process: [Main](../glossary.md#main-process)
The `autoUpdater` module provides an interface for the
[Squirrel](https://github.com/Squirrel) framework.
You can quickly launch a multi-platform release server for distributing your
application by using one of these projects:
- [nuts][nuts]: *A smart release server for your applications, using GitHub as a backend. Auto-updates with Squirrel (Mac & Windows)*
- [electron-release-server][electron-release-server]: *A fully featured,
self-hosted release server for electron applications, compatible with
auto-updater*
- [squirrel-updates-server][squirrel-updates-server]: *A simple node.js server
for Squirrel.Mac and Squirrel.Windows which uses GitHub releases*
- [squirrel-release-server][squirrel-release-server]: *A simple PHP application for Squirrel.Windows which reads updates from a folder. Supports delta updates.*
## Platform notices
Though `autoUpdater` provides a uniform API for different platforms, there are
still some subtle differences on each platform.
### macOS
On macOS, the `autoUpdater` module is built upon [Squirrel.Mac][squirrel-mac],
meaning you don't need any special setup to make it work. For server-side
requirements, you can read [Server Support][server-support]. Note that [App
Transport Security](https://developer.apple.com/library/content/documentation/General/Reference/InfoPlistKeyReference/Articles/CocoaKeys.html#//apple_ref/doc/uid/TP40009251-SW35) (ATS) applies to all requests made as part of the
update process. Apps that need to disable ATS can add the
`NSAllowsArbitraryLoads` key to their app's plist.
**Note:** Your application must be signed for automatic updates on macOS.
This is a requirement of `Squirrel.Mac`.
### Windows
On Windows, you have to install your app into a user's machine before you can
use the `autoUpdater`, so it is recommended that you use the
[electron-winstaller][installer-lib], [electron-builder][electron-builder-lib] or the [grunt-electron-installer][installer] package to generate a Windows installer.
When using [electron-winstaller][installer-lib] or [electron-builder][electron-builder-lib] make sure you do not try to update your app [the first time it runs](https://github.com/electron/windows-installer#handling-squirrel-events) (Also see [this issue for more info](https://github.com/electron/electron/issues/7155)). It's also recommended to use [electron-squirrel-startup](https://github.com/mongodb-js/electron-squirrel-startup) to get desktop shortcuts for your app.
The installer generated with Squirrel will create a shortcut icon with an
[Application User Model ID][app-user-model-id] in the format of
`com.squirrel.PACKAGE_ID.YOUR_EXE_WITHOUT_DOT_EXE`, examples are
`com.squirrel.slack.Slack` and `com.squirrel.code.Code`. You have to use the
same ID for your app with `app.setAppUserModelId` API, otherwise Windows will
not be able to pin your app properly in task bar.
The server-side setup is also different from macOS. You can read the documents of
[Squirrel.Windows][squirrel-windows] to get more details.
### Linux
There is no built-in support for auto-updater on Linux, so it is recommended to
use the distribution's package manager to update your app.
## Events
The `autoUpdater` object emits the following events:
### Event: 'error'
Returns:
* `error` Error
Emitted when there is an error while updating.
### Event: 'checking-for-update'
Emitted when checking if an update has started.
### Event: 'update-available'
Emitted when there is an available update. The update is downloaded
automatically.
### Event: 'update-not-available'
Emitted when there is no available update.
### Event: 'update-downloaded'
Returns:
* `event` Event
* `releaseNotes` String
* `releaseName` String
* `releaseDate` Date
* `updateURL` String
Emitted when an update has been downloaded.
On Windows only `releaseName` is available.
## Methods
The `autoUpdater` object has the following methods:
### `autoUpdater.setFeedURL(url[, requestHeaders])`
* `url` String
* `requestHeaders` Object _macOS_ (optional) - HTTP request headers.
Sets the `url` and initialize the auto updater.
### `autoUpdater.getFeedURL()`
Returns `String` - The current update feed URL.
### `autoUpdater.checkForUpdates()`
Asks the server whether there is an update. You must call `setFeedURL` before
using this API.
### `autoUpdater.quitAndInstall()`
Restarts the app and installs the update after it has been downloaded. It
should only be called after `update-downloaded` has been emitted.
**Note:** `autoUpdater.quitAndInstall()` will close all application windows
first and only emit `before-quit` event on `app` after that. This is different
from the normal quit event sequence.
[squirrel-mac]: https://github.com/Squirrel/Squirrel.Mac
[server-support]: https://github.com/Squirrel/Squirrel.Mac#server-support
[squirrel-windows]: https://github.com/Squirrel/Squirrel.Windows
[installer]: https://github.com/electron/grunt-electron-installer
[installer-lib]: https://github.com/electron/windows-installer
[electron-builder-lib]: https://github.com/electron-userland/electron-builder
[app-user-model-id]: https://msdn.microsoft.com/en-us/library/windows/desktop/dd378459(v=vs.85).aspx
[electron-release-server]: https://github.com/ArekSredzki/electron-release-server
[squirrel-updates-server]: https://github.com/Aluxian/squirrel-updates-server
[nuts]: https://github.com/GitbookIO/nuts
[squirrel-release-server]: https://github.com/Arcath/squirrel-release-server

View file

@ -1,53 +0,0 @@
## Class: BrowserWindowProxy
> Manipulate the child browser window
Process: [Renderer](../glossary.md#renderer-process)
The `BrowserWindowProxy` object is returned from `window.open` and provides
limited functionality with the child window.
### Instance Methods
The `BrowserWindowProxy` object has the following instance methods:
#### `win.blur()`
Removes focus from the child window.
#### `win.close()`
Forcefully closes the child window without calling its unload event.
#### `win.eval(code)`
* `code` String
Evaluates the code in the child window.
#### `win.focus()`
Focuses the child window (brings the window to front).
#### `win.print()`
Invokes the print dialog on the child window.
#### `win.postMessage(message, targetOrigin)`
* `message` String
* `targetOrigin` String
Sends a message to the child window with the specified origin or `*` for no
origin preference.
In addition to these methods, the child window implements `window.opener` object
with no properties and a single method.
### Instance Properties
The `BrowserWindowProxy` object has the following instance properties:
#### `win.closed`
A Boolean that is set to true after the child window gets closed.

File diff suppressed because it is too large Load diff

View file

@ -1,189 +0,0 @@
# Supported Chrome Command Line Switches
> Command line switches supported by Electron.
You can use [app.commandLine.appendSwitch][append-switch] to append them in
your app's main script before the [ready][ready] event of the [app][app] module
is emitted:
```javascript
const {app} = require('electron')
app.commandLine.appendSwitch('remote-debugging-port', '8315')
app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1')
app.on('ready', () => {
// Your code here
})
```
## --ignore-connections-limit=`domains`
Ignore the connections limit for `domains` list separated by `,`.
## --disable-http-cache
Disables the disk cache for HTTP requests.
## --disable-http2
Disable HTTP/2 and SPDY/3.1 protocols.
## --debug=`port` and --debug-brk=`port`
Debug-related flags, see the [Debugging the Main Process][debugging-main-process] guide for details.
## --remote-debugging-port=`port`
Enables remote debugging over HTTP on the specified `port`.
## --js-flags=`flags`
Specifies the flags passed to the Node JS engine. It has to be passed when starting
Electron if you want to enable the `flags` in the main process.
```bash
$ electron --js-flags="--harmony_proxies --harmony_collections" your-app
```
See the [Node documentation][node-cli] or run `node --help` in your terminal for a list of available flags. Additionally, run `node --v8-options` to see a list of flags that specifically refer to Node's V8 JavaScript engine.
## --proxy-server=`address:port`
Use a specified proxy server, which overrides the system setting. This switch
only affects requests with HTTP protocol, including HTTPS and WebSocket
requests. It is also noteworthy that not all proxy servers support HTTPS and
WebSocket requests.
## --proxy-bypass-list=`hosts`
Instructs Electron to bypass the proxy server for the given semi-colon-separated
list of hosts. This flag has an effect only if used in tandem with
`--proxy-server`.
For example:
```javascript
const {app} = require('electron')
app.commandLine.appendSwitch('proxy-bypass-list', '<local>;*.google.com;*foo.com;1.2.3.4:5678')
```
Will use the proxy server for all hosts except for local addresses (`localhost`,
`127.0.0.1` etc.), `google.com` subdomains, hosts that contain the suffix
`foo.com` and anything at `1.2.3.4:5678`.
## --proxy-pac-url=`url`
Uses the PAC script at the specified `url`.
## --no-proxy-server
Don't use a proxy server and always make direct connections. Overrides any other
proxy server flags that are passed.
## --host-rules=`rules`
A comma-separated list of `rules` that control how hostnames are mapped.
For example:
* `MAP * 127.0.0.1` Forces all hostnames to be mapped to 127.0.0.1
* `MAP *.google.com proxy` Forces all google.com subdomains to be resolved to
"proxy".
* `MAP test.com [::1]:77` Forces "test.com" to resolve to IPv6 loopback. Will
also force the port of the resulting socket address to be 77.
* `MAP * baz, EXCLUDE www.google.com` Remaps everything to "baz", except for
"www.google.com".
These mappings apply to the endpoint host in a net request (the TCP connect
and host resolver in a direct connection, and the `CONNECT` in an HTTP proxy
connection, and the endpoint host in a `SOCKS` proxy connection).
## --host-resolver-rules=`rules`
Like `--host-rules` but these `rules` only apply to the host resolver.
## --auth-server-whitelist=`url`
A comma-separated list of servers for which integrated authentication is enabled.
For example:
```
--auth-server-whitelist='*example.com, *foobar.com, *baz'
```
then any `url` ending with `example.com`, `foobar.com`, `baz` will be considered
for integrated authentication. Without `*` prefix the url has to match exactly.
## --auth-negotiate-delegate-whitelist=`url`
A comma-separated list of servers for which delegation of user credentials is required.
Without `*` prefix the url has to match exactly.
## --ignore-certificate-errors
Ignores certificate related errors.
## --ppapi-flash-path=`path`
Sets the `path` of the pepper flash plugin.
## --ppapi-flash-version=`version`
Sets the `version` of the pepper flash plugin.
## --log-net-log=`path`
Enables net log events to be saved and writes them to `path`.
## --ssl-version-fallback-min=`version`
Sets the minimum SSL/TLS version (`tls1`, `tls1.1` or `tls1.2`) that TLS
fallback will accept.
## --cipher-suite-blacklist=`cipher_suites`
Specifies comma-separated list of SSL cipher suites to disable.
## --disable-renderer-backgrounding
Prevents Chromium from lowering the priority of invisible pages' renderer
processes.
This flag is global to all renderer processes, if you only want to disable
throttling in one window, you can take the hack of
[playing silent audio][play-silent-audio].
## --enable-logging
Prints Chromium's logging into console.
This switch can not be used in `app.commandLine.appendSwitch` since it is parsed
earlier than user's app is loaded, but you can set the `ELECTRON_ENABLE_LOGGING`
environment variable to achieve the same effect.
## --v=`log_level`
Gives the default maximal active V-logging level; 0 is the default. Normally
positive values are used for V-logging levels.
This switch only works when `--enable-logging` is also passed.
## --vmodule=`pattern`
Gives the per-module maximal V-logging levels to override the value given by
`--v`. E.g. `my_module=2,foo*=3` would change the logging level for all code in
source files `my_module.*` and `foo*.*`.
Any pattern containing a forward or backward slash will be tested against the
whole pathname and not just the module. E.g. `*/foo/bar/*=2` would change the
logging level for all code in the source files under a `foo/bar` directory.
This switch only works when `--enable-logging` is also passed.
[app]: app.md
[append-switch]: app.md#appcommandlineappendswitchswitch-value
[ready]: app.md#event-ready
[play-silent-audio]: https://github.com/atom/atom/pull/9485/files
[debugging-main-process]: ../tutorial/debugging-main-process.md
[node-cli]: https://nodejs.org/api/cli.html

View file

@ -1,192 +0,0 @@
## Class: ClientRequest
> Make HTTP/HTTPS requests.
Process: [Main](../glossary.md#main-process)
`ClientRequest` implements the [Writable Stream](https://nodejs.org/api/stream.html#stream_writable_streams)
interface and is therefore an [EventEmitter](https://nodejs.org/api/events.html#events_class_eventemitter).
### `new ClientRequest(options)`
* `options` (Object | String) - If `options` is a String, it is interpreted as
the request URL. If it is an object, it is expected to fully specify an HTTP request via the
following properties:
* `method` String (optional) - The HTTP request method. Defaults to the GET
method.
* `url` String (optional) - The request URL. Must be provided in the absolute
form with the protocol scheme specified as http or https.
* `session` Object (optional) - The [`Session`](session.md) instance with
which the request is associated.
* `partition` String (optional) - The name of the [`partition`](session.md)
with which the request is associated. Defaults to the empty string. The
`session` option prevails on `partition`. Thus if a `session` is explicitly
specified, `partition` is ignored.
* `protocol` String (optional) - The protocol scheme in the form 'scheme:'.
Currently supported values are 'http:' or 'https:'. Defaults to 'http:'.
* `host` String (optional) - The server host provided as a concatenation of
the hostname and the port number 'hostname:port'
* `hostname` String (optional) - The server host name.
* `port` Integer (optional) - The server's listening port number.
* `path` String (optional) - The path part of the request URL.
`options` properties such as `protocol`, `host`, `hostname`, `port` and `path`
strictly follow the Node.js model as described in the
[URL](https://nodejs.org/api/url.html) module.
For instance, we could have created the same request to 'github.com' as follows:
```JavaScript
const request = net.request({
method: 'GET',
protocol: 'https:',
hostname: 'github.com',
port: 443,
path: '/'
})
```
### Instance Events
#### Event: 'response'
Returns:
* `response` IncomingMessage - An object representing the HTTP response message.
#### Event: 'login'
Returns:
* `authInfo` Object
* `isProxy` Boolean
* `scheme` String
* `host` String
* `port` Integer
* `realm` String
* `callback` Function
Emitted when an authenticating proxy is asking for user credentials.
The `callback` function is expected to be called back with user credentials:
* `username` String
* `password` String
```JavaScript
request.on('login', (authInfo, callback) => {
callback('username', 'password')
})
```
Providing empty credentials will cancel the request and report an authentication
error on the response object:
```JavaScript
request.on('response', (response) => {
console.log(`STATUS: ${response.statusCode}`);
response.on('error', (error) => {
console.log(`ERROR: ${JSON.stringify(error)}`)
})
})
request.on('login', (authInfo, callback) => {
callback()
})
```
#### Event: 'finish'
Emitted just after the last chunk of the `request`'s data has been written into
the `request` object.
#### Event: 'abort'
Emitted when the `request` is aborted. The `abort` event will not be fired if
the `request` is already closed.
#### Event: 'error'
Returns:
* `error` Error - an error object providing some information about the failure.
Emitted when the `net` module fails to issue a network request. Typically when
the `request` object emits an `error` event, a `close` event will subsequently
follow and no response object will be provided.
#### Event: 'close'
Emitted as the last event in the HTTP request-response transaction. The `close`
event indicates that no more events will be emitted on either the `request` or
`response` objects.
### Instance Properties
#### `request.chunkedEncoding`
A Boolean specifying whether the request will use HTTP chunked transfer encoding
or not. Defaults to false. The property is readable and writable, however it can
be set only before the first write operation as the HTTP headers are not yet put
on the wire. Trying to set the `chunkedEncoding` property after the first write
will throw an error.
Using chunked encoding is strongly recommended if you need to send a large
request body as data will be streamed in small chunks instead of being
internally buffered inside Electron process memory.
### Instance Methods
#### `request.setHeader(name, value)`
* `name` String - An extra HTTP header name.
* `value` String - An extra HTTP header value.
Adds an extra HTTP header. The header name will issued as it is without
lowercasing. It can be called only before first write. Calling this method after
the first write will throw an error.
#### `request.getHeader(name)`
* `name` String - Specify an extra header name.
Returns String - The value of a previously set extra header name.
#### `request.removeHeader(name)`
* `name` String - Specify an extra header name.
Removes a previously set extra header name. This method can be called only
before first write. Trying to call it after the first write will throw an error.
#### `request.write(chunk[, encoding][, callback])`
* `chunk` (String | Buffer) - A chunk of the request body's data. If it is a
string, it is converted into a Buffer using the specified encoding.
* `encoding` String (optional) - Used to convert string chunks into Buffer
objects. Defaults to 'utf-8'.
* `callback` Function (optional) - Called after the write operation ends.
`callback` is essentially a dummy function introduced in the purpose of keeping
similarity with the Node.js API. It is called asynchronously in the next tick
after `chunk` content have been delivered to the Chromium networking layer.
Contrary to the Node.js implementation, it is not guaranteed that `chunk`
content have been flushed on the wire before `callback` is called.
Adds a chunk of data to the request body. The first write operation may cause
the request headers to be issued on the wire. After the first write operation,
it is not allowed to add or remove a custom header.
#### `request.end([chunk][, encoding][, callback])`
* `chunk` (String | Buffer) (optional)
* `encoding` String (optional)
* `callback` Function (optional)
Sends the last chunk of the request data. Subsequent write or end operations
will not be allowed. The `finish` event is emitted just after the end operation.
#### `request.abort()`
Cancels an ongoing HTTP transaction. If the request has already emitted the
`close` event, the abort operation will have no effect. Otherwise an ongoing
event will emit `abort` and `close` events. Additionally, if there is an ongoing
response object,it will emit the `aborted` event.

View file

@ -1,169 +0,0 @@
# clipboard
> Perform copy and paste operations on the system clipboard.
Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer-process)
The following example shows how to write a string to the clipboard:
```javascript
const {clipboard} = require('electron')
clipboard.writeText('Example String')
```
On X Window systems, there is also a selection clipboard. To manipulate it
you need to pass `selection` to each method:
```javascript
const {clipboard} = require('electron')
clipboard.writeText('Example String', 'selection')
console.log(clipboard.readText('selection'))
```
## Methods
The `clipboard` module has the following methods:
**Note:** Experimental APIs are marked as such and could be removed in future.
### `clipboard.readText([type])`
* `type` String (optional)
Returns `String` - The content in the clipboard as plain text.
### `clipboard.writeText(text[, type])`
* `text` String
* `type` String (optional)
Writes the `text` into the clipboard as plain text.
### `clipboard.readHTML([type])`
* `type` String (optional)
Returns `String` - The content in the clipboard as markup.
### `clipboard.writeHTML(markup[, type])`
* `markup` String
* `type` String (optional)
Writes `markup` to the clipboard.
### `clipboard.readImage([type])`
* `type` String (optional)
Returns [`NativeImage`](native-image.md) - The image content in the clipboard.
### `clipboard.writeImage(image[, type])`
* `image` [NativeImage](native-image.md)
* `type` String (optional)
Writes `image` to the clipboard.
### `clipboard.readRTF([type])`
* `type` String (optional)
Returns `String` - The content in the clipboard as RTF.
### `clipboard.writeRTF(text[, type])`
* `text` String
* `type` String (optional)
Writes the `text` into the clipboard in RTF.
### `clipboard.readBookmark()` _macOS_ _Windows_
Returns `Object`:
* `title` String
* `url` String
Returns an Object containing `title` and `url` keys representing the bookmark in
the clipboard. The `title` and `url` values will be empty strings when the
bookmark is unavailable.
### `clipboard.writeBookmark(title, url[, type])` _macOS_ _Windows_
* `title` String
* `url` String
* `type` String (optional)
Writes the `title` and `url` into the clipboard as a bookmark.
**Note:** Most apps on Windows don't support pasting bookmarks into them so
you can use `clipboard.write` to write both a bookmark and fallback text to the
clipboard.
```js
clipboard.write({
text: 'http://electron.atom.io',
bookmark: 'Electron Homepage'
})
```
### `clipboard.readFindText()` _macOS_
Returns `String` - The text on the find pasteboard. This method uses synchronous
IPC when called from the renderer process. The cached value is reread from the
find pasteboard whenever the application is activated.
### `clipboard.writeFindText(text)` _macOS_
* `text` String
Writes the `text` into the find pasteboard as plain text. This method uses
synchronous IPC when called from the renderer process.
### `clipboard.clear([type])`
* `type` String (optional)
Clears the clipboard content.
### `clipboard.availableFormats([type])`
* `type` String (optional)
Returns `String[]` - An array of supported formats for the clipboard `type`.
### `clipboard.has(data[, type])` _Experimental_
* `data` String
* `type` String (optional)
Returns `Boolean` - Whether the clipboard supports the format of specified `data`.
```javascript
const {clipboard} = require('electron')
console.log(clipboard.has('<p>selection</p>'))
```
### `clipboard.read(data[, type])` _Experimental_
* `data` String
* `type` String (optional)
Returns `String` - Reads `data` from the clipboard.
### `clipboard.write(data[, type])`
* `data` Object
* `text` String (optional)
* `html` String (optional)
* `image` [NativeImage](native-image.md) (optional)
* `rtf` String (optional)
* `bookmark` String (optional) - The title of the url at `text`.
* `type` String (optional)
```javascript
const {clipboard} = require('electron')
clipboard.write({text: 'test', html: '<b>test</b>'})
```
Writes `data` to the clipboard.

View file

@ -1,173 +0,0 @@
# contentTracing
> Collect tracing data from Chromium's content module for finding performance
bottlenecks and slow operations.
Process: [Main](../glossary.md#main-process)
This module does not include a web interface so you need to open
`chrome://tracing/` in a Chrome browser and load the generated file to view the
result.
```javascript
const {contentTracing} = require('electron')
const options = {
categoryFilter: '*',
traceOptions: 'record-until-full,enable-sampling'
}
contentTracing.startRecording(options, () => {
console.log('Tracing started')
setTimeout(() => {
contentTracing.stopRecording('', (path) => {
console.log('Tracing data recorded to ' + path)
})
}, 5000)
})
```
## Methods
The `contentTracing` module has the following methods:
### `contentTracing.getCategories(callback)`
* `callback` Function
* `categories` String[]
Get a set of category groups. The category groups can change as new code paths
are reached.
Once all child processes have acknowledged the `getCategories` request the
`callback` is invoked with an array of category groups.
### `contentTracing.startRecording(options, callback)`
* `options` Object
* `categoryFilter` String
* `traceOptions` String
* `callback` Function
Start recording on all processes.
Recording begins immediately locally and asynchronously on child processes
as soon as they receive the EnableRecording request. The `callback` will be
called once all child processes have acknowledged the `startRecording` request.
`categoryFilter` is a filter to control what category groups should be
traced. A filter can have an optional `-` prefix to exclude category groups
that contain a matching category. Having both included and excluded
category patterns in the same list is not supported.
Examples:
* `test_MyTest*`,
* `test_MyTest*,test_OtherStuff`,
* `"-excluded_category1,-excluded_category2`
`traceOptions` controls what kind of tracing is enabled, it is a comma-delimited
list. Possible options are:
* `record-until-full`
* `record-continuously`
* `trace-to-console`
* `enable-sampling`
* `enable-systrace`
The first 3 options are trace recoding modes and hence mutually exclusive.
If more than one trace recording modes appear in the `traceOptions` string,
the last one takes precedence. If none of the trace recording modes are
specified, recording mode is `record-until-full`.
The trace option will first be reset to the default option (`record_mode` set to
`record-until-full`, `enable_sampling` and `enable_systrace` set to `false`)
before options parsed from `traceOptions` are applied on it.
### `contentTracing.stopRecording(resultFilePath, callback)`
* `resultFilePath` String
* `callback` Function
* `resultFilePath` String
Stop recording on all processes.
Child processes typically cache trace data and only rarely flush and send
trace data back to the main process. This helps to minimize the runtime overhead
of tracing since sending trace data over IPC can be an expensive operation. So,
to end tracing, we must asynchronously ask all child processes to flush any
pending trace data.
Once all child processes have acknowledged the `stopRecording` request,
`callback` will be called with a file that contains the traced data.
Trace data will be written into `resultFilePath` if it is not empty or into a
temporary file. The actual file path will be passed to `callback` if it's not
`null`.
### `contentTracing.startMonitoring(options, callback)`
* `options` Object
* `categoryFilter` String
* `traceOptions` String
* `callback` Function
Start monitoring on all processes.
Monitoring begins immediately locally and asynchronously on child processes as
soon as they receive the `startMonitoring` request.
Once all child processes have acknowledged the `startMonitoring` request the
`callback` will be called.
### `contentTracing.stopMonitoring(callback)`
* `callback` Function
Stop monitoring on all processes.
Once all child processes have acknowledged the `stopMonitoring` request the
`callback` is called.
### `contentTracing.captureMonitoringSnapshot(resultFilePath, callback)`
* `resultFilePath` String
* `callback` Function
* `resultFilePath` String
Get the current monitoring traced data.
Child processes typically cache trace data and only rarely flush and send
trace data back to the main process. This is because it may be an expensive
operation to send the trace data over IPC and we would like to avoid unneeded
runtime overhead from tracing. So, to end tracing, we must asynchronously ask
all child processes to flush any pending trace data.
Once all child processes have acknowledged the `captureMonitoringSnapshot`
request the `callback` will be called with a file that contains the traced data.
### `contentTracing.getTraceBufferUsage(callback)`
* `callback` Function
* `value` Number
* `percentage` Number
Get the maximum usage across processes of trace buffer as a percentage of the
full state. When the TraceBufferUsage value is determined the `callback` is
called.
### `contentTracing.setWatchEvent(categoryName, eventName, callback)`
* `categoryName` String
* `eventName` String
* `callback` Function
`callback` will be called every time the given event occurs on any
process.
### `contentTracing.cancelWatchEvent()`
Cancel the watch event. This may lead to a race condition with the watch event
callback if tracing is enabled.

View file

@ -1,106 +0,0 @@
## Class: Cookies
> Query and modify a session's cookies.
Process: [Main](../glossary.md#main-process)
Instances of the `Cookies` class are accessed by using `cookies` property of
a `Session`.
For example:
```javascript
const {session} = require('electron')
// Query all cookies.
session.defaultSession.cookies.get({}, (error, cookies) => {
console.log(error, cookies)
})
// Query all cookies associated with a specific url.
session.defaultSession.cookies.get({url: 'http://www.github.com'}, (error, cookies) => {
console.log(error, cookies)
})
// Set a cookie with the given cookie data;
// may overwrite equivalent cookies if they exist.
const cookie = {url: 'http://www.github.com', name: 'dummy_name', value: 'dummy'}
session.defaultSession.cookies.set(cookie, (error) => {
if (error) console.error(error)
})
```
### Instance Events
The following events are available on instances of `Cookies`:
#### Event: 'changed'
* `event` Event
* `cookie` [Cookie](structures/cookie.md) - The cookie that was changed
* `cause` String - The cause of the change with one of the following values:
* `explicit` - The cookie was changed directly by a consumer's action.
* `overwrite` - The cookie was automatically removed due to an insert
operation that overwrote it.
* `expired` - The cookie was automatically removed as it expired.
* `evicted` - The cookie was automatically evicted during garbage collection.
* `expired-overwrite` - The cookie was overwritten with an already-expired
expiration date.
* `removed` Boolean - `true` if the cookie was removed, `false` otherwise.
Emitted when a cookie is changed because it was added, edited, removed, or
expired.
### Instance Methods
The following methods are available on instances of `Cookies`:
#### `cookies.get(filter, callback)`
* `filter` Object
* `url` String (optional) - Retrieves cookies which are associated with
`url`. Empty implies retrieving cookies of all urls.
* `name` String (optional) - Filters cookies by name.
* `domain` String (optional) - Retrieves cookies whose domains match or are
subdomains of `domains`
* `path` String (optional) - Retrieves cookies whose path matches `path`.
* `secure` Boolean (optional) - Filters cookies by their Secure property.
* `session` Boolean (optional) - Filters out session or persistent cookies.
* `callback` Function
* `error` Error
* `cookies` Cookies[]
Sends a request to get all cookies matching `details`, `callback` will be called
with `callback(error, cookies)` on complete.
`cookies` is an Array of [`cookie`](structures/cookie.md) objects.
#### `cookies.set(details, callback)`
* `details` Object
* `url` String - The url to associate the cookie with.
* `name` String (optional) - The name of the cookie. Empty by default if omitted.
* `value` String (optional) - The value of the cookie. Empty by default if omitted.
* `domain` String (optional) - The domain of the cookie. Empty by default if omitted.
* `path` String (optional) - The path of the cookie. Empty by default if omitted.
* `secure` Boolean (optional) - Whether the cookie should be marked as Secure. Defaults to
false.
* `httpOnly` Boolean (optional) - Whether the cookie should be marked as HTTP only.
Defaults to false.
* `expirationDate` Double (optional) - The expiration date of the cookie as the number of
seconds since the UNIX epoch. If omitted then the cookie becomes a session
cookie and will not be retained between sessions.
* `callback` Function
* `error` Error
Sets a cookie with `details`, `callback` will be called with `callback(error)`
on complete.
#### `cookies.remove(url, name, callback)`
* `url` String - The URL associated with the cookie.
* `name` String - The name of cookie to remove.
* `callback` Function
Removes the cookies matching `url` and `name`, `callback` will called with
`callback()` on complete.

View file

@ -1,112 +0,0 @@
# crashReporter
> Submit crash reports to a remote server.
Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer-process)
The following is an example of automatically submitting a crash report to a
remote server:
```javascript
const {crashReporter} = require('electron')
crashReporter.start({
productName: 'YourName',
companyName: 'YourCompany',
submitURL: 'https://your-domain.com/url-to-submit',
uploadToServer: true
})
```
For setting up a server to accept and process crash reports, you can use
following projects:
* [socorro](https://github.com/mozilla/socorro)
* [mini-breakpad-server](https://github.com/electron/mini-breakpad-server)
Crash reports are saved locally in an application-specific temp directory folder.
For a `productName` of `YourName`, crash reports will be stored in a folder
named `YourName Crashes` inside the temp directory. You can customize this temp
directory location for your app by calling the `app.setPath('temp', '/my/custom/temp')`
API before starting the crash reporter.
## Methods
The `crashReporter` module has the following methods:
### `crashReporter.start(options)`
* `options` Object
* `companyName` String (optional)
* `submitURL` String - URL that crash reports will be sent to as POST.
* `productName` String (optional) - Defaults to `app.getName()`.
* `uploadToServer` Boolean (optional) _macOS_ - Whether crash reports should be sent to the server
Default is `true`.
* `ignoreSystemCrashHandler` Boolean (optional) - Default is `false`.
* `extra` Object (optional) - An object you can define that will be sent along with the
report. Only string properties are sent correctly, Nested objects are not
supported.
You are required to call this method before using any other `crashReporter` APIs
and in each process (main/renderer) from which you want to collect crash reports.
You can pass different options to `crashReporter.start` when calling from different processes.
**Note:** On Windows and Linux, Electron uses `breakpad` for crash collection and reporting.
Crashes can be collected from the main and renderer process, but not from the child processes
created via the `child_process` module.
**Note:** On macOS, Electron uses a new `crashpad` client for crash collection and reporting.
Crashes can be collected from the main, renderer and any of the child processes created via the `child_process` module.
If you want to enable crash reporting, initializing `crashpad` from the main process using `crashReporter.start` is required
regardless of which process you want to collect crashes from. Once initialized this way, the crashpad handler collects
crashes from all processes. You still have to call `crashReporter.start` from the renderer process, otherwise crashes from
renderer processes will get reported without `companyName`, `productName` or any of the `extra` information.
### `crashReporter.getLastCrashReport()`
Returns [`CrashReport`](structures/crash-report.md):
Returns the date and ID of the last crash report. If no crash reports have been
sent or the crash reporter has not been started, `null` is returned.
### `crashReporter.getUploadedReports()`
Returns [`CrashReport[]`](structures/crash-report.md):
Returns all uploaded crash reports. Each report contains the date and uploaded
ID.
### `crashReporter.getUploadToServer()` _macOS_
Returns `Boolean` - Whether reports should be submitted to the server. Set through
the `start` method or `setUploadToServer`.
**Note:** This API can only be called from the main process.
### `crashReporter.setUploadToServer(uploadToServer)` _macOS_
* `uploadToServer` Boolean _macOS_ - Whether reports should be submitted to the server
This would normally be controlled by user preferences. This has no effect if
called before `start` is called.
**Note:** This API can only be called from the main process.
## Crash Report Payload
The crash reporter will send the following data to the `submitURL` as
a `multipart/form-data` `POST`:
* `ver` String - The version of Electron.
* `platform` String - e.g. 'win32'.
* `process_type` String - e.g. 'renderer'.
* `guid` String - e.g. '5e1286fc-da97-479e-918b-6bfb0c3d1c72'
* `_version` String - The version in `package.json`.
* `_productName` String - The product name in the `crashReporter` `options`
object.
* `prod` String - Name of the underlying product. In this case Electron.
* `_companyName` String - The company name in the `crashReporter` `options`
object.
* `upload_file_minidump` File - The crash report in the format of `minidump`.
* All level one properties of the `extra` object in the `crashReporter`
`options` object.

View file

@ -1,83 +0,0 @@
## Class: Debugger
> An alternate transport for Chrome's remote debugging protocol.
Process: [Main](../glossary.md#main-process)
Chrome Developer Tools has a [special binding][rdp] available at JavaScript
runtime that allows interacting with pages and instrumenting them.
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
try {
win.webContents.debugger.attach('1.1')
} catch (err) {
console.log('Debugger attach failed : ', err)
}
win.webContents.debugger.on('detach', (event, reason) => {
console.log('Debugger detached due to : ', reason)
})
win.webContents.debugger.on('message', (event, method, params) => {
if (method === 'Network.requestWillBeSent') {
if (params.request.url === 'https://www.github.com') {
win.webContents.debugger.detach()
}
}
})
win.webContents.debugger.sendCommand('Network.enable')
```
### Instance Methods
#### `debugger.attach([protocolVersion])`
* `protocolVersion` String (optional) - Requested debugging protocol version.
Attaches the debugger to the `webContents`.
#### `debugger.isAttached()`
Returns `Boolean` - Whether a debugger is attached to the `webContents`.
#### `debugger.detach()`
Detaches the debugger from the `webContents`.
#### `debugger.sendCommand(method[, commandParams, callback])`
* `method` String - Method name, should be one of the methods defined by the
remote debugging protocol.
* `commandParams` Object (optional) - JSON object with request parameters.
* `callback` Function (optional) - Response
* `error` Object - Error message indicating the failure of the command.
* `result` Any - Response defined by the 'returns' attribute of
the command description in the remote debugging protocol.
Send given command to the debugging target.
### Instance Events
#### Event: 'detach'
* `event` Event
* `reason` String - Reason for detaching debugger.
Emitted when debugging session is terminated. This happens either when
`webContents` is closed or devtools is invoked for the attached `webContents`.
#### Event: 'message'
* `event` Event
* `method` String - Method name.
* `params` Object - Event parameters defined by the 'parameters'
attribute in the remote debugging protocol.
Emitted whenever debugging target issues instrumentation event.
[rdp]: https://developer.chrome.com/devtools/docs/debugger-protocol
[`webContents.findInPage`]: web-contents.md#contentsfindinpagetext-options

View file

@ -1,76 +0,0 @@
# desktopCapturer
> Access information about media sources that can be used to capture audio and
> video from the desktop using the [`navigator.webkitGetUserMedia`] API.
Process: [Renderer](../glossary.md#renderer-process)
The following example shows how to capture video from a desktop window whose
title is `Electron`:
```javascript
// In the renderer process.
const {desktopCapturer} = require('electron')
desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
if (error) throw error
for (let i = 0; i < sources.length; ++i) {
if (sources[i].name === 'Electron') {
navigator.webkitGetUserMedia({
audio: false,
video: {
mandatory: {
chromeMediaSource: 'desktop',
chromeMediaSourceId: sources[i].id,
minWidth: 1280,
maxWidth: 1280,
minHeight: 720,
maxHeight: 720
}
}
}, handleStream, handleError)
return
}
}
})
function handleStream (stream) {
document.querySelector('video').src = URL.createObjectURL(stream)
}
function handleError (e) {
console.log(e)
}
```
To capture video from a source provided by `desktopCapturer` the constraints
passed to [`navigator.webkitGetUserMedia`] must include
`chromeMediaSource: 'desktop'`, and `audio: false`.
To capture both audio and video from the entire desktop the constraints passed
to [`navigator.webkitGetUserMedia`] must include `chromeMediaSource: 'screen'`,
and `audio: true`, but should not include a `chromeMediaSourceId` constraint.
## Methods
The `desktopCapturer` module has the following methods:
### `desktopCapturer.getSources(options, callback)`
* `options` Object
* `types` String[] - An array of Strings that lists the types of desktop sources
to be captured, available types are `screen` and `window`.
* `thumbnailSize` Object (optional) - The suggested size that the media source
thumbnail should be scaled to, defaults to `{width: 150, height: 150}`.
* `callback` Function
* `error` Error
* `sources` [DesktopCapturerSource[]](structures/desktop-capturer-source.md)
Starts gathering information about all available desktop media sources,
and calls `callback(error, sources)` when finished.
`sources` is an array of [`DesktopCapturerSource`](structures/desktop-capturer-source.md)
objects, each `DesktopCapturerSource` represents a screen or an individual window that can be
captured.
[`navigator.webkitGetUserMedia`]: https://developer.mozilla.org/en/docs/Web/API/Navigator/getUserMedia

View file

@ -1,161 +0,0 @@
# dialog
> Display native system dialogs for opening and saving files, alerting, etc.
Process: [Main](../glossary.md#main-process)
An example of showing a dialog to select multiple files and directories:
```javascript
const {dialog} = require('electron')
console.log(dialog.showOpenDialog({properties: ['openFile', 'openDirectory', 'multiSelections']}))
```
The Dialog is opened from Electron's main thread. If you want to use the dialog
object from a renderer process, remember to access it using the remote:
```javascript
const {dialog} = require('electron').remote
console.log(dialog)
```
## Methods
The `dialog` module has the following methods:
### `dialog.showOpenDialog([browserWindow, ]options[, callback])`
* `browserWindow` BrowserWindow (optional)
* `options` Object
* `title` String (optional)
* `defaultPath` String (optional)
* `buttonLabel` String (optional) - Custom label for the confirmation button, when
left empty the default label will be used.
* `filters` [FileFilter[]](structures/file-filter.md) (optional)
* `properties` String[] (optional) - Contains which features the dialog should use, can
contain `openFile`, `openDirectory`, `multiSelections`, `createDirectory`
and `showHiddenFiles`.
* `normalizeAccessKeys` Boolean (optional) - Normalize the keyboard access keys
across platforms. Default is `false`. Enabling this assumes `&` is used in
the button labels for the placement of the keyboard shortcut access key
and labels will be converted so they work correctly on each platform, `&`
characters are removed on macOS, converted to `_` on Linux, and left
untouched on Windows. For example, a button label of `Vie&w` will be
converted to `Vie_w` on Linux and `View` on macOS and can be selected
via `Alt-W` on Windows and Linux.
* `callback` Function (optional)
* `filePaths` String[] - An array of file paths chosen by the user
Returns `String[]`, an array of file paths chosen by the user,
if the callback is provided it returns `undefined`.
The `browserWindow` argument allows the dialog to attach itself to a parent window, making it modal.
The `filters` specifies an array of file types that can be displayed or
selected when you want to limit the user to a specific type. For example:
```javascript
{
filters: [
{name: 'Images', extensions: ['jpg', 'png', 'gif']},
{name: 'Movies', extensions: ['mkv', 'avi', 'mp4']},
{name: 'Custom File Type', extensions: ['as']},
{name: 'All Files', extensions: ['*']}
]
}
```
The `extensions` array should contain extensions without wildcards or dots (e.g.
`'png'` is good but `'.png'` and `'*.png'` are bad). To show all files, use the
`'*'` wildcard (no other wildcard is supported).
If a `callback` is passed, the API call will be asynchronous and the result
will be passed via `callback(filenames)`
**Note:** On Windows and Linux an open dialog can not be both a file selector
and a directory selector, so if you set `properties` to
`['openFile', 'openDirectory']` on these platforms, a directory selector will be
shown.
### `dialog.showSaveDialog([browserWindow, ]options[, callback])`
* `browserWindow` BrowserWindow (optional)
* `options` Object
* `title` String (optional)
* `defaultPath` String (optional)
* `buttonLabel` String (optional) - Custom label for the confirmation button, when
left empty the default label will be used.
* `filters` [FileFilter[]](structures/file-filter.md) (optional)
* `callback` Function (optional)
* `filename` String
Returns `String`, the path of the file chosen by the user,
if a callback is provided it returns `undefined`.
The `browserWindow` argument allows the dialog to attach itself to a parent window, making it modal.
The `filters` specifies an array of file types that can be displayed, see
`dialog.showOpenDialog` for an example.
If a `callback` is passed, the API call will be asynchronous and the result
will be passed via `callback(filename)`
### `dialog.showMessageBox([browserWindow, ]options[, callback])`
* `browserWindow` BrowserWindow (optional)
* `options` Object
* `type` String (optional) - Can be `"none"`, `"info"`, `"error"`, `"question"` or
`"warning"`. On Windows, "question" displays the same icon as "info", unless
you set an icon using the "icon" option.
* `buttons` String[] (optional) - Array of texts for buttons. On Windows, an empty array
will result in one button labeled "OK".
* `defaultId` Integer (optional) - Index of the button in the buttons array which will
be selected by default when the message box opens.
* `title` String (optional) - Title of the message box, some platforms will not show it.
* `message` String - Content of the message box.
* `detail` String (optional) - Extra information of the message.
* `icon` [NativeImage](native-image.md) (optional)
* `cancelId` Integer (optional) - The value will be returned when user cancels the dialog
instead of clicking the buttons of the dialog. By default it is the index
of the buttons that have "cancel" or "no" as label, or 0 if there is no such
buttons. On macOS and Windows the index of the "Cancel" button will always
be used as `cancelId` even if it is specified.
* `noLink` Boolean (optional) - On Windows Electron will try to figure out which one of
the `buttons` are common buttons (like "Cancel" or "Yes"), and show the
others as command links in the dialog. This can make the dialog appear in
the style of modern Windows apps. If you don't like this behavior, you can
set `noLink` to `true`.
* `callback` Function (optional)
* `response` Number - The index of the button that was clicked
Returns `Integer`, the index of the clicked button, if a callback is provided
it returns undefined.
Shows a message box, it will block the process until the message box is closed.
It returns the index of the clicked button.
The `browserWindow` argument allows the dialog to attach itself to a parent window, making it modal.
If a `callback` is passed, the API call will be asynchronous and the result
will be passed via `callback(response)`.
### `dialog.showErrorBox(title, content)`
* `title` String - The title to display in the error box
* `content` String - The text content to display in the error box
Displays a modal dialog that shows an error message.
This API can be called safely before the `ready` event the `app` module emits,
it is usually used to report errors in early stage of startup. If called
before the app `ready`event on Linux, the message will be emitted to stderr,
and no GUI dialog will appear.
## Sheets
On macOS, dialogs are presented as sheets attached to a window if you provide
a `BrowserWindow` reference in the `browserWindow` parameter, or modals if no
window is provided.
You can call `BrowserWindow.getCurrentWindow().setSheetOffset(offset)` to change
the offset from the window frame where sheets are attached.

View file

@ -1,168 +0,0 @@
## Class: DownloadItem
> Control file downloads from remote sources.
Process: [Main](../glossary.md#main-process)
`DownloadItem` is an `EventEmitter` that represents a download item in Electron.
It is used in `will-download` event of `Session` class, and allows users to
control the download item.
```javascript
// In the main process.
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.webContents.session.on('will-download', (event, item, webContents) => {
// Set the save path, making Electron not to prompt a save dialog.
item.setSavePath('/tmp/save.pdf')
item.on('updated', (event, state) => {
if (state === 'interrupted') {
console.log('Download is interrupted but can be resumed')
} else if (state === 'progressing') {
if (item.isPaused()) {
console.log('Download is paused')
} else {
console.log(`Received bytes: ${item.getReceivedBytes()}`)
}
}
})
item.once('done', (event, state) => {
if (state === 'completed') {
console.log('Download successfully')
} else {
console.log(`Download failed: ${state}`)
}
})
})
```
### Instance Events
#### Event: 'updated'
Returns:
* `event` Event
* `state` String
Emitted when the download has been updated and is not done.
The `state` can be one of following:
* `progressing` - The download is in-progress.
* `interrupted` - The download has interrupted and can be resumed.
#### Event: 'done'
Returns:
* `event` Event
* `state` String
Emitted when the download is in a terminal state. This includes a completed
download, a cancelled download (via `downloadItem.cancel()`), and interrupted
download that can't be resumed.
The `state` can be one of following:
* `completed` - The download completed successfully.
* `cancelled` - The download has been cancelled.
* `interrupted` - The download has interrupted and can not resume.
### Instance Methods
The `downloadItem` object has the following methods:
#### `downloadItem.setSavePath(path)`
* `path` String - Set the save file path of the download item.
The API is only available in session's `will-download` callback function.
If user doesn't set the save path via the API, Electron will use the original
routine to determine the save path(Usually prompts a save dialog).
#### `downloadItem.getSavePath()`
Returns `String` - The save path of the download item. This will be either the path
set via `downloadItem.setSavePath(path)` or the path selected from the shown
save dialog.
#### `downloadItem.pause()`
Pauses the download.
#### `downloadItem.isPaused()`
Returns `Boolean` - Whether the download is paused.
#### `downloadItem.resume()`
Resumes the download that has been paused.
#### `downloadItem.canResume()`
Resumes `Boolean` - Whether the download can resume.
#### `downloadItem.cancel()`
Cancels the download operation.
#### `downloadItem.getURL()`
Returns `String` - The origin url where the item is downloaded from.
#### `downloadItem.getMimeType()`
Returns `String` - The files mime type.
#### `downloadItem.hasUserGesture()`
Returns `Boolean` - Whether the download has user gesture.
#### `downloadItem.getFilename()`
Returns `String` - The file name of the download item.
**Note:** The file name is not always the same as the actual one saved in local
disk. If user changes the file name in a prompted download saving dialog, the
actual name of saved file will be different.
#### `downloadItem.getTotalBytes()`
Returns `Integer` - The total size in bytes of the download item.
If the size is unknown, it returns 0.
#### `downloadItem.getReceivedBytes()`
Returns `Integer` - The received bytes of the download item.
#### `downloadItem.getContentDisposition()`
Returns `String` - The Content-Disposition field from the response
header.
#### `downloadItem.getState()`
Returns `String` - The current state. Can be `progressing`, `completed`, `cancelled` or `interrupted`.
**Note:** The following methods are useful specifically to resume a
`cancelled` item when session is restarted.
#### `downloadItem.getURLChain()`
Returns `String[]` - The complete url chain of the item including any redirects.
#### `downloadItem.getLastModifiedTime()`
Returns `String` - Last-Modified header value.
#### `downloadItem.getETag()`
Returns `String` - ETag header value.
#### `downloadItem.getStartTime()`
Returns `Double` - Number of seconds since the UNIX epoch when the download was
started.

View file

@ -1,87 +0,0 @@
# Environment Variables
> Control application configuration and behavior without changing code.
Certain Electron behaviors are controlled by environment variables because they
are initialized earlier than the command line flags and the app's code.
POSIX shell example:
```bash
$ export ELECTRON_ENABLE_LOGGING=true
$ electron
```
Windows console example:
```powershell
> set ELECTRON_ENABLE_LOGGING=true
> electron
```
## Production Variables
The following environment variables are intended primarily for use at runtime
in packaged Electron applications.
### `GOOGLE_API_KEY`
Electron includes a hardcoded API key for making requests to Google's geocoding
webservice. Because this API key is included in every version of Electron, it
often exceeds its usage quota. To work around this, you can supply your own
Google API key in the environment. Place the following code in your main process
file, before opening any browser windows that will make geocoding requests:
```javascript
process.env.GOOGLE_API_KEY = 'YOUR_KEY_HERE'
```
For instructions on how to acquire a Google API key, visit [this page](https://www.chromium.org/developers/how-tos/api-keys).
By default, a newly generated Google API key may not be allowed to make
geocoding requests. To enable geocoding requests, visit [this page](https://console.developers.google.com/apis/api/geolocation/overview).
### `ELECTRON_NO_ASAR`
Disables ASAR support. This variable is only supported in forked child processes
and spawned child processes that set `ELECTRON_RUN_AS_NODE`.
### `ELECTRON_RUN_AS_NODE`
Starts the process as a normal Node.js process.
### `ELECTRON_NO_ATTACH_CONSOLE` _Windows_
Don't attach to the current console session.
### `ELECTRON_FORCE_WINDOW_MENU_BAR` _Linux_
Don't use the global menu bar on Linux.
## Development Variables
The following environment variables are intended primarily for development and
debugging purposes.
### `ELECTRON_ENABLE_LOGGING`
Prints Chrome's internal logging to the console.
### `ELECTRON_LOG_ASAR_READS`
When Electron reads from an ASAR file, log the read offset and file path to
the system `tmpdir`. The resulting file can be provided to the ASAR module
to optimize file ordering.
### `ELECTRON_ENABLE_STACK_DUMPING`
Prints the stack trace to the console when Electron crashes.
This environment variable will not work if the `crashReporter` is started.
### `ELECTRON_DEFAULT_ERROR_MODE` _Windows_
Shows the Windows's crash dialog when Electron crashes.
This environment variable will not work if the `crashReporter` is started.

View file

@ -1,33 +0,0 @@
# `File` Object
> Use the HTML5 `File` API to work natively with files on the filesystem.
The DOM's File interface provides abstraction around native files in order to
let users work on native files directly with the HTML5 file API. Electron has
added a `path` attribute to the `File` interface which exposes the file's real
path on filesystem.
Example of getting a real path from a dragged-onto-the-app file:
```html
<div id="holder">
Drag your file here
</div>
<script>
const holder = document.getElementById('holder')
holder.ondragover = () => {
return false;
}
holder.ondragleave = holder.ondragend = () => {
return false;
}
holder.ondrop = (e) => {
e.preventDefault()
for (let f of e.dataTransfer.files) {
console.log('File(s) you dragged here: ', f.path)
}
return false;
}
</script>
```

View file

@ -1,143 +0,0 @@
# Frameless Window
> Open a window without toolbars, borders, or other graphical "chrome".
A frameless window is a window that has no
[chrome](https://developer.mozilla.org/en-US/docs/Glossary/Chrome), the parts of
the window, like toolbars, that are not a part of the web page. These are
options on the [`BrowserWindow`](browser-window.md) class.
## Create a frameless window
To create a frameless window, you need to set `frame` to `false` in
[BrowserWindow](browser-window.md)'s `options`:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow({width: 800, height: 600, frame: false})
win.show()
```
### Alternatives on macOS
On macOS 10.9 Mavericks and newer, there's an alternative way to specify
a chromeless window. Instead of setting `frame` to `false` which disables
both the titlebar and window controls, you may want to have the title bar
hidden and your content extend to the full window size, yet still preserve
the window controls ("traffic lights") for standard window actions.
You can do so by specifying the new `titleBarStyle` option:
#### `hidden`
Results in a hidden title bar and a full size content window, yet the title bar still has the standard window controls (“traffic lights”) in the top left.
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow({titleBarStyle: 'hidden'})
win.show()
```
#### `hidden-inset`
Results in a hidden title bar with an alternative look where the traffic light buttons are slightly more inset from the window edge.
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow({titleBarStyle: 'hidden-inset'})
win.show()
```
## Transparent window
By setting the `transparent` option to `true`, you can also make the frameless
window transparent:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow({transparent: true, frame: false})
win.show()
```
### Limitations
* You can not click through the transparent area. We are going to introduce an
API to set window shape to solve this, see
[our issue](https://github.com/electron/electron/issues/1335) for details.
* Transparent windows are not resizable. Setting `resizable` to `true` may make
a transparent window stop working on some platforms.
* The `blur` filter only applies to the web page, so there is no way to apply
blur effect to the content below the window (i.e. other applications open on
the user's system).
* On Windows operating systems, transparent windows will not work when DWM is
disabled.
* On Linux users have to put `--enable-transparent-visuals --disable-gpu` in
the command line to disable GPU and allow ARGB to make transparent window,
this is caused by an upstream bug that [alpha channel doesn't work on some
NVidia drivers](https://code.google.com/p/chromium/issues/detail?id=369209) on
Linux.
* On Mac the native window shadow will not be shown on a transparent window.
## Click-through window
To create a click-through window, i.e. making the window ignore all mouse
events, you can call the [win.setIgnoreMouseEvents(ignore)][ignore-mouse-events]
API:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.setIgnoreMouseEvents(true)
```
## Draggable region
By default, the frameless window is non-draggable. Apps need to specify
`-webkit-app-region: drag` in CSS to tell Electron which regions are draggable
(like the OS's standard titlebar), and apps can also use
`-webkit-app-region: no-drag` to exclude the non-draggable area from the
draggable region. Note that only rectangular shapes are currently supported.
To make the whole window draggable, you can add `-webkit-app-region: drag` as
`body`'s style:
```html
<body style="-webkit-app-region: drag">
</body>
```
And note that if you have made the whole window draggable, you must also mark
buttons as non-draggable, otherwise it would be impossible for users to click on
them:
```css
button {
-webkit-app-region: no-drag;
}
```
If you're setting just a custom titlebar as draggable, you also need to make all
buttons in titlebar non-draggable.
## Text selection
In a frameless window the dragging behaviour may conflict with selecting text.
For example, when you drag the titlebar you may accidentally select the text on
the titlebar. To prevent this, you need to disable text selection within a
draggable area like this:
```css
.titlebar {
-webkit-user-select: none;
-webkit-app-region: drag;
}
```
## Context menu
On some platforms, the draggable area will be treated as a non-client frame, so
when you right click on it a system menu will pop up. To make the context menu
behave correctly on all platforms you should never use a custom context menu on
draggable areas.
[ignore-mouse-events]: browser-window.md#winsetignoremouseeventsignore

View file

@ -1,75 +0,0 @@
# globalShortcut
> Detect keyboard events when the application does not have keyboard focus.
Process: [Main](../glossary.md#main-process)
The `globalShortcut` module can register/unregister a global keyboard shortcut
with the operating system so that you can customize the operations for various
shortcuts.
**Note:** The shortcut is global; it will work even if the app does
not have the keyboard focus. You should not use this module until the `ready`
event of the app module is emitted.
```javascript
const {app, globalShortcut} = require('electron')
app.on('ready', () => {
// Register a 'CommandOrControl+X' shortcut listener.
const ret = globalShortcut.register('CommandOrControl+X', () => {
console.log('CommandOrControl+X is pressed')
})
if (!ret) {
console.log('registration failed')
}
// Check whether a shortcut is registered.
console.log(globalShortcut.isRegistered('CommandOrControl+X'))
})
app.on('will-quit', () => {
// Unregister a shortcut.
globalShortcut.unregister('CommandOrControl+X')
// Unregister all shortcuts.
globalShortcut.unregisterAll()
})
```
## Methods
The `globalShortcut` module has the following methods:
### `globalShortcut.register(accelerator, callback)`
* `accelerator` [Accelerator](accelerator.md)
* `callback` Function
Registers a global shortcut of `accelerator`. The `callback` is called when
the registered shortcut is pressed by the user.
When the accelerator is already taken by other applications, this call will
silently fail. This behavior is intended by operating systems, since they don't
want applications to fight for global shortcuts.
### `globalShortcut.isRegistered(accelerator)`
* `accelerator` [Accelerator](accelerator.md)
Returns `Boolean` - Whether this application has registered `accelerator`.
When the accelerator is already taken by other applications, this call will
still return `false`. This behavior is intended by operating systems, since they
don't want applications to fight for global shortcuts.
### `globalShortcut.unregister(accelerator)`
* `accelerator` [Accelerator](accelerator.md)
Unregisters the global shortcut of `accelerator`.
### `globalShortcut.unregisterAll()`
Unregisters all of the global shortcuts.

View file

@ -1,74 +0,0 @@
## Class: IncomingMessage
> Handle responses to HTTP/HTTPS requests.
Process: [Main](../glossary.md#main-process)
`IncomingMessage` implements the [Readable Stream](https://nodejs.org/api/stream.html#stream_readable_streams)
interface and is therefore an [EventEmitter](https://nodejs.org/api/events.html#events_class_eventemitter).
### Instance Events
#### Event: 'data'
Returns:
* `chunk` Buffer - A chunk of response body's data.
The `data` event is the usual method of transferring response data into
applicative code.
#### Event: 'end'
Indicates that response body has ended.
#### Event: 'aborted'
Emitted when a request has been canceled during an ongoing HTTP transaction.
#### Event: 'error'
Returns:
`error` Error - Typically holds an error string identifying failure root cause.
Emitted when an error was encountered while streaming response data events. For
instance, if the server closes the underlying while the response is still
streaming, an `error` event will be emitted on the response object and a `close`
event will subsequently follow on the request object.
### Instance Properties
An `IncomingMessage` instance has the following readable properties:
#### `response.statusCode`
An Integer indicating the HTTP response status code.
#### `response.statusMessage`
A String representing the HTTP status message.
#### `response.headers`
An Object representing the response HTTP headers. The `headers` object is
formatted as follows:
* All header names are lowercased.
* Each header name produces an array-valued property on the headers object.
* Each header value is pushed into the array associated with its header name.
#### `response.httpVersion`
A String indicating the HTTP protocol version number. Typical values are '1.0'
or '1.1'. Additionally `httpVersionMajor` and `httpVersionMinor` are two
Integer-valued readable properties that return respectively the HTTP major and
minor version numbers.
#### `response.httpVersionMajor`
An Integer indicating the HTTP protocol major version number.
#### `response.httpVersionMinor`
An Integer indicating the HTTP protocol minor version number.

View file

@ -1,99 +0,0 @@
# ipcMain
> Communicate asynchronously from the main process to renderer processes.
Process: [Main](../glossary.md#main-process)
The `ipcMain` module is an instance of the
[EventEmitter](https://nodejs.org/api/events.html#events_class_eventemitter) class. When used in the main
process, it handles asynchronous and synchronous messages sent from a renderer
process (web page). Messages sent from a renderer will be emitted to this
module.
## Sending Messages
It is also possible to send messages from the main process to the renderer
process, see [webContents.send][web-contents-send] for more information.
* When sending a message, the event name is the `channel`.
* To reply a synchronous message, you need to set `event.returnValue`.
* To send an asynchronous back to the sender, you can use
`event.sender.send(...)`.
An example of sending and handling messages between the render and main
processes:
```javascript
// In main process.
const {ipcMain} = require('electron')
ipcMain.on('asynchronous-message', (event, arg) => {
console.log(arg) // prints "ping"
event.sender.send('asynchronous-reply', 'pong')
})
ipcMain.on('synchronous-message', (event, arg) => {
console.log(arg) // prints "ping"
event.returnValue = 'pong'
})
```
```javascript
// In renderer process (web page).
const {ipcRenderer} = require('electron')
console.log(ipcRenderer.sendSync('synchronous-message', 'ping')) // prints "pong"
ipcRenderer.on('asynchronous-reply', (event, arg) => {
console.log(arg) // prints "pong"
})
ipcRenderer.send('asynchronous-message', 'ping')
```
## Methods
The `ipcMain` module has the following method to listen for events:
### `ipcMain.on(channel, listener)`
* `channel` String
* `listener` Function
Listens to `channel`, when a new message arrives `listener` would be called with
`listener(event, args...)`.
### `ipcMain.once(channel, listener)`
* `channel` String
* `listener` Function
Adds a one time `listener` function for the event. This `listener` is invoked
only the next time a message is sent to `channel`, after which it is removed.
### `ipcMain.removeListener(channel, listener)`
* `channel` String
* `listener` Function
Removes the specified `listener` from the listener array for the specified
`channel`.
### `ipcMain.removeAllListeners([channel])`
* `channel` String (optional)
Removes all listeners, or those of the specified `channel`.
## Event object
The `event` object passed to the `callback` has the following methods:
### `event.returnValue`
Set this to the value to be returned in a synchronous message.
### `event.sender`
Returns the `webContents` that sent the message, you can call
`event.sender.send` to reply to the asynchronous message, see
[webContents.send][web-contents-send] for more information.
[web-contents-send]: web-contents.md#webcontentssendchannel-arg1-arg2-

View file

@ -1,81 +0,0 @@
# ipcRenderer
> Communicate asynchronously from a renderer process to the main process.
Process: [Renderer](../glossary.md#renderer-process)
The `ipcRenderer` module is an instance of the
[EventEmitter](https://nodejs.org/api/events.html#events_class_eventemitter) class. It provides a few
methods so you can send synchronous and asynchronous messages from the render
process (web page) to the main process. You can also receive replies from the
main process.
See [ipcMain](ipc-main.md) for code examples.
## Methods
The `ipcRenderer` module has the following method to listen for events and send messages:
### `ipcRenderer.on(channel, listener)`
* `channel` String
* `listener` Function
Listens to `channel`, when a new message arrives `listener` would be called with
`listener(event, args...)`.
### `ipcRenderer.once(channel, listener)`
* `channel` String
* `listener` Function
Adds a one time `listener` function for the event. This `listener` is invoked
only the next time a message is sent to `channel`, after which it is removed.
### `ipcRenderer.removeListener(channel, listener)`
* `channel` String
* `listener` Function
Removes the specified `listener` from the listener array for the specified
`channel`.
### `ipcRenderer.removeAllListeners([channel])`
* `channel` String (optional)
Removes all listeners, or those of the specified `channel`.
### `ipcRenderer.send(channel[, arg1][, arg2][, ...])`
* `channel` String
* `...args` any[]
Send a message to the main process asynchronously via `channel`, you can also
send arbitrary arguments. Arguments will be serialized in JSON internally and
hence no functions or prototype chain will be included.
The main process handles it by listening for `channel` with `ipcMain` module.
### `ipcRenderer.sendSync(channel[, arg1][, arg2][, ...])`
* `channel` String
* `...args` any[]
Send a message to the main process synchronously via `channel`, you can also
send arbitrary arguments. Arguments will be serialized in JSON internally and
hence no functions or prototype chain will be included.
The main process handles it by listening for `channel` with `ipcMain` module,
and replies by setting `event.returnValue`.
**Note:** Sending a synchronous message will block the whole renderer process,
unless you know what you are doing you should never use it.
### `ipcRenderer.sendToHost(channel[, arg1][, arg2][, ...])`
* `channel` String
* `...args` any[]
Like `ipcRenderer.send` but the event will be sent to the `<webview>` element in
the host page instead of the main process.

View file

@ -1,139 +0,0 @@
# Locales
> Locale values returned by `app.getLocale()`.
Electron uses Chromium's `l10n_util` library to fetch the locale. Possible
values are listed below:
| Language Code | Language Name |
|---------------|---------------|
| af | Afrikaans |
| an | Aragonese |
| ar-AE | Arabic (U.A.E.) |
| ar-IQ | Arabic (Iraq) |
| ar | Arabic (Standard) |
| ar-BH | Arabic (Bahrain) |
| ar-DZ | Arabic (Algeria) |
| ar-EG | Arabic (Egypt) |
| ar-JO | Arabic (Jordan) |
| ar-KW | Arabic (Kuwait) |
| ar-LB | Arabic (Lebanon) |
| ar-LY | Arabic (Libya) |
| ar-MA | Arabic (Morocco) |
| ar-OM | Arabic (Oman) |
| ar-QA | Arabic (Qatar) |
| ar-SA | Arabic (Saudi Arabia) |
| ar-SY | Arabic (Syria) |
| ar-TN | Arabic (Tunisia) |
| ar-YE | Arabic (Yemen) |
| as | Assamese |
| ast | Asturian |
| az | Azerbaijani |
| be | Belarusian |
| bg | Bulgarian |
| bg | Bulgarian |
| bn | Bengali |
| br | Breton |
| bs | Bosnian |
| ca | Catalan |
| ce | Chechen |
| ch | Chamorro |
| co | Corsican |
| cr | Cree |
| cs | Czech |
| cv | Chuvash |
| da | Danish |
| de | German (Standard) |
| de-AT | German (Austria) |
| de-CH | German (Switzerland) |
| de-DE | German (Germany) |
| de-LI | German (Liechtenstein) |
| de-LU | German (Luxembourg) |
| el | Greek |
| en-AU | English (Australia) |
| en-BZ | English (Belize) |
| en | English |
| en-CA | English (Canada) |
| en-GB | English (United Kingdom) |
| en-IE | English (Ireland) |
| en-JM | English (Jamaica) |
| en-NZ | English (New Zealand) |
| en-PH | English (Philippines) |
| en-TT | English (Trinidad & Tobago) |
| en-US | English (United States) |
| en-ZA | English (South Africa) |
| en-ZW | English (Zimbabwe) |
| eo | Esperanto |
| et | Estonian |
| eu | Basque |
| fa | Persian |
| fa | Farsi |
| fa-IR | Persian/Iran |
| fi | Finnish |
| fj | Fijian |
| fo | Faeroese |
| fr-CH | French (Switzerland) |
| fr-FR | French (France) |
| fr-LU | French (Luxembourg) |
| fr-MC | French (Monaco) |
| fr | French (Standard) |
| fr-BE | French (Belgium) |
| fr-CA | French (Canada) |
| fur | Friulian |
| fy | Frisian |
| ga | Irish |
| gd-IE | Gaelic (Irish) |
| gd | Gaelic (Scots) |
| gl | Galacian |
| gu | Gujurati |
| he | Hebrew |
| hi | Hindi |
| hr | Croatian |
| ht | Haitian |
| hu | Hungarian |
| hy | Armenian |
| id | Indonesian |
| is | Icelandic |
| it-CH | Italian (Switzerland) |
| it | Italian (Standard) |
| iu | Inuktitut |
| ja | Japanese |
| ka | Georgian |
| kk | Kazakh |
| km | Khmer |
| kn | Kannada |
| ko | Korean |
| ko-KP | Korean (North Korea) |
| ko-KR | Korean (South Korea) |
| ks | Kashmiri |
| ky | Kirghiz |
| la | Latin |
| lb | Luxembourgish |
| lt | Lithuanian |
| lv | Latvian |
| mi | Maori |
| mk | FYRO Macedonian |
| ml | Malayalam |
| mo | Moldavian |
| mr | Marathi |
| ms | Malay |
| mt | Maltese |
| my | Burmese |
| nb | Norwegian (Bokmal) |
| ne | Nepali |
| ng | Ndonga |
| nl | Dutch (Standard) |
| nl-BE | Dutch (Belgian) |
| nn | Norwegian (Nynorsk) |
| no | Norwegian |
| nv | Navajo |
| oc | Occitan |
| om | Oromo |
| or | Oriya |
| sq | Albanian |
| tlh | Klingon |
| zh-TW | Chinese (Taiwan) |
| zh | Chinese |
| zh-CN | Chinese (PRC) |
| zh-HK | Chinese (Hong Kong) |
| zh-SG | Chinese (Singapore) |

View file

@ -1,116 +0,0 @@
## Class: MenuItem
> Add items to native application menus and context menus.
Process: [Main](../glossary.md#main-process)
See [`Menu`](menu.md) for examples.
### `new MenuItem(options)`
* `options` Object
* `click` Function (optional) - Will be called with
`click(menuItem, browserWindow, event)` when the menu item is clicked.
* `menuItem` MenuItem
* `browserWindow` BrowserWindow
* `event` Event
* `role` String (optional) - Define the action of the menu item, when specified the
`click` property will be ignored.
* `type` String (optional) - Can be `normal`, `separator`, `submenu`, `checkbox` or
`radio`.
* `label` String - (optional)
* `sublabel` String - (optional)
* `accelerator` [Accelerator](accelerator.md) (optional)
* `icon` ([NativeImage](native-image.md) | String) (optional)
* `enabled` Boolean (optional) - If false, the menu item will be greyed out and
unclickable.
* `visible` Boolean (optional) - If false, the menu item will be entirely hidden.
* `checked` Boolean (optional) - Should only be specified for `checkbox` or `radio` type
menu items.
* `submenu` (MenuItemConstructorOptions[] | Menu) (optional) - Should be specified for `submenu` type menu items. If
`submenu` is specified, the `type: 'submenu'` can be omitted. If the value
is not a `Menu` then it will be automatically converted to one using
`Menu.buildFromTemplate`.
* `id` String (optional) - Unique within a single menu. If defined then it can be used
as a reference to this item by the position attribute.
* `position` String (optional) - This field allows fine-grained definition of the
specific location within a given menu.
It is best to specify `role` for any menu item that matches a standard role,
rather than trying to manually implement the behavior in a `click` function.
The built-in `role` behavior will give the best native experience.
The `label` and `accelerator` are optional when using a `role` and will default
to appropriate values for each platform.
The `role` property can have following values:
* `undo`
* `redo`
* `cut`
* `copy`
* `paste`
* `pasteandmatchstyle`
* `selectall`
* `delete`
* `minimize` - Minimize current window
* `close` - Close current window
* `quit`- Quit the application
* `reload` - Reload the current window
* `toggledevtools` - Toggle developer tools in the current window
* `togglefullscreen`- Toggle full screen mode on the current window
* `resetzoom` - Reset the focused page's zoom level to the original size
* `zoomin` - Zoom in the focused page by 10%
* `zoomout` - Zoom out the focused page by 10%
On macOS `role` can also have following additional values:
* `about` - Map to the `orderFrontStandardAboutPanel` action
* `hide` - Map to the `hide` action
* `hideothers` - Map to the `hideOtherApplications` action
* `unhide` - Map to the `unhideAllApplications` action
* `startspeaking` - Map to the `startSpeaking` action
* `stopspeaking` - Map to the `stopSpeaking` action
* `front` - Map to the `arrangeInFront` action
* `zoom` - Map to the `performZoom` action
* `window` - The submenu is a "Window" menu
* `help` - The submenu is a "Help" menu
* `services` - The submenu is a "Services" menu
When specifying `role` on macOS, `label` and `accelerator` are the only options
that will affect the MenuItem. All other options will be ignored.
### Instance Properties
The following properties are available on instances of `MenuItem`:
#### `menuItem.enabled`
A Boolean indicating whether the item is enabled, this property can be
dynamically changed.
#### `menuItem.visible`
A Boolean indicating whether the item is visible, this property can be
dynamically changed.
#### `menuItem.checked`
A Boolean indicating whether the item is checked, this property can be
dynamically changed.
A `checkbox` menu item will toggle the `checked` property on and off when
selected.
A `radio` menu item will turn on its `checked` property when clicked, and
will turn off that property for all adjacent items in the same menu.
You can add a `click` function for additional behavior.
#### `menuItem.label`
A String representing the menu items visible label
#### `menuItem.click`
A Function that is fired when the MenuItem recieves a click event

View file

@ -1,403 +0,0 @@
## Class: Menu
> Create native application menus and context menus.
Process: [Main](../glossary.md#main-process)
### `new Menu()`
Creates a new menu.
### Static Methods
The `menu` class has the following static methods:
#### `Menu.setApplicationMenu(menu)`
* `menu` Menu
Sets `menu` as the application menu on macOS. On Windows and Linux, the `menu`
will be set as each window's top menu.
**Note:** This API has to be called after the `ready` event of `app` module.
#### `Menu.getApplicationMenu()`
Returns `Menu` - The application menu, if set, or `null`, if not set.
#### `Menu.sendActionToFirstResponder(action)` _macOS_
* `action` String
Sends the `action` to the first responder of application. This is used for
emulating default Cocoa menu behaviors, usually you would just use the
`role` property of `MenuItem`.
See the [macOS Cocoa Event Handling Guide](https://developer.apple.com/library/mac/documentation/Cocoa/Conceptual/EventOverview/EventArchitecture/EventArchitecture.html#//apple_ref/doc/uid/10000060i-CH3-SW7)
for more information on macOS' native actions.
#### `Menu.buildFromTemplate(template)`
* `template` MenuItemConstructorOptions[]
Returns `Menu`
Generally, the `template` is just an array of `options` for constructing a
[MenuItem](menu-item.md). The usage can be referenced above.
You can also attach other fields to the element of the `template` and they
will become properties of the constructed menu items.
### Instance Methods
The `menu` object has the following instance methods:
#### `menu.popup([browserWindow, x, y, positioningItem])`
* `browserWindow` BrowserWindow (optional) - Default is `BrowserWindow.getFocusedWindow()`.
* `x` Number (optional) - Default is the current mouse cursor position.
* `y` Number (**required** if `x` is used) - Default is the current mouse cursor position.
* `positioningItem` Number (optional) _macOS_ - The index of the menu item to
be positioned under the mouse cursor at the specified coordinates. Default is
-1.
Pops up this menu as a context menu in the `browserWindow`.
#### `menu.append(menuItem)`
* `menuItem` MenuItem
Appends the `menuItem` to the menu.
#### `menu.insert(pos, menuItem)`
* `pos` Integer
* `menuItem` MenuItem
Inserts the `menuItem` to the `pos` position of the menu.
### Instance Properties
`menu` objects also have the following properties:
#### `menu.items`
A MenuItem[] array containing the menu's items.
Each `Menu` consists of multiple [`MenuItem`](menu-item.md)s and each `MenuItem`
can have a submenu.
## Examples
The `Menu` class is only available in the main process, but you can also use it
in the render process via the [`remote`](remote.md) module.
### Main process
An example of creating the application menu in the main process with the
simple template API:
```javascript
const {app, Menu} = require('electron')
const template = [
{
label: 'Edit',
submenu: [
{
role: 'undo'
},
{
role: 'redo'
},
{
type: 'separator'
},
{
role: 'cut'
},
{
role: 'copy'
},
{
role: 'paste'
},
{
role: 'pasteandmatchstyle'
},
{
role: 'delete'
},
{
role: 'selectall'
}
]
},
{
label: 'View',
submenu: [
{
role: 'reload'
},
{
role: 'toggledevtools'
},
{
type: 'separator'
},
{
role: 'resetzoom'
},
{
role: 'zoomin'
},
{
role: 'zoomout'
},
{
type: 'separator'
},
{
role: 'togglefullscreen'
}
]
},
{
role: 'window',
submenu: [
{
role: 'minimize'
},
{
role: 'close'
}
]
},
{
role: 'help',
submenu: [
{
label: 'Learn More',
click () { require('electron').shell.openExternal('http://electron.atom.io') }
}
]
}
]
if (process.platform === 'darwin') {
template.unshift({
label: app.getName(),
submenu: [
{
role: 'about'
},
{
type: 'separator'
},
{
role: 'services',
submenu: []
},
{
type: 'separator'
},
{
role: 'hide'
},
{
role: 'hideothers'
},
{
role: 'unhide'
},
{
type: 'separator'
},
{
role: 'quit'
}
]
})
// Edit menu.
template[1].submenu.push(
{
type: 'separator'
},
{
label: 'Speech',
submenu: [
{
role: 'startspeaking'
},
{
role: 'stopspeaking'
}
]
}
)
// Window menu.
template[3].submenu = [
{
label: 'Close',
accelerator: 'CmdOrCtrl+W',
role: 'close'
},
{
label: 'Minimize',
accelerator: 'CmdOrCtrl+M',
role: 'minimize'
},
{
label: 'Zoom',
role: 'zoom'
},
{
type: 'separator'
},
{
label: 'Bring All to Front',
role: 'front'
}
]
}
const menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu)
```
### Render process
Below is an example of creating a menu dynamically in a web page
(render process) by using the [`remote`](remote.md) module, and showing it when
the user right clicks the page:
```html
<!-- index.html -->
<script>
const {remote} = require('electron')
const {Menu, MenuItem} = remote
const menu = new Menu()
menu.append(new MenuItem({label: 'MenuItem1', click() { console.log('item 1 clicked') }}))
menu.append(new MenuItem({type: 'separator'}))
menu.append(new MenuItem({label: 'MenuItem2', type: 'checkbox', checked: true}))
window.addEventListener('contextmenu', (e) => {
e.preventDefault()
menu.popup(remote.getCurrentWindow())
}, false)
</script>
```
## Notes on macOS Application Menu
macOS has a completely different style of application menu from Windows and
Linux. Here are some notes on making your app's menu more native-like.
### Standard Menus
On macOS there are many system-defined standard menus, like the `Services` and
`Windows` menus. To make your menu a standard menu, you should set your menu's
`role` to one of following and Electron will recognize them and make them
become standard menus:
* `window`
* `help`
* `services`
### Standard Menu Item Actions
macOS has provided standard actions for some menu items, like `About xxx`,
`Hide xxx`, and `Hide Others`. To set the action of a menu item to a standard
action, you should set the `role` attribute of the menu item.
### Main Menu's Name
On macOS the label of the application menu's first item is always your app's
name, no matter what label you set. To change it, modify your app bundle's
`Info.plist` file. See
[About Information Property List Files][AboutInformationPropertyListFiles]
for more information.
## Setting Menu for Specific Browser Window (*Linux* *Windows*)
The [`setMenu` method][setMenu] of browser windows can set the menu of certain
browser windows.
## Menu Item Position
You can make use of `position` and `id` to control how the item will be placed
when building a menu with `Menu.buildFromTemplate`.
The `position` attribute of `MenuItem` has the form `[placement]=[id]`, where
`placement` is one of `before`, `after`, or `endof` and `id` is the unique ID of
an existing item in the menu:
* `before` - Inserts this item before the id referenced item. If the
referenced item doesn't exist the item will be inserted at the end of
the menu.
* `after` - Inserts this item after id referenced item. If the referenced
item doesn't exist the item will be inserted at the end of the menu.
* `endof` - Inserts this item at the end of the logical group containing
the id referenced item (groups are created by separator items). If
the referenced item doesn't exist, a new separator group is created with
the given id and this item is inserted after that separator.
When an item is positioned, all un-positioned items are inserted after
it until a new item is positioned. So if you want to position a group of
menu items in the same location you only need to specify a position for
the first item.
### Examples
Template:
```javascript
[
{label: '4', id: '4'},
{label: '5', id: '5'},
{label: '1', id: '1', position: 'before=4'},
{label: '2', id: '2'},
{label: '3', id: '3'}
]
```
Menu:
```
- 1
- 2
- 3
- 4
- 5
```
Template:
```javascript
[
{label: 'a', position: 'endof=letters'},
{label: '1', position: 'endof=numbers'},
{label: 'b', position: 'endof=letters'},
{label: '2', position: 'endof=numbers'},
{label: 'c', position: 'endof=letters'},
{label: '3', position: 'endof=numbers'}
]
```
Menu:
```
- ---
- a
- b
- c
- ---
- 1
- 2
- 3
```
[AboutInformationPropertyListFiles]: https://developer.apple.com/library/ios/documentation/general/Reference/InfoPlistKeyReference/Articles/AboutInformationPropertyListFiles.html
[setMenu]: https://github.com/electron/electron/blob/master/docs/api/browser-window.md#winsetmenumenu-linux-windows

View file

@ -1,256 +0,0 @@
# nativeImage
> Create tray, dock, and application icons using PNG or JPG files.
Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer-process)
In Electron, for the APIs that take images, you can pass either file paths or
`NativeImage` instances. An empty image will be used when `null` is passed.
For example, when creating a tray or setting a window's icon, you can pass an
image file path as a `String`:
```javascript
const {BrowserWindow, Tray} = require('electron')
const appIcon = new Tray('/Users/somebody/images/icon.png')
let win = new BrowserWindow({icon: '/Users/somebody/images/window.png'})
console.log(appIcon, win)
```
Or read the image from the clipboard which returns a `NativeImage`:
```javascript
const {clipboard, Tray} = require('electron')
const image = clipboard.readImage()
const appIcon = new Tray(image)
console.log(appIcon)
```
## Supported Formats
Currently `PNG` and `JPEG` image formats are supported. `PNG` is recommended
because of its support for transparency and lossless compression.
On Windows, you can also load `ICO` icons from file paths. For best visual
quality it is recommended to include at least the following sizes in the:
* Small icon
* 16x16 (100% DPI scale)
* 20x20 (125% DPI scale)
* 24x24 (150% DPI scale)
* 32x32 (200% DPI scale)
* Large icon
* 32x32 (100% DPI scale)
* 40x40 (125% DPI scale)
* 48x48 (150% DPI scale)
* 64x64 (200% DPI scale)
* 256x256
Check the *Size requirements* section in [this article][icons].
[icons]:https://msdn.microsoft.com/en-us/library/windows/desktop/dn742485(v=vs.85).aspx
## High Resolution Image
On platforms that have high-DPI support such as Apple Retina displays, you can
append `@2x` after image's base filename to mark it as a high resolution image.
For example if `icon.png` is a normal image that has standard resolution, then
`icon@2x.png` will be treated as a high resolution image that has double DPI
density.
If you want to support displays with different DPI densities at the same time,
you can put images with different sizes in the same folder and use the filename
without DPI suffixes. For example:
```text
images/
├── icon.png
├── icon@2x.png
└── icon@3x.png
```
```javascript
const {Tray} = require('electron')
let appIcon = new Tray('/Users/somebody/images/icon.png')
console.log(appIcon)
```
Following suffixes for DPI are also supported:
* `@1x`
* `@1.25x`
* `@1.33x`
* `@1.4x`
* `@1.5x`
* `@1.8x`
* `@2x`
* `@2.5x`
* `@3x`
* `@4x`
* `@5x`
## Template Image
Template images consist of black and clear colors (and an alpha channel).
Template images are not intended to be used as standalone images and are usually
mixed with other content to create the desired final appearance.
The most common case is to use template images for a menu bar icon so it can
adapt to both light and dark menu bars.
**Note:** Template image is only supported on macOS.
To mark an image as a template image, its filename should end with the word
`Template`. For example:
* `xxxTemplate.png`
* `xxxTemplate@2x.png`
## Methods
The `nativeImage` module has the following methods, all of which return
an instance of the `NativeImage` class:
### `nativeImage.createEmpty()`
Returns `NativeImage`
Creates an empty `NativeImage` instance.
### `nativeImage.createFromPath(path)`
* `path` String
Returns `NativeImage`
Creates a new `NativeImage` instance from a file located at `path`. This method
returns an empty image if the `path` does not exist, cannot be read, or is not
a valid image.
```javascript
const nativeImage = require('electron').nativeImage
let image = nativeImage.createFromPath('/Users/somebody/images/icon.png')
console.log(image)
```
### `nativeImage.createFromBuffer(buffer[, options])`
* `buffer` [Buffer][buffer]
* `options` Object (optional)
* `width` Integer (optional) - Required for bitmap buffers.
* `height` Integer (optional) - Required for bitmap buffers.
* `scaleFactor` Double (optional) - Defaults to 1.0.
Returns `NativeImage`
Creates a new `NativeImage` instance from `buffer`.
### `nativeImage.createFromDataURL(dataURL)`
* `dataURL` String
Creates a new `NativeImage` instance from `dataURL`.
## Class: NativeImage
> Natively wrap images such as tray, dock, and application icons.
Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer-process)
### Instance Methods
The following methods are available on instances of the `NativeImage` class:
#### `image.toPNG()`
Returns `Buffer` - A [Buffer][buffer] that contains the image's `PNG` encoded data.
#### `image.toJPEG(quality)`
* `quality` Integer (**required**) - Between 0 - 100.
Returns `Buffer` - A [Buffer][buffer] that contains the image's `JPEG` encoded data.
#### `image.toBitmap()`
Returns `Buffer` - A [Buffer][buffer] that contains a copy of the image's raw bitmap pixel
data.
#### `image.toDataURL()`
Returns `String` - The data URL of the image.
#### `image.getBitmap()`
Returns `Buffer` - A [Buffer][buffer] that contains the image's raw bitmap pixel data.
The difference between `getBitmap()` and `toBitmap()` is, `getBitmap()` does not
copy the bitmap data, so you have to use the returned Buffer immediately in
current event loop tick, otherwise the data might be changed or destroyed.
#### `image.getNativeHandle()` _macOS_
Returns `Buffer` - A [Buffer][buffer] that stores C pointer to underlying native handle of
the image. On macOS, a pointer to `NSImage` instance would be returned.
Notice that the returned pointer is a weak pointer to the underlying native
image instead of a copy, so you _must_ ensure that the associated
`nativeImage` instance is kept around.
#### `image.isEmpty()`
Returns `Boolean` - Whether the image is empty.
#### `image.getSize()`
Returns `Object`:
* `width` Integer
* `height` Integer
#### `image.setTemplateImage(option)`
* `option` Boolean
Marks the image as a template image.
#### `image.isTemplateImage()`
Returns `Boolean` - Whether the image is a template image.
#### `image.crop(rect)`
* `rect` Object - The area of the image to crop
* `x` Integer
* `y` Integer
* `width` Integer
* `height` Integer
Returns `NativeImage` - The cropped image.
#### `image.resize(options)`
* `options` Object
* `width` Integer (optional)
* `height` Integer (optional)
* `quality` String (optional) - The desired quality of the resize image.
Possible values are `good`, `better` or `best`. The default is `best`.
These values express a desired quality/speed tradeoff. They are translated
into an algorithm-specific method that depends on the capabilities
(CPU, GPU) of the underlying platform. It is possible for all three methods
to be mapped to the same algorithm on a given platform.
Returns `NativeImage` - The resized image.
If only the `height` or the `width` are specified then the current aspect ratio
will be preserved in the resized image.
#### `image.getAspectRatio()`
Returns `Float` - The image's aspect ratio.
[buffer]: https://nodejs.org/api/buffer.html#buffer_class_buffer

View file

@ -1,71 +0,0 @@
# net
> Issue HTTP/HTTPS requests using Chromium's native networking library
Process: [Main](../glossary.md#main-process)
The `net` module is a client-side API for issuing HTTP(S) requests. It is
similar to the [HTTP](https://nodejs.org/api/http.html) and
[HTTPS](https://nodejs.org/api/https.html) modules of Node.js but uses
Chromium's native networking library instead of the Node.js implementation,
offering better support for web proxies.
The following is a non-exhaustive list of why you may consider using the `net`
module instead of the native Node.js modules:
* Automatic management of system proxy configuration, support of the wpad
protocol and proxy pac configuration files.
* Automatic tunneling of HTTPS requests.
* Support for authenticating proxies using basic, digest, NTLM, Kerberos or
negotiate authentication schemes.
* Support for traffic monitoring proxies: Fiddler-like proxies used for access
control and monitoring.
The `net` module API has been specifically designed to mimic, as closely as
possible, the familiar Node.js API. The API components including classes,
methods, properties and event names are similar to those commonly used in
Node.js.
For instance, the following example quickly shows how the `net` API might be
used:
```javascript
const {app} = require('electron')
app.on('ready', () => {
const {net} = require('electron')
const request = net.request('https://github.com')
request.on('response', (response) => {
console.log(`STATUS: ${response.statusCode}`)
console.log(`HEADERS: ${JSON.stringify(response.headers)}`)
response.on('data', (chunk) => {
console.log(`BODY: ${chunk}`)
})
response.on('end', () => {
console.log('No more data in response.')
})
})
request.end()
})
```
By the way, it is almost identical to how you would normally use the
[HTTP](https://nodejs.org/api/http.html)/[HTTPS](https://nodejs.org/api/https.html)
modules of Node.js
The `net` API can be used only after the application emits the `ready` event.
Trying to use the module before the `ready` event will throw an error.
## Methods
The `net` module has the following methods:
### `net.request(options)`
* `options` (Object | String) - The `ClientRequest` constructor options.
Returns [`ClientRequest`](./client-request.md)
Creates a [`ClientRequest`](./client-request.md) instance using the provided
`options` which are directly forwarded to the `ClientRequest` constructor.
The `net.request` method would be used to issue both secure and insecure HTTP
requests according to the specified protocol scheme in the `options` object.

View file

@ -1,41 +0,0 @@
# powerMonitor
> Monitor power state changes.
Process: [Main](../glossary.md#main-process)
You cannot require or use this module until the `ready` event of the `app`
module is emitted.
For example:
```javascript
const electron = require('electron')
const {app} = electron
app.on('ready', () => {
electron.powerMonitor.on('suspend', () => {
console.log('The system is going to sleep')
})
})
```
## Events
The `powerMonitor` module emits the following events:
### Event: 'suspend'
Emitted when the system is suspending.
### Event: 'resume'
Emitted when system is resuming.
### Event: 'on-ac' _Windows_
Emitted when the system changes to AC power.
### Event: 'on-battery' _Windows_
Emitted when system changes to battery power.

View file

@ -1,56 +0,0 @@
# powerSaveBlocker
> Block the system from entering low-power (sleep) mode.
Process: [Main](../glossary.md#main-process)
For example:
```javascript
const {powerSaveBlocker} = require('electron')
const id = powerSaveBlocker.start('prevent-display-sleep')
console.log(powerSaveBlocker.isStarted(id))
powerSaveBlocker.stop(id)
```
## Methods
The `powerSaveBlocker` module has the following methods:
### `powerSaveBlocker.start(type)`
* `type` String - Power save blocker type.
* `prevent-app-suspension` - Prevent the application from being suspended.
Keeps system active but allows screen to be turned off. Example use cases:
downloading a file or playing audio.
* `prevent-display-sleep` - Prevent the display from going to sleep. Keeps
system and screen active. Example use case: playing video.
Returns `Integer` - The blocker ID that is assigned to this power blocker
Starts preventing the system from entering lower-power mode. Returns an integer
identifying the power save blocker.
**Note:** `prevent-display-sleep` has higher precedence over
`prevent-app-suspension`. Only the highest precedence type takes effect. In
other words, `prevent-display-sleep` always takes precedence over
`prevent-app-suspension`.
For example, an API calling A requests for `prevent-app-suspension`, and
another calling B requests for `prevent-display-sleep`. `prevent-display-sleep`
will be used until B stops its request. After that, `prevent-app-suspension`
is used.
### `powerSaveBlocker.stop(id)`
* `id` Integer - The power save blocker id returned by `powerSaveBlocker.start`.
Stops the specified power save blocker.
### `powerSaveBlocker.isStarted(id)`
* `id` Integer - The power save blocker id returned by `powerSaveBlocker.start`.
Returns `Boolean` - Whether the corresponding `powerSaveBlocker` has started.

View file

@ -1,118 +0,0 @@
# process
> Extensions to process object.
Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer-process)
Electron's `process` object is extended from the
[Node.js `process` object](https://nodejs.org/api/process.html).
It adds the following events, properties, and methods:
## Events
### Event: 'loaded'
Emitted when Electron has loaded its internal initialization script and is
beginning to load the web page or the main script.
It can be used by the preload script to add removed Node global symbols back to
the global scope when node integration is turned off:
```javascript
// preload.js
const _setImmediate = setImmediate
const _clearImmediate = clearImmediate
process.once('loaded', () => {
global.setImmediate = _setImmediate
global.clearImmediate = _clearImmediate
})
```
## Properties
### `process.noAsar`
Setting this to `true` can disable the support for `asar` archives in Node's
built-in modules.
### `process.type`
Current process's type, can be `"browser"` (i.e. main process) or `"renderer"`.
### `process.versions.electron`
Electron's version string.
### `process.versions.chrome`
Chrome's version string.
### `process.resourcesPath`
Path to the resources directory.
### `process.mas`
For Mac App Store build, this property is `true`, for other builds it is
`undefined`.
### `process.windowsStore`
If the app is running as a Windows Store app (appx), this property is `true`,
for otherwise it is `undefined`.
### `process.defaultApp`
When app is started by being passed as parameter to the default app, this
property is `true` in the main process, otherwise it is `undefined`.
## Methods
The `process` object has the following method:
### `process.crash()`
Causes the main thread of the current process crash.
### `process.hang()`
Causes the main thread of the current process hang.
### `process.setFdLimit(maxDescriptors)` _macOS_ _Linux_
* `maxDescriptors` Integer
Sets the file descriptor soft limit to `maxDescriptors` or the OS hard
limit, whichever is lower for the current process.
### `process.getProcessMemoryInfo()`
Returns `Object`:
* `workingSetSize` Integer - The amount of memory currently pinned to actual physical
RAM.
* `peakWorkingSetSize` Integer - The maximum amount of memory that has ever been pinned
to actual physical RAM.
* `privateBytes` Integer - The amount of memory not shared by other processes, such as
JS heap or HTML content.
* `sharedBytes` Integer - The amount of memory shared between processes, typically
memory consumed by the Electron code itself
Returns an object giving memory usage statistics about the current process. Note
that all statistics are reported in Kilobytes.
### `process.getSystemMemoryInfo()`
Returns `Object`:
* `total` Integer - The total amount of physical memory in Kilobytes available to the
system.
* `free` Integer - The total amount of memory not being used by applications or disk
cache.
* `swapTotal` Integer - The total amount of swap memory in Kilobytes available to the
system. _Windows_ _Linux_
* `swapFree` Integer - The free amount of swap memory in Kilobytes available to the
system. _Windows_ _Linux_
Returns an object giving memory usage statistics about the entire system. Note
that all statistics are reported in Kilobytes.

View file

@ -1,297 +0,0 @@
# protocol
> Register a custom protocol and intercept existing protocol requests.
Process: [Main](../glossary.md#main-process)
An example of implementing a protocol that has the same effect as the
`file://` protocol:
```javascript
const {app, protocol} = require('electron')
const path = require('path')
app.on('ready', () => {
protocol.registerFileProtocol('atom', (request, callback) => {
const url = request.url.substr(7)
callback({path: path.normalize(`${__dirname}/${url}`)})
}, (error) => {
if (error) console.error('Failed to register protocol')
})
})
```
**Note:** All methods unless specified can only be used after the `ready` event
of the `app` module gets emitted.
## Methods
The `protocol` module has the following methods:
### `protocol.registerStandardSchemes(schemes[, options])`
* `schemes` String[] - Custom schemes to be registered as standard schemes.
* `options` Object (optional)
* `secure` Boolean (optional) - `true` to register the scheme as secure.
Default `false`.
A standard scheme adheres to what RFC 3986 calls [generic URI
syntax](https://tools.ietf.org/html/rfc3986#section-3). For example `http` and
`https` are standard schemes, while `file` is not.
Registering a scheme as standard, will allow relative and absolute resources to
be resolved correctly when served. Otherwise the scheme will behave like the
`file` protocol, but without the ability to resolve relative URLs.
For example when you load following page with custom protocol without
registering it as standard scheme, the image will not be loaded because
non-standard schemes can not recognize relative URLs:
```html
<body>
<img src='test.png'>
</body>
```
Registering a scheme as standard will allow access to files through the
[FileSystem API][file-system-api]. Otherwise the renderer will throw a security
error for the scheme.
By default web storage apis (localStorage, sessionStorage, webSQL, indexedDB, cookies)
are disabled for non standard schemes. So in general if you want to register a
custom protocol to replace the `http` protocol, you have to register it as a standard scheme:
```javascript
const {app, protocol} = require('electron')
protocol.registerStandardSchemes(['atom'])
app.on('ready', () => {
protocol.registerHttpProtocol('atom', '...')
})
```
**Note:** This method can only be used before the `ready` event of the `app`
module gets emitted.
### `protocol.registerServiceWorkerSchemes(schemes)`
* `schemes` String[] - Custom schemes to be registered to handle service workers.
### `protocol.registerFileProtocol(scheme, handler[, completion])`
* `scheme` String
* `handler` Function
* `request` Object
* `url` String
* `referrer` String
* `method` String
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `filePath` String (optional)
* `completion` Function (optional)
* `error` Error
Registers a protocol of `scheme` that will send the file as a response. The
`handler` will be called with `handler(request, callback)` when a `request` is
going to be created with `scheme`. `completion` will be called with
`completion(null)` when `scheme` is successfully registered or
`completion(error)` when failed.
To handle the `request`, the `callback` should be called with either the file's
path or an object that has a `path` property, e.g. `callback(filePath)` or
`callback({path: filePath})`.
When `callback` is called with nothing, a number, or an object that has an
`error` property, the `request` will fail with the `error` number you
specified. For the available error numbers you can use, please see the
[net error list][net-error].
By default the `scheme` is treated like `http:`, which is parsed differently
than protocols that follow the "generic URI syntax" like `file:`, so you
probably want to call `protocol.registerStandardSchemes` to have your scheme
treated as a standard scheme.
### `protocol.registerBufferProtocol(scheme, handler[, completion])`
* `scheme` String
* `handler` Function
* `request` Object
* `url` String
* `referrer` String
* `method` String
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `buffer` (Buffer | [MimeTypedBuffer](structures/mime-typed-buffer.md)) (optional)
* `completion` Function (optional)
* `error` Error
Registers a protocol of `scheme` that will send a `Buffer` as a response.
The usage is the same with `registerFileProtocol`, except that the `callback`
should be called with either a `Buffer` object or an object that has the `data`,
`mimeType`, and `charset` properties.
Example:
```javascript
const {protocol} = require('electron')
protocol.registerBufferProtocol('atom', (request, callback) => {
callback({mimeType: 'text/html', data: new Buffer('<h5>Response</h5>')})
}, (error) => {
if (error) console.error('Failed to register protocol')
})
```
### `protocol.registerStringProtocol(scheme, handler[, completion])`
* `scheme` String
* `handler` Function
* `request` Object
* `url` String
* `referrer` String
* `method` String
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `data` String (optional)
* `completion` Function (optional)
* `error` Error
Registers a protocol of `scheme` that will send a `String` as a response.
The usage is the same with `registerFileProtocol`, except that the `callback`
should be called with either a `String` or an object that has the `data`,
`mimeType`, and `charset` properties.
### `protocol.registerHttpProtocol(scheme, handler[, completion])`
* `scheme` String
* `handler` Function
* `request` Object
* `url` String
* `referrer` String
* `method` String
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `redirectRequest` Object
* `url` String
* `method` String
* `session` Object (optional)
* `uploadData` Object (optional)
* `contentType` String - MIME type of the content.
* `data` String - Content to be sent.
* `completion` Function (optional)
* `error` Error
Registers a protocol of `scheme` that will send an HTTP request as a response.
The usage is the same with `registerFileProtocol`, except that the `callback`
should be called with a `redirectRequest` object that has the `url`, `method`,
`referrer`, `uploadData` and `session` properties.
By default the HTTP request will reuse the current session. If you want the
request to have a different session you should set `session` to `null`.
For POST requests the `uploadData` object must be provided.
### `protocol.unregisterProtocol(scheme[, completion])`
* `scheme` String
* `completion` Function (optional)
* `error` Error
Unregisters the custom protocol of `scheme`.
### `protocol.isProtocolHandled(scheme, callback)`
* `scheme` String
* `callback` Function
* `error` Error
The `callback` will be called with a boolean that indicates whether there is
already a handler for `scheme`.
### `protocol.interceptFileProtocol(scheme, handler[, completion])`
* `scheme` String
* `handler` Function
* `request` Object
* `url` String
* `referrer` String
* `method` String
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `filePath` String
* `completion` Function (optional)
* `error` Error
Intercepts `scheme` protocol and uses `handler` as the protocol's new handler
which sends a file as a response.
### `protocol.interceptStringProtocol(scheme, handler[, completion])`
* `scheme` String
* `handler` Function
* `request` Object
* `url` String
* `referrer` String
* `method` String
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `data` String (optional)
* `completion` Function (optional)
* `error` Error
Intercepts `scheme` protocol and uses `handler` as the protocol's new handler
which sends a `String` as a response.
### `protocol.interceptBufferProtocol(scheme, handler[, completion])`
* `scheme` String
* `handler` Function
* `request` Object
* `url` String
* `referrer` String
* `method` String
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `buffer` Buffer (optional)
* `completion` Function (optional)
* `error` Error
Intercepts `scheme` protocol and uses `handler` as the protocol's new handler
which sends a `Buffer` as a response.
### `protocol.interceptHttpProtocol(scheme, handler[, completion])`
* `scheme` String
* `handler` Function
* `request` Object
* `url` String
* `referrer` String
* `method` String
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `redirectRequest` Object
* `url` String
* `method` String
* `session` Object (optional)
* `uploadData` Object (optional)
* `contentType` String - MIME type of the content.
* `data` String - Content to be sent.
* `completion` Function (optional)
* `error` Error
Intercepts `scheme` protocol and uses `handler` as the protocol's new handler
which sends a new HTTP request as a response.
### `protocol.uninterceptProtocol(scheme[, completion])`
* `scheme` String
* `completion` Function (optional)
* `error` Error
Remove the interceptor installed for `scheme` and restore its original handler.
[net-error]: https://code.google.com/p/chromium/codesearch#chromium/src/net/base/net_error_list.h
[file-system-api]: https://developer.mozilla.org/en-US/docs/Web/API/LocalFileSystem

View file

@ -1,169 +0,0 @@
# remote
> Use main process modules from the renderer process.
Process: [Renderer](../glossary.md#renderer-process)
The `remote` module provides a simple way to do inter-process communication
(IPC) between the renderer process (web page) and the main process.
In Electron, GUI-related modules (such as `dialog`, `menu` etc.) are only
available in the main process, not in the renderer process. In order to use them
from the renderer process, the `ipc` module is necessary to send inter-process
messages to the main process. With the `remote` module, you can invoke methods
of the main process object without explicitly sending inter-process messages,
similar to Java's [RMI][rmi]. An example of creating a browser window from a
renderer process:
```javascript
const {BrowserWindow} = require('electron').remote
let win = new BrowserWindow({width: 800, height: 600})
win.loadURL('https://github.com')
```
**Note:** For the reverse (access the renderer process from the main process),
you can use [webContents.executeJavascript](web-contents.md#contentsexecutejavascriptcode-usergesture-callback).
## Remote Objects
Each object (including functions) returned by the `remote` module represents an
object in the main process (we call it a remote object or remote function).
When you invoke methods of a remote object, call a remote function, or create
a new object with the remote constructor (function), you are actually sending
synchronous inter-process messages.
In the example above, both `BrowserWindow` and `win` were remote objects and
`new BrowserWindow` didn't create a `BrowserWindow` object in the renderer
process. Instead, it created a `BrowserWindow` object in the main process and
returned the corresponding remote object in the renderer process, namely the
`win` object.
**Note:** Only [enumerable properties][enumerable-properties] which are present
when the remote object is first referenced are accessible via remote.
**Note:** Arrays and Buffers are copied over IPC when accessed via the `remote`
module. Modifying them in the renderer process does not modify them in the main
process and vice versa.
## Lifetime of Remote Objects
Electron makes sure that as long as the remote object in the renderer process
lives (in other words, has not been garbage collected), the corresponding object
in the main process will not be released. When the remote object has been
garbage collected, the corresponding object in the main process will be
dereferenced.
If the remote object is leaked in the renderer process (e.g. stored in a map but
never freed), the corresponding object in the main process will also be leaked,
so you should be very careful not to leak remote objects.
Primary value types like strings and numbers, however, are sent by copy.
## Passing callbacks to the main process
Code in the main process can accept callbacks from the renderer - for instance
the `remote` module - but you should be extremely careful when using this
feature.
First, in order to avoid deadlocks, the callbacks passed to the main process
are called asynchronously. You should not expect the main process to
get the return value of the passed callbacks.
For instance you can't use a function from the renderer process in an
`Array.map` called in the main process:
```javascript
// main process mapNumbers.js
exports.withRendererCallback = (mapper) => {
return [1, 2, 3].map(mapper)
}
exports.withLocalCallback = () => {
return [1, 2, 3].map(x => x + 1)
}
```
```javascript
// renderer process
const mapNumbers = require('electron').remote.require('./mapNumbers')
const withRendererCb = mapNumbers.withRendererCallback(x => x + 1)
const withLocalCb = mapNumbers.withLocalCallback()
console.log(withRendererCb, withLocalCb)
// [undefined, undefined, undefined], [2, 3, 4]
```
As you can see, the renderer callback's synchronous return value was not as
expected, and didn't match the return value of an identical callback that lives
in the main process.
Second, the callbacks passed to the main process will persist until the
main process garbage-collects them.
For example, the following code seems innocent at first glance. It installs a
callback for the `close` event on a remote object:
```javascript
require('electron').remote.getCurrentWindow().on('close', () => {
// window was closed...
})
```
But remember the callback is referenced by the main process until you
explicitly uninstall it. If you do not, each time you reload your window the
callback will be installed again, leaking one callback for each restart.
To make things worse, since the context of previously installed callbacks has
been released, exceptions will be raised in the main process when the `close`
event is emitted.
To avoid this problem, ensure you clean up any references to renderer callbacks
passed to the main process. This involves cleaning up event handlers, or
ensuring the main process is explicitly told to deference callbacks that came
from a renderer process that is exiting.
## Accessing built-in modules in the main process
The built-in modules in the main process are added as getters in the `remote`
module, so you can use them directly like the `electron` module.
```javascript
const app = require('electron').remote.app
console.log(app)
```
## Methods
The `remote` module has the following methods:
### `remote.require(module)`
* `module` String
Returns `any` - The object returned by `require(module)` in the main process.
### `remote.getCurrentWindow()`
Returns [`BrowserWindow`](browser-window.md) - The window to which this web page
belongs.
### `remote.getCurrentWebContents()`
Returns [`WebContents`](web-contents.md) - The web contents of this web page.
### `remote.getGlobal(name)`
* `name` String
Returns `any` - The global variable of `name` (e.g. `global[name]`) in the main
process.
## Properties
### `remote.process`
The `process` object in the main process. This is the same as
`remote.getGlobal('process')` but is cached.
[rmi]: http://en.wikipedia.org/wiki/Java_remote_method_invocation
[enumerable-properties]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties

View file

@ -1,122 +0,0 @@
# screen
> Retrieve information about screen size, displays, cursor position, etc.
Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer-process)
You cannot require or use this module until the `ready` event of the `app`
module is emitted.
`screen` is an [EventEmitter](https://nodejs.org/api/events.html#events_class_eventemitter).
**Note:** In the renderer / DevTools, `window.screen` is a reserved DOM
property, so writing `let {screen} = require('electron')` will not work.
An example of creating a window that fills the whole screen:
```javascript
const electron = require('electron')
const {app, BrowserWindow} = electron
let win
app.on('ready', () => {
const {width, height} = electron.screen.getPrimaryDisplay().workAreaSize
win = new BrowserWindow({width, height})
win.loadURL('https://github.com')
})
```
Another example of creating a window in the external display:
```javascript
const electron = require('electron')
const {app, BrowserWindow} = require('electron')
let win
app.on('ready', () => {
let displays = electron.screen.getAllDisplays()
let externalDisplay = displays.find((display) => {
return display.bounds.x !== 0 || display.bounds.y !== 0
})
if (externalDisplay) {
win = new BrowserWindow({
x: externalDisplay.bounds.x + 50,
y: externalDisplay.bounds.y + 50
})
win.loadURL('https://github.com')
}
})
```
## Events
The `screen` module emits the following events:
### Event: 'display-added'
Returns:
* `event` Event
* `newDisplay` [Display](structures/display.md)
Emitted when `newDisplay` has been added.
### Event: 'display-removed'
Returns:
* `event` Event
* `oldDisplay` [Display](structures/display.md)
Emitted when `oldDisplay` has been removed.
### Event: 'display-metrics-changed'
Returns:
* `event` Event
* `display` [Display](structures/display.md)
* `changedMetrics` String[]
Emitted when one or more metrics change in a `display`. The `changedMetrics` is
an array of strings that describe the changes. Possible changes are `bounds`,
`workArea`, `scaleFactor` and `rotation`.
## Methods
The `screen` module has the following methods:
### `screen.getCursorScreenPoint()`
Returns `Object`:
* `x` Integer
* `y` Integer
The current absolute position of the mouse pointer.
### `screen.getPrimaryDisplay()`
Returns [`Display`](structures/display.md) - The primary display.
### `screen.getAllDisplays()`
Returns [`Display[]`](structures/display.md) - An array of displays that are currently available.
### `screen.getDisplayNearestPoint(point)`
* `point` Object
* `x` Integer
* `y` Integer
Returns [`Display`](structures/display.md) - The display nearest the specified point.
### `screen.getDisplayMatching(rect)`
* `rect` [Rectangle](structures/rectangle.md)
Returns [`Display`](structures/display.md) - The display that most closely
intersects the provided bounds.

View file

@ -1,402 +0,0 @@
# session
> Manage browser sessions, cookies, cache, proxy settings, etc.
Process: [Main](../glossary.md#main-process)
The `session` module can be used to create new `Session` objects.
You can also access the `session` of existing pages by using the `session`
property of [`WebContents`](web-contents.md), or from the `session` module.
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow({width: 800, height: 600})
win.loadURL('http://github.com')
const ses = win.webContents.session
console.log(ses.getUserAgent())
```
## Methods
The `session` module has the following methods:
### `session.fromPartition(partition[, options])`
* `partition` String
* `options` Object
* `cache` Boolean - Whether to enable cache.
Returns `Session` - A session instance from `partition` string. When there is an existing
`Session` with the same `partition`, it will be returned; othewise a new
`Session` instance will be created with `options`.
If `partition` starts with `persist:`, the page will use a persistent session
available to all pages in the app with the same `partition`. if there is no
`persist:` prefix, the page will use an in-memory session. If the `partition` is
empty then default session of the app will be returned.
To create a `Session` with `options`, you have to ensure the `Session` with the
`partition` has never been used before. There is no way to change the `options`
of an existing `Session` object.
## Properties
The `session` module has the following properties:
### `session.defaultSession`
A `Session` object, the default session object of the app.
## Class: Session
> Get and set properties of a session.
Process: [Main](../glossary.md#main-process)
You can create a `Session` object in the `session` module:
```javascript
const {session} = require('electron')
const ses = session.fromPartition('persist:name')
console.log(ses.getUserAgent())
```
### Instance Events
The following events are available on instances of `Session`:
#### Event: 'will-download'
* `event` Event
* `item` [DownloadItem](download-item.md)
* `webContents` [WebContents](web-contents.md)
Emitted when Electron is about to download `item` in `webContents`.
Calling `event.preventDefault()` will cancel the download and `item` will not be
available from next tick of the process.
```javascript
const {session} = require('electron')
session.defaultSession.on('will-download', (event, item, webContents) => {
event.preventDefault()
require('request')(item.getURL(), (data) => {
require('fs').writeFileSync('/somewhere', data)
})
})
```
### Instance Methods
The following methods are available on instances of `Session`:
#### `ses.getCacheSize(callback)`
* `callback` Function
* `size` Integer - Cache size used in bytes.
Returns the session's current cache size.
#### `ses.clearCache(callback)`
* `callback` Function - Called when operation is done
Clears the sessions HTTP cache.
#### `ses.clearStorageData([options, callback])`
* `options` Object (optional)
* `origin` String - Should follow `window.location.origin`s representation
`scheme://host:port`.
* `storages` String[] - The types of storages to clear, can contain:
`appcache`, `cookies`, `filesystem`, `indexdb`, `localstorage`,
`shadercache`, `websql`, `serviceworkers`
* `quotas` String[] - The types of quotas to clear, can contain:
`temporary`, `persistent`, `syncable`.
* `callback` Function (optional) - Called when operation is done.
Clears the data of web storages.
#### `ses.flushStorageData()`
Writes any unwritten DOMStorage data to disk.
#### `ses.setProxy(config, callback)`
* `config` Object
* `pacScript` String - The URL associated with the PAC file.
* `proxyRules` String - Rules indicating which proxies to use.
* `proxyBypassRules` String - Rules indicating which URLs should
bypass the proxy settings.
* `callback` Function - Called when operation is done.
Sets the proxy settings.
When `pacScript` and `proxyRules` are provided together, the `proxyRules`
option is ignored and `pacScript` configuration is applied.
The `proxyRules` has to follow the rules below:
```
proxyRules = schemeProxies[";"<schemeProxies>]
schemeProxies = [<urlScheme>"="]<proxyURIList>
urlScheme = "http" | "https" | "ftp" | "socks"
proxyURIList = <proxyURL>[","<proxyURIList>]
proxyURL = [<proxyScheme>"://"]<proxyHost>[":"<proxyPort>]
```
For example:
* `http=foopy:80;ftp=foopy2` - Use HTTP proxy `foopy:80` for `http://` URLs, and
HTTP proxy `foopy2:80` for `ftp://` URLs.
* `foopy:80` - Use HTTP proxy `foopy:80` for all URLs.
* `foopy:80,bar,direct://` - Use HTTP proxy `foopy:80` for all URLs, failing
over to `bar` if `foopy:80` is unavailable, and after that using no proxy.
* `socks4://foopy` - Use SOCKS v4 proxy `foopy:1080` for all URLs.
* `http=foopy,socks5://bar.com` - Use HTTP proxy `foopy` for http URLs, and fail
over to the SOCKS5 proxy `bar.com` if `foopy` is unavailable.
* `http=foopy,direct://` - Use HTTP proxy `foopy` for http URLs, and use no
proxy if `foopy` is unavailable.
* `http=foopy;socks=foopy2` - Use HTTP proxy `foopy` for http URLs, and use
`socks4://foopy2` for all other URLs.
The `proxyBypassRules` is a comma separated list of rules described below:
* `[ URL_SCHEME "://" ] HOSTNAME_PATTERN [ ":" <port> ]`
Match all hostnames that match the pattern HOSTNAME_PATTERN.
Examples:
"foobar.com", "*foobar.com", "*.foobar.com", "*foobar.com:99",
"https://x.*.y.com:99"
* `"." HOSTNAME_SUFFIX_PATTERN [ ":" PORT ]`
Match a particular domain suffix.
Examples:
".google.com", ".com", "http://.google.com"
* `[ SCHEME "://" ] IP_LITERAL [ ":" PORT ]`
Match URLs which are IP address literals.
Examples:
"127.0.1", "[0:0::1]", "[::1]", "http://[::1]:99"
* `IP_LITERAL "/" PREFIX_LENGHT_IN_BITS`
Match any URL that is to an IP literal that falls between the
given range. IP range is specified using CIDR notation.
Examples:
"192.168.1.1/16", "fefe:13::abc/33".
* `<local>`
Match local addresses. The meaning of `<local>` is whether the
host matches one of: "127.0.0.1", "::1", "localhost".
#### `ses.resolveProxy(url, callback)`
* `url` URL
* `callback` Function
* `proxy` Object
Resolves the proxy information for `url`. The `callback` will be called with
`callback(proxy)` when the request is performed.
#### `ses.setDownloadPath(path)`
* `path` String - The download location
Sets download saving directory. By default, the download directory will be the
`Downloads` under the respective app folder.
#### `ses.enableNetworkEmulation(options)`
* `options` Object
* `offline` Boolean (optional) - Whether to emulate network outage. Defaults
to false.
* `latency` Double (optional) - RTT in ms. Defaults to 0 which will disable
latency throttling.
* `downloadThroughput` Double (optional) - Download rate in Bps. Defaults to 0
which will disable download throttling.
* `uploadThroughput` Double (optional) - Upload rate in Bps. Defaults to 0
which will disable upload throttling.
Emulates network with the given configuration for the `session`.
```javascript
// To emulate a GPRS connection with 50kbps throughput and 500 ms latency.
window.webContents.session.enableNetworkEmulation({
latency: 500,
downloadThroughput: 6400,
uploadThroughput: 6400
})
// To emulate a network outage.
window.webContents.session.enableNetworkEmulation({offline: true})
```
#### `ses.disableNetworkEmulation()`
Disables any network emulation already active for the `session`. Resets to
the original network configuration.
#### `ses.setCertificateVerifyProc(proc)`
* `proc` Function
* `hostname` String
* `certificate` [Certificate](structures/certificate.md)
* `callback` Function
* `isTrusted` Boolean - Determines if the certificate should be trusted
Sets the certificate verify proc for `session`, the `proc` will be called with
`proc(hostname, certificate, callback)` whenever a server certificate
verification is requested. Calling `callback(true)` accepts the certificate,
calling `callback(false)` rejects it.
Calling `setCertificateVerifyProc(null)` will revert back to default certificate
verify proc.
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.webContents.session.setCertificateVerifyProc((hostname, cert, callback) => {
callback(hostname === 'github.com')
})
```
#### `ses.setPermissionRequestHandler(handler)`
* `handler` Function
* `webContents` Object - [WebContents](web-contents.md) requesting the permission.
* `permission` String - Enum of 'media', 'geolocation', 'notifications', 'midiSysex',
'pointerLock', 'fullscreen', 'openExternal'.
* `callback` Function
* `permissionGranted` Boolean - Allow or deny the permission
Sets the handler which can be used to respond to permission requests for the `session`.
Calling `callback(true)` will allow the permission and `callback(false)` will reject it.
```javascript
const {session} = require('electron')
session.fromPartition('some-partition').setPermissionRequestHandler((webContents, permission, callback) => {
if (webContents.getURL() === 'some-host' && permission === 'notifications') {
return callback(false) // denied.
}
callback(true)
})
```
#### `ses.clearHostResolverCache([callback])`
* `callback` Function (optional) - Called when operation is done.
Clears the host resolver cache.
#### `ses.allowNTLMCredentialsForDomains(domains)`
* `domains` String - A comma-seperated list of servers for which
integrated authentication is enabled.
Dynamically sets whether to always send credentials for HTTP NTLM or Negotiate
authentication.
```javascript
const {session} = require('electron')
// consider any url ending with `example.com`, `foobar.com`, `baz`
// for integrated authentication.
session.defaultSession.allowNTLMCredentialsForDomains('*example.com, *foobar.com, *baz')
// consider all urls for integrated authentication.
session.defaultSession.allowNTLMCredentialsForDomains('*')
```
#### `ses.setUserAgent(userAgent[, acceptLanguages])`
* `userAgent` String
* `acceptLanguages` String (optional)
Overrides the `userAgent` and `acceptLanguages` for this session.
The `acceptLanguages` must a comma separated ordered list of language codes, for
example `"en-US,fr,de,ko,zh-CN,ja"`.
This doesn't affect existing `WebContents`, and each `WebContents` can use
`webContents.setUserAgent` to override the session-wide user agent.
#### `ses.getUserAgent()`
Returns `String` - The user agent for this session.
#### `ses.getBlobData(identifier, callback)`
* `identifier` String - Valid UUID.
* `callback` Function
* `result` Buffer - Blob data.
Returns `Blob` - The blob data associated with the `identifier`.
#### `ses.createInterruptedDownload(options)`
* `options` Object
* `path` String - Absolute path of the download.
* `urlChain` String[] - Complete URL chain for the download.
* `mimeType` String (optional)
* `offset` Integer - Start range for the download.
* `length` Integer - Total length of the download.
* `lastModified` String - Last-Modified header value.
* `eTag` String - ETag header value.
* `startTime` Double (optional) - Time when download was started in
number of seconds since UNIX epoch.
Allows resuming `cancelled` or `interrupted` downloads from previous `Session`.
The API will generate a [DownloadItem](download-item.md) that can be accessed with the [will-download](#event-will-download)
event. The [DownloadItem](download-item.md) will not have any `WebContents` associated with it and
the initial state will be `interrupted`. The download will start only when the
`resume` API is called on the [DownloadItem](download-item.md).
#### `ses.clearAuthCache(options[, callback])`
* `options` ([RemovePassword](structures/remove-password.md) | [RemoveClientCertificate](structures/remove-client-certificate.md))
* `callback` Function (optional) - Called when operation is done
Clears the sessions HTTP authentication cache.
### Instance Properties
The following properties are available on instances of `Session`:
#### `ses.cookies`
A Cookies object for this session.
#### `ses.webRequest`
A WebRequest object for this session.
#### `ses.protocol`
A Protocol object (an instance of [protocol](protocol.md) module) for this session.
```javascript
const {app, session} = require('electron')
const path = require('path')
app.on('ready', function () {
const protocol = session.fromPartition('some-partition').protocol
protocol.registerFileProtocol('atom', function (request, callback) {
var url = request.url.substr(7)
callback({path: path.normalize(`${__dirname}/${url}`)})
}, function (error) {
if (error) console.error('Failed to register protocol')
})
})
```

View file

@ -1,86 +0,0 @@
# shell
> Manage files and URLs using their default applications.
Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer-process)
The `shell` module provides functions related to desktop integration.
An example of opening a URL in the user's default browser:
```javascript
const {shell} = require('electron')
shell.openExternal('https://github.com')
```
## Methods
The `shell` module has the following methods:
### `shell.showItemInFolder(fullPath)`
* `fullPath` String
Returns `Boolean` - Whether the item was successfully shown
Show the given file in a file manager. If possible, select the file.
### `shell.openItem(fullPath)`
* `fullPath` String
Returns `Boolean` - Whether the item was successfully opened.
Open the given file in the desktop's default manner.
### `shell.openExternal(url[, options, callback])`
* `url` String
* `options` Object (optional) _macOS_
* `activate` Boolean - `true` to bring the opened application to the
foreground. The default is `true`.
* `callback` Function (optional) - If specified will perform the open asynchronously. _macOS_
* `error` Error
Returns `Boolean` - Whether an application was available to open the URL.
If callback is specified, always returns true.
Open the given external protocol URL in the desktop's default manner. (For
example, mailto: URLs in the user's default mail agent).
### `shell.moveItemToTrash(fullPath)`
* `fullPath` String
Returns `Boolean` - Whether the item was successfully moved to the trash
Move the given file to trash and returns a boolean status for the operation.
### `shell.beep()`
Play the beep sound.
### `shell.writeShortcutLink(shortcutPath[, operation], options)` _Windows_
* `shortcutPath` String
* `operation` String (optional) - Default is `create`, can be one of following:
* `create` - Creates a new shortcut, overwriting if necessary.
* `update` - Updates specified properties only on an existing shortcut.
* `replace` - Overwrites an existing shortcut, fails if the shortcut doesn't
exist.
* `options` [ShortcutDetails](structures/shortcut-details.md)
Returns `Boolean` - Whether the shortcut was created successfully
Creates or updates a shortcut link at `shortcutPath`.
### `shell.readShortcutLink(shortcutPath)` _Windows_
* `shortcutPath` String
Returns [`ShortcutDetails`](structures/shortcut-details.md)
Resolves the shortcut link at `shortcutPath`.
An exception will be thrown when any error happens.

View file

@ -1,4 +0,0 @@
# BluetoothDevice Object
* `deviceName` String
* `deviceId` String

View file

@ -1,8 +0,0 @@
# CertificatePrincipal Object
* `commonName` String - Common Name
* `organizations` String[] - Organization names
* `organizationUnits` String[] - Organization Unit names
* `locality` String - Locality
* `state` String - State or province
* `country` String - Country or region

View file

@ -1,12 +0,0 @@
# Certificate Object
* `data` String - PEM encoded data
* `issuer` [CertificatePrincipal](certificate-principal.md) - Issuer principal
* `issuerName` String - Issuer's Common Name
* `issuerCert` Certificate - Issuer certificate (if not self-signed)
* `subject` [CertificatePrincipal](certificate-principal.md) - Subject principal
* `subjectName` String - Subject's Common Name
* `serialNumber` String - Hex value represented string
* `validStart` Number - Start date of the certificate being valid in seconds
* `validExpiry` Number - End date of the certificate being valid in seconds
* `fingerprint` String - Fingerprint of the certificate

View file

@ -1,14 +0,0 @@
# Cookie Object
* `name` String - The name of the cookie.
* `value` String - The value of the cookie.
* `domain` String (optional) - The domain of the cookie.
* `hostOnly` Boolean (optional) - Whether the cookie is a host-only cookie.
* `path` String (optional) - The path of the cookie.
* `secure` Boolean (optional) - Whether the cookie is marked as secure.
* `httpOnly` Boolean (optional) - Whether the cookie is marked as HTTP only.
* `session` Boolean (optional) - Whether the cookie is a session cookie or a persistent
cookie with an expiration date.
* `expirationDate` Double (optional) - The expiration date of the cookie as
the number of seconds since the UNIX epoch. Not provided for session
cookies.

View file

@ -1,4 +0,0 @@
# CrashReport Object
* `date` String
* `ID` Integer

View file

@ -1,14 +0,0 @@
# DesktopCapturerSource Object
* `id` String - The identifier of a window or screen that can be used as a
`chromeMediaSourceId` constraint when calling
[`navigator.webkitGetUserMedia`]. The format of the identifier will be
`window:XX` or `screen:XX`, where `XX` is a random generated number.
* `name` String - A screen source will be named either `Entire Screen` or
`Screen <index>`, while the name of a window source will match the window
title.
* `thumbnail` [NativeImage](../native-image.md) - A thumbnail image. **Note:**
There is no guarantee that the size of the thumbnail is the same as the
`thumbnailSize` specified in the `options` passed to
`desktopCapturer.getSources`. The actual size depends on the scale of the
screen or window.

View file

@ -1,19 +0,0 @@
# Display Object
* `id` Number - Unique identifier associated with the display.
* `rotation` Number - Can be 0, 90, 180, 270, represents screen rotation in
clock-wise degrees.
* `scaleFactor` Number - Output device's pixel scale factor.
* `touchSupport` String - Can be `available`, `unavailable`, `unknown`.
* `bounds` [Rectangle](rectangle.md)
* `size` Object
* `height` Number
* `width` Number
* `workArea` [Rectangle](rectangle.md)
* `workAreaSize` Object
* `height` Number
* `width` Number
The `Display` object represents a physical display connected to the system. A
fake `Display` may exist on a headless system, or a `Display` may correspond to
a remote, virtual display.

View file

@ -1,4 +0,0 @@
# FileFilter Object
* `name` String
* `extensions` String[]

View file

@ -1,21 +0,0 @@
# JumpListCategory Object
* `type` String (optional) - One of the following:
* `tasks` - Items in this category will be placed into the standard `Tasks`
category. There can be only one such category, and it will always be
displayed at the bottom of the Jump List.
* `frequent` - Displays a list of files frequently opened by the app, the
name of the category and its items are set by Windows.
* `recent` - Displays a list of files recently opened by the app, the name
of the category and its items are set by Windows. Items may be added to
this category indirectly using `app.addRecentDocument(path)`.
* `custom` - Displays tasks or file links, `name` must be set by the app.
* `name` String (optional) - Must be set if `type` is `custom`, otherwise it should be
omitted.
* `items` JumpListItem[] (optional) - Array of [`JumpListItem`](jump-list-item.md) objects if `type` is `tasks` or
`custom`, otherwise it should be omitted.
**Note:** If a `JumpListCategory` object has neither the `type` nor the `name`
property set then its `type` is assumed to be `tasks`. If the `name` property
is set but the `type` property is omitted then the `type` is assumed to be
`custom`.

View file

@ -1,28 +0,0 @@
# JumpListItem Object
* `type` String (optional) - One of the following:
* `task` - A task will launch an app with specific arguments.
* `separator` - Can be used to separate items in the standard `Tasks`
category.
* `file` - A file link will open a file using the app that created the
Jump List, for this to work the app must be registered as a handler for
the file type (though it doesn't have to be the default handler).
* `path` String (optional) - Path of the file to open, should only be set if `type` is
`file`.
* `program` String (optional) - Path of the program to execute, usually you should
specify `process.execPath` which opens the current program. Should only be
set if `type` is `task`.
* `args` String (optional) - The command line arguments when `program` is executed. Should
only be set if `type` is `task`.
* `title` String (optional) - The text to be displayed for the item in the Jump List.
Should only be set if `type` is `task`.
* `description` String (optional) - Description of the task (displayed in a tooltip).
Should only be set if `type` is `task`.
* `iconPath` String (optional) - The absolute path to an icon to be displayed in a
Jump List, which can be an arbitrary resource file that contains an icon
(e.g. `.ico`, `.exe`, `.dll`). You can usually specify `process.execPath` to
show the program icon.
* `iconIndex` Number (optional) - The index of the icon in the resource file. If a
resource file contains multiple icons this value can be used to specify the
zero-based index of the icon that should be displayed for this task. If a
resource file contains only one icon, this property should be set to zero.

View file

@ -1,8 +0,0 @@
# MemoryUsageDetails Object
* `count` Number
* `size` Number
* `liveSize` Number
* `decodedSize` Number
* `purgedSize` Number
* `purgeableSize` Number

View file

@ -1,4 +0,0 @@
# MimeTypedBuffer Object
* `mimeType` String - The mimeType of the Buffer that you are sending
* `buffer` Buffer - The actual Buffer content

View file

@ -1,6 +0,0 @@
# Rectangle Object
* `x` Number - The x coordinate of the origin of the rectangle
* `y` Number - The y coordinate of the origin of the rectangle
* `width` Number
* `height` Number

View file

@ -1,5 +0,0 @@
# RemoveClientCertificate Object
* `type` String - `clientCertificate`.
* `origin` String - Origin of the server whose associated client certificate
must be removed from the cache.

View file

@ -1,15 +0,0 @@
# RemovePassword Object
* `type` String - `password`.
* `origin` String (optional) - When provided, the authentication info
related to the origin will only be removed otherwise the entire cache
will be cleared.
* `scheme` String (optional) - Scheme of the authentication.
Can be `basic`, `digest`, `ntlm`, `negotiate`. Must be provided if
removing by `origin`.
* `realm` String (optional) - Realm of the authentication. Must be provided if
removing by `origin`.
* `username` String (optional) - Credentials of the authentication. Must be
provided if removing by `origin`.
* `password` String (optional) - Credentials of the authentication. Must be
provided if removing by `origin`.

View file

@ -1,15 +0,0 @@
# ShortcutDetails Object
* `target` String - The target to launch from this shortcut.
* `cwd` String (optional) - The working directory. Default is empty.
* `args` String (optional) - The arguments to be applied to `target` when
launching from this shortcut. Default is empty.
* `description` String (optional) - The description of the shortcut. Default
is empty.
* `icon` String (optional) - The path to the icon, can be a DLL or EXE. `icon`
and `iconIndex` have to be set together. Default is empty, which uses the
target's icon.
* `iconIndex` Number (optional) - The resource ID of icon when `icon` is a
DLL or EXE. Default is 0.
* `appUserModelId` String (optional) - The Application User Model ID. Default
is empty.

View file

@ -1,14 +0,0 @@
# Task Object
* `program` String - Path of the program to execute, usually you should
specify `process.execPath` which opens the current program.
* `arguments` String - The command line arguments when `program` is
executed.
* `title` String - The string to be displayed in a JumpList.
* `description` String - Description of this task.
* `iconPath` String - The absolute path to an icon to be displayed in a
JumpList, which can be an arbitrary resource file that contains an icon. You
can usually specify `process.execPath` to show the icon of the program.
* `iconIndex` Number - The icon index in the icon file. If an icon file
consists of two or more icons, set this value to identify the icon. If an
icon file consists of one icon, this value is 0.

View file

@ -1,21 +0,0 @@
# ThumbarButton Object
* `icon` [NativeImage](../native-image.md) - The icon showing in thumbnail
toolbar.
* `click` Function
* `tooltip` String (optional) - The text of the button's tooltip.
* `flags` String[] (optional) - Control specific states and behaviors of the
button. By default, it is `['enabled']`.
The `flags` is an array that can include following `String`s:
* `enabled` - The button is active and available to the user.
* `disabled` - The button is disabled. It is present, but has a visual state
indicating it will not respond to user action.
* `dismissonclick` - When the button is clicked, the thumbnail window closes
immediately.
* `nobackground` - Do not draw a button border, use only the image.
* `hidden` - The button is not shown to the user.
* `noninteractive` - The button is enabled but not interactive; no pressed
button state is drawn. This value is intended for instances where the button
is used in a notification.

View file

@ -1,4 +0,0 @@
# UploadBlob Object
* `type` String - `blob`.
* `blobUUID` String - UUID of blob data to upload.

View file

@ -1,6 +0,0 @@
# UploadData Object
* `bytes` Buffer - Content being sent.
* `file` String - Path of file being uploaded.
* `blobUUID` String - UUID of blob data. Use [ses.getBlobData](../session.md#sesgetblobdataidentifier-callback) method
to retrieve the data.

View file

@ -1,9 +0,0 @@
# UploadFileSystem Object
* `type` String - `fileSystem`.
* `filsSystemURL` String - FileSystem url to read data for upload.
* `offset` Integer - Defaults to `0`.
* `length` Integer - Number of bytes to read from `offset`.
Defaults to `0`.
* `modificationTime` Double - Last Modification time in
number of seconds sine the UNIX epoch.

View file

@ -1,9 +0,0 @@
# UploadFile Object
* `type` String - `file`.
* `filePath` String - Path of file to be uploaded.
* `offset` Integer - Defaults to `0`.
* `length` Integer - Number of bytes to read from `offset`.
Defaults to `0`.
* `modificationTime` Double - Last Modification time in
number of seconds sine the UNIX epoch.

View file

@ -1,4 +0,0 @@
# UploadRawData Object
* `type` String - `rawData`.
* `bytes` Buffer - Data to be uploaded.

View file

@ -1,95 +0,0 @@
# Synopsis
> How to use Node.js and Electron APIs.
All of [Node.js's built-in modules](https://nodejs.org/api/) are available in
Electron and third-party node modules also fully supported as well (including
the [native modules](../tutorial/using-native-node-modules.md)).
Electron also provides some extra built-in modules for developing native
desktop applications. Some modules are only available in the main process, some
are only available in the renderer process (web page), and some can be used in
both processes.
The basic rule is: if a module is [GUI][gui] or low-level system related, then
it should be only available in the main process. You need to be familiar with
the concept of [main process vs. renderer process](../tutorial/quick-start.md#main-process)
scripts to be able to use those modules.
The main process script is just like a normal Node.js script:
```javascript
const {app, BrowserWindow} = require('electron')
let win = null
app.on('ready', () => {
win = new BrowserWindow({width: 800, height: 600})
win.loadURL('https://github.com')
})
```
The renderer process is no different than a normal web page, except for the
extra ability to use node modules:
```html
<!DOCTYPE html>
<html>
<body>
<script>
const {app} = require('electron').remote
console.log(app.getVersion())
</script>
</body>
</html>
```
To run your app, read [Run your app](../tutorial/quick-start.md#run-your-app).
## Destructuring assignment
As of 0.37, you can use
[destructuring assignment][destructuring-assignment] to make it easier to use
built-in modules.
```javascript
const {app, BrowserWindow} = require('electron')
let win
app.on('ready', () => {
win = new BrowserWindow()
win.loadURL('https://github.com')
})
```
If you need the entire `electron` module, you can require it and then using
destructuring to access the individual modules from `electron`.
```javascript
const electron = require('electron')
const {app, BrowserWindow} = electron
let win
app.on('ready', () => {
win = new BrowserWindow()
win.loadURL('https://github.com')
})
```
This is equivalent to the following code:
```javascript
const electron = require('electron')
const app = electron.app
const BrowserWindow = electron.BrowserWindow
let win
app.on('ready', () => {
win = new BrowserWindow()
win.loadURL('https://github.com')
})
```
[gui]: https://en.wikipedia.org/wiki/Graphical_user_interface
[destructuring-assignment]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

View file

@ -1,239 +0,0 @@
# systemPreferences
> Get system preferences.
Process: [Main](../glossary.md#main-process)
```javascript
const {systemPreferences} = require('electron')
console.log(systemPreferences.isDarkMode())
```
## Events
The `systemPreferences` object emits the following events:
### Event: 'accent-color-changed' _Windows_
Returns:
* `event` Event
* `newColor` String - The new RGBA color the user assigned to be their system
accent color.
### Event: 'color-changed' _Windows_
Returns:
* `event` Event
### Event: 'inverted-color-scheme-changed' _Windows_
Returns:
* `event` Event
* `invertedColorScheme` Boolean - `true` if an inverted color scheme, such as
a high contrast theme, is being used, `false` otherwise.
## Methods
### `systemPreferences.isDarkMode()` _macOS_
Returns `Boolean` - Whether the system is in Dark Mode.
### `systemPreferences.isSwipeTrackingFromScrollEventsEnabled()` _macOS_
Returns `Boolean` - Whether the Swipe between pages setting is on.
### `systemPreferences.postNotification(event, userInfo)` _macOS_
* `event` String
* `userInfo` Object
Posts `event` as native notifications of macOS. The `userInfo` is an Object
that contains the user information dictionary sent along with the notification.
### `systemPreferences.postLocalNotification(event, userInfo)` _macOS_
* `event` String
* `userInfo` Object
Posts `event` as native notifications of macOS. The `userInfo` is an Object
that contains the user information dictionary sent along with the notification.
### `systemPreferences.subscribeNotification(event, callback)` _macOS_
* `event` String
* `callback` Function
* `event` String
* `userInfo` Object
Subscribes to native notifications of macOS, `callback` will be called with
`callback(event, userInfo)` when the corresponding `event` happens. The
`userInfo` is an Object that contains the user information dictionary sent
along with the notification.
The `id` of the subscriber is returned, which can be used to unsubscribe the
`event`.
Under the hood this API subscribes to `NSDistributedNotificationCenter`,
example values of `event` are:
* `AppleInterfaceThemeChangedNotification`
* `AppleAquaColorVariantChanged`
* `AppleColorPreferencesChangedNotification`
* `AppleShowScrollBarsSettingChanged`
### `systemPreferences.unsubscribeNotification(id)` _macOS_
* `id` Integer
Removes the subscriber with `id`.
### `systemPreferences.subscribeLocalNotification(event, callback)` _macOS_
* `event` String
* `callback` Function
* `event` String
* `userInfo` Object
Same as `subscribeNotification`, but uses `NSNotificationCenter` for local defaults.
This is necessary for events such as `NSUserDefaultsDidChangeNotification`
### `systemPreferences.unsubscribeLocalNotification(id)` _macOS_
* `id` Integer
Same as `unsubscribeNotification`, but removes the subscriber from `NSNotificationCenter`.
### `systemPreferences.getUserDefault(key, type)` _macOS_
* `key` String
* `type` String - Can be `string`, `boolean`, `integer`, `float`, `double`,
`url`, `array`, `dictionary`
Get the value of `key` in system preferences.
This API uses `NSUserDefaults` on macOS. Some popular `key` and `type`s are:
* `AppleInterfaceStyle`: `string`
* `AppleAquaColorVariant`: `integer`
* `AppleHighlightColor`: `string`
* `AppleShowScrollBars`: `string`
* `NSNavRecentPlaces`: `array`
* `NSPreferredWebServices`: `dictionary`
* `NSUserDictionaryReplacementItems`: `array`
### `systemPreferences.setUserDefault(key, type, value)` _macOS_
* `key` String
* `type` String - See [`getUserDefault`][#systempreferencesgetuserdefaultkey-type-macos]
* `value` String
Set the value of `key` in system preferences.
Note that `type` should match actual type of `value`. An exception is thrown
if they don't.
This API uses `NSUserDefaults` on macOS. Some popular `key` and `type`s are:
* `ApplePressAndHoldEnabled`: `boolean`
### `systemPreferences.isAeroGlassEnabled()` _Windows_
This method returns `true` if [DWM composition][dwm-composition] (Aero Glass) is
enabled, and `false` otherwise.
An example of using it to determine if you should create a transparent window or
not (transparent windows won't work correctly when DWM composition is disabled):
```javascript
const {BrowserWindow, systemPreferences} = require('electron')
let browserOptions = {width: 1000, height: 800}
// Make the window transparent only if the platform supports it.
if (process.platform !== 'win32' || systemPreferences.isAeroGlassEnabled()) {
browserOptions.transparent = true
browserOptions.frame = false
}
// Create the window.
let win = new BrowserWindow(browserOptions)
// Navigate.
if (browserOptions.transparent) {
win.loadURL(`file://${__dirname}/index.html`)
} else {
// No transparency, so we load a fallback that uses basic styles.
win.loadURL(`file://${__dirname}/fallback.html`)
}
```
[dwm-composition]:https://msdn.microsoft.com/en-us/library/windows/desktop/aa969540.aspx
### `systemPreferences.getAccentColor()` _Windows_
Returns `String` - The users current system wide accent color preference in RGBA
hexadecimal form.
```js
const color = systemPreferences.getAccentColor() // `"aabbccdd"`
const red = color.substr(0, 2) // "aa"
const green = color.substr(2, 2) // "bb"
const blue = color.substr(4, 2) // "cc"
const alpha = color.substr(6, 2) // "dd"
```
### `systemPreferences.getColor(color)` _Windows_
* `color` String - One of the following values:
* `3d-dark-shadow` - Dark shadow for three-dimensional display elements.
* `3d-face` - Face color for three-dimensional display elements and for dialog
box backgrounds.
* `3d-highlight` - Highlight color for three-dimensional display elements.
* `3d-light` - Light color for three-dimensional display elements.
* `3d-shadow` - Shadow color for three-dimensional display elements.
* `active-border` - Active window border.
* `active-caption` - Active window title bar. Specifies the left side color in
the color gradient of an active window's title bar if the gradient effect is
enabled.
* `active-caption-gradient` - Right side color in the color gradient of an
active window's title bar.
* `app-workspace` - Background color of multiple document interface (MDI)
applications.
* `button-text` - Text on push buttons.
* `caption-text` - Text in caption, size box, and scroll bar arrow box.
* `desktop` - Desktop background color.
* `disabled-text` - Grayed (disabled) text.
* `highlight` - Item(s) selected in a control.
* `highlight-text` - Text of item(s) selected in a control.
* `hotlight` - Color for a hyperlink or hot-tracked item.
* `inactive-border` - Inactive window border.
* `inactive-caption` - Inactive window caption. Specifies the left side color
in the color gradient of an inactive window's title bar if the gradient
effect is enabled.
* `inactive-caption-gradient` - Right side color in the color gradient of an
inactive window's title bar.
* `inactive-caption-text` - Color of text in an inactive caption.
* `info-background` - Background color for tooltip controls.
* `info-text` - Text color for tooltip controls.
* `menu` - Menu background.
* `menu-highlight` - The color used to highlight menu items when the menu
appears as a flat menu.
* `menubar` - The background color for the menu bar when menus appear as flat
menus.
* `menu-text` - Text in menus.
* `scrollbar` - Scroll bar gray area.
* `window` - Window background.
* `window-frame` - Window frame.
* `window-text` - Text in windows.
Returns `String` - The system color setting in RGB hexadecimal form (`#ABCDEF`).
See the [Windows docs][windows-colors] for more details.
### `systemPreferences.isInvertedColorScheme()` _Windows_
Returns `Boolean` - `true` if an inverted color scheme, such as a high contrast
theme, is active, `false` otherwise.
[windows-colors]:https://msdn.microsoft.com/en-us/library/windows/desktop/ms724371(v=vs.85).aspx

View file

@ -1,247 +0,0 @@
## Class: Tray
> Add icons and context menus to the system's notification area.
Process: [Main](../glossary.md#main-process)
`Tray` is an [EventEmitter][event-emitter].
```javascript
const {app, Menu, Tray} = require('electron')
let tray = null
app.on('ready', () => {
tray = new Tray('/path/to/my/icon')
const contextMenu = Menu.buildFromTemplate([
{label: 'Item1', type: 'radio'},
{label: 'Item2', type: 'radio'},
{label: 'Item3', type: 'radio', checked: true},
{label: 'Item4', type: 'radio'}
])
tray.setToolTip('This is my application.')
tray.setContextMenu(contextMenu)
})
```
__Platform limitations:__
* On Linux the app indicator will be used if it is supported, otherwise
`GtkStatusIcon` will be used instead.
* On Linux distributions that only have app indicator support, you have to
install `libappindicator1` to make the tray icon work.
* App indicator will only be shown when it has a context menu.
* When app indicator is used on Linux, the `click` event is ignored.
* On Linux in order for changes made to individual `MenuItem`s to take effect,
you have to call `setContextMenu` again. For example:
```javascript
const {app, Menu, Tray} = require('electron')
let appIcon = null
app.on('ready', () => {
appIcon = new Tray('/path/to/my/icon')
const contextMenu = Menu.buildFromTemplate([
{label: 'Item1', type: 'radio'},
{label: 'Item2', type: 'radio'}
])
// Make a change to the context menu
contextMenu.items[1].checked = false
// Call this again for Linux because we modified the context menu
appIcon.setContextMenu(contextMenu)
})
```
* On Windows it is recommended to use `ICO` icons to get best visual effects.
If you want to keep exact same behaviors on all platforms, you should not
rely on the `click` event and always attach a context menu to the tray icon.
### `new Tray(image)`
* `image` ([NativeImage](native-image.md) | String)
Creates a new tray icon associated with the `image`.
### Instance Events
The `Tray` module emits the following events:
#### Event: 'click'
* `event` Event
* `altKey` Boolean
* `shiftKey` Boolean
* `ctrlKey` Boolean
* `metaKey` Boolean
* `bounds` [Rectangle](structures/rectangle.md) - The bounds of tray icon
Emitted when the tray icon is clicked.
#### Event: 'right-click' _macOS_ _Windows_
* `event` Event
* `altKey` Boolean
* `shiftKey` Boolean
* `ctrlKey` Boolean
* `metaKey` Boolean
* `bounds` [Rectangle](structures/rectangle.md) - The bounds of tray icon
Emitted when the tray icon is right clicked.
#### Event: 'double-click' _macOS_ _Windows_
* `event` Event
* `altKey` Boolean
* `shiftKey` Boolean
* `ctrlKey` Boolean
* `metaKey` Boolean
* `bounds` [Rectangle](structures/rectangle.md) - The bounds of tray icon
Emitted when the tray icon is double clicked.
#### Event: 'balloon-show' _Windows_
Emitted when the tray balloon shows.
#### Event: 'balloon-click' _Windows_
Emitted when the tray balloon is clicked.
#### Event: 'balloon-closed' _Windows_
Emitted when the tray balloon is closed because of timeout or user manually
closes it.
#### Event: 'drop' _macOS_
Emitted when any dragged items are dropped on the tray icon.
#### Event: 'drop-files' _macOS_
* `event` Event
* `files` String[] - The paths of the dropped files.
Emitted when dragged files are dropped in the tray icon.
#### Event: 'drop-text' _macOS_
* `event` Event
* `text` String - the dropped text string
Emitted when dragged text is dropped in the tray icon.
#### Event: 'drag-enter' _macOS_
Emitted when a drag operation enters the tray icon.
#### Event: 'drag-leave' _macOS_
Emitted when a drag operation exits the tray icon.
#### Event: 'drag-end' _macOS_
Emitted when a drag operation ends on the tray or ends at another location.
### Instance Methods
The `Tray` class has the following methods:
#### `tray.destroy()`
Destroys the tray icon immediately.
#### `tray.setImage(image)`
* `image` ([NativeImage](native-image.md) | String)
Sets the `image` associated with this tray icon.
#### `tray.setPressedImage(image)` _macOS_
* `image` [NativeImage](native-image.md)
Sets the `image` associated with this tray icon when pressed on macOS.
#### `tray.setToolTip(toolTip)`
* `toolTip` String
Sets the hover text for this tray icon.
#### `tray.setTitle(title)` _macOS_
* `title` String
Sets the title displayed aside of the tray icon in the status bar.
#### `tray.setHighlightMode(mode)` _macOS_
* `mode` String - Highlight mode with one of the following values:
* `selection` - Highlight the tray icon when it is clicked and also when
its context menu is open. This is the default.
* `always` - Always highlight the tray icon.
* `never` - Never highlight the tray icon.
Sets when the tray's icon background becomes highlighted (in blue).
**Note:** You can use `highlightMode` with a [`BrowserWindow`](browser-window.md)
by toggling between `'never'` and `'always'` modes when the window visibility
changes.
```javascript
const {BrowserWindow, Tray} = require('electron')
const win = new BrowserWindow({width: 800, height: 600})
const tray = new Tray('/path/to/my/icon')
tray.on('click', () => {
win.isVisible() ? win.hide() : win.show()
})
win.on('show', () => {
tray.setHighlightMode('always')
})
win.on('hide', () => {
tray.setHighlightMode('never')
})
```
#### `tray.displayBalloon(options)` _Windows_
* `options` Object
* `icon` ([NativeImage](native-image.md) | String) - (optional)
* `title` String - (optional)
* `content` String - (optional)
Displays a tray balloon.
#### `tray.popUpContextMenu([menu, position])` _macOS_ _Windows_
* `menu` Menu (optional)
* `position` Object (optional) - The pop up position.
* `x` Integer
* `y` Integer
Pops up the context menu of the tray icon. When `menu` is passed, the `menu` will
be shown instead of the tray icon's context menu.
The `position` is only available on Windows, and it is (0, 0) by default.
#### `tray.setContextMenu(menu)`
* `menu` Menu
Sets the context menu for this icon.
#### `tray.getBounds()` _macOS_ _Windows_
Returns [`Rectangle`](structures/rectangle.md)
The `bounds` of this tray icon as `Object`.
#### `tray.isDestroyed()`
Returns `Boolean` - Whether the tray icon is destroyed.
[event-emitter]: https://nodejs.org/api/events.html#events_class_eventemitter

File diff suppressed because it is too large Load diff

View file

@ -1,193 +0,0 @@
# webFrame
> Customize the rendering of the current web page.
Process: [Renderer](../glossary.md#renderer-process)
An example of zooming current page to 200%.
```javascript
const {webFrame} = require('electron')
webFrame.setZoomFactor(2)
```
## Methods
The `webFrame` module has the following methods:
### `webFrame.setZoomFactor(factor)`
* `factor` Number - Zoom factor.
Changes the zoom factor to the specified factor. Zoom factor is
zoom percent divided by 100, so 300% = 3.0.
### `webFrame.getZoomFactor()`
Returns `Number` - The current zoom factor.
### `webFrame.setZoomLevel(level)`
* `level` Number - Zoom level
Changes the zoom level to the specified level. The original size is 0 and each
increment above or below represents zooming 20% larger or smaller to default
limits of 300% and 50% of original size, respectively.
### `webFrame.getZoomLevel()`
Returns `Number` - The current zoom level.
### `webFrame.setZoomLevelLimits(minimumLevel, maximumLevel)`
* `minimumLevel` Number
* `maximumLevel` Number
**Deprecated:** Call `setVisualZoomLevelLimits` instead to set the visual zoom
level limits. This method will be removed in Electron 2.0.
### `webFrame.setVisualZoomLevelLimits(minimumLevel, maximumLevel)`
* `minimumLevel` Number
* `maximumLevel` Number
Sets the maximum and minimum pinch-to-zoom level.
### `webFrame.setLayoutZoomLevelLimits(minimumLevel, maximumLevel)`
* `minimumLevel` Number
* `maximumLevel` Number
Sets the maximum and minimum layout-based (i.e. non-visual) zoom level.
### `webFrame.setSpellCheckProvider(language, autoCorrectWord, provider)`
* `language` String
* `autoCorrectWord` Boolean
* `provider` Object
* `spellCheck` Function - Returns `Boolean`
* `text` String
Sets a provider for spell checking in input fields and text areas.
The `provider` must be an object that has a `spellCheck` method that returns
whether the word passed is correctly spelled.
An example of using [node-spellchecker][spellchecker] as provider:
```javascript
const {webFrame} = require('electron')
webFrame.setSpellCheckProvider('en-US', true, {
spellCheck (text) {
return !(require('spellchecker').isMisspelled(text))
}
})
```
### `webFrame.registerURLSchemeAsSecure(scheme)`
* `scheme` String
Registers the `scheme` as secure scheme.
Secure schemes do not trigger mixed content warnings. For example, `https` and
`data` are secure schemes because they cannot be corrupted by active network
attackers.
### `webFrame.registerURLSchemeAsBypassingCSP(scheme)`
* `scheme` String
Resources will be loaded from this `scheme` regardless of the current page's
Content Security Policy.
### `webFrame.registerURLSchemeAsPrivileged(scheme[, options])`
* `scheme` String
* `options` Object (optional)
* `secure` Boolean - (optional) Default true.
* `bypassCSP` Boolean - (optional) Default true.
* `allowServiceWorkers` Boolean - (optional) Default true.
* `supportFetchAPI` Boolean - (optional) Default true.
* `corsEnabled` Boolean - (optional) Default true.
Registers the `scheme` as secure, bypasses content security policy for resources,
allows registering ServiceWorker and supports fetch API.
Specify an option with the value of `false` to omit it from the registration.
An example of registering a privileged scheme, without bypassing Content Security Policy:
```javascript
const {webFrame} = require('electron')
webFrame.registerURLSchemeAsPrivileged('foo', { bypassCSP: false })
```
### `webFrame.insertText(text)`
* `text` String
Inserts `text` to the focused element.
### `webFrame.executeJavaScript(code[, userGesture, callback])`
* `code` String
* `userGesture` Boolean (optional) - Default is `false`.
* `callback` Function (optional) - Called after script has been executed.
* `result` Any
Evaluates `code` in page.
In the browser window some HTML APIs like `requestFullScreen` can only be
invoked by a gesture from the user. Setting `userGesture` to `true` will remove
this limitation.
### `webFrame.getResourceUsage()`
Returns `Object`:
* `images` [MemoryUsageDetails](structures/memory-usage-details.md)
* `cssStyleSheets` [MemoryUsageDetails](structures/memory-usage-details.md)
* `xslStyleSheets` [MemoryUsageDetails](structures/memory-usage-details.md)
* `fonts` [MemoryUsageDetails](structures/memory-usage-details.md)
* `other` [MemoryUsageDetails](structures/memory-usage-details.md)
Returns an object describing usage information of Blink's internal memory
caches.
```javascript
const {webFrame} = require('electron')
console.log(webFrame.getResourceUsage())
```
This will generate:
```javascript
{
images: {
count: 22,
size: 2549,
liveSize: 2542,
decodedSize: 478,
purgedSize: 0,
purgeableSize: 0
},
cssStyleSheets: { /* same with "images" */ },
xslStyleSheets: { /* same with "images" */ },
fonts: { /* same with "images" */ },
other: { /* same with "images" */ }
}
```
### `webFrame.clearCache()`
Attempts to free memory that is no longer being used (like images from a
previous navigation).
Note that blindly calling this method probably makes Electron slower since it
will have to refill these emptied caches, you should only call it if an event
in your app has occurred that makes you think your page is actually using less
memory (i.e. you have navigated from a super heavy page to a mostly empty one,
and intend to stay there).
[spellchecker]: https://github.com/atom/node-spellchecker

View file

@ -1,205 +0,0 @@
## Class: WebRequest
> Intercept and modify the contents of a request at various stages of its lifetime.
Process: [Main](../glossary.md#main-process)
Instances of the `WebRequest` class are accessed by using the `webRequest`
property of a `Session`.
The methods of `WebRequest` accept an optional `filter` and a `listener`. The
`listener` will be called with `listener(details)` when the API's event has
happened. The `details` object describes the request. Passing `null`
as `listener` will unsubscribe from the event.
The `filter` object has a `urls` property which is an Array of URL
patterns that will be used to filter out the requests that do not match the URL
patterns. If the `filter` is omitted then all requests will be matched.
For certain events the `listener` is passed with a `callback`, which should be
called with a `response` object when `listener` has done its work.
An example of adding `User-Agent` header for requests:
```javascript
const {session} = require('electron')
// Modify the user agent for all requests to the following urls.
const filter = {
urls: ['https://*.github.com/*', '*://electron.github.io']
}
session.defaultSession.webRequest.onBeforeSendHeaders(filter, (details, callback) => {
details.requestHeaders['User-Agent'] = 'MyAgent'
callback({cancel: false, requestHeaders: details.requestHeaders})
})
```
### Instance Methods
The following methods are available on instances of `WebRequest`:
#### `webRequest.onBeforeRequest([filter, ]listener)`
* `filter` Object
* `listener` Function
* `details` Object
* `id` Integer
* `url` String
* `method` String
* `resourceType` String
* `timestamp` Double
* `uploadData` [UploadData[]](structures/upload-data.md)
* `callback` Function
* `response` Object
* `cancel` Boolean (optional)
* `redirectURL` String (optional) - The original request is prevented from
being sent or completed and is instead redirected to the given URL.
The `listener` will be called with `listener(details, callback)` when a request
is about to occur.
The `uploadData` is an array of `UploadData` objects.
The `callback` has to be called with an `response` object.
#### `webRequest.onBeforeSendHeaders([filter, ]listener)`
* `filter` Object
* `listener` Function
The `listener` will be called with `listener(details, callback)` before sending
an HTTP request, once the request headers are available. This may occur after a
TCP connection is made to the server, but before any http data is sent.
* `details` Object
* `id` Integer
* `url` String
* `method` String
* `resourceType` String
* `timestamp` Double
* `requestHeaders` Object
* `callback` Function
* `response` Object
* `cancel` Boolean (optional)
* `requestHeaders` Object (optional) - When provided, request will be made
with these headers.
The `callback` has to be called with an `response` object.
#### `webRequest.onSendHeaders([filter, ]listener)`
* `filter` Object
* `listener` Function
* `details` Object
* `id` Integer
* `url` String
* `method` String
* `resourceType` String
* `timestamp` Double
* `requestHeaders` Object
The `listener` will be called with `listener(details)` just before a request is
going to be sent to the server, modifications of previous `onBeforeSendHeaders`
response are visible by the time this listener is fired.
#### `webRequest.onHeadersReceived([filter, ]listener)`
* `filter` Object
* `listener` Function
The `listener` will be called with `listener(details, callback)` when HTTP
response headers of a request have been received.
* `details` Object
* `id` String
* `url` String
* `method` String
* `resourceType` String
* `timestamp` Double
* `statusLine` String
* `statusCode` Integer
* `responseHeaders` Object
* `callback` Function
* `response` Object
* `cancel` Boolean
* `responseHeaders` Object (optional) - When provided, the server is assumed
to have responded with these headers.
* `statusLine` String (optional) - Should be provided when overriding
`responseHeaders` to change header status otherwise original response
header's status will be used.
The `callback` has to be called with an `response` object.
#### `webRequest.onResponseStarted([filter, ]listener)`
* `filter` Object
* `listener` Function
* `details` Object
* `id` Integer
* `url` String
* `method` String
* `resourceType` String
* `timestamp` Double
* `responseHeaders` Object
* `fromCache` Boolean - Indicates whether the response was fetched from disk
cache.
* `statusCode` Integer
* `statusLine` String
The `listener` will be called with `listener(details)` when first byte of the
response body is received. For HTTP requests, this means that the status line
and response headers are available.
#### `webRequest.onBeforeRedirect([filter, ]listener)`
* `filter` Object
* `listener` Function
* `details` Object
* `id` String
* `url` String
* `method` String
* `resourceType` String
* `timestamp` Double
* `redirectURL` String
* `statusCode` Integer
* `ip` String (optional) - The server IP address that the request was
actually sent to.
* `fromCache` Boolean
* `responseHeaders` Object
The `listener` will be called with `listener(details)` when a server initiated
redirect is about to occur.
#### `webRequest.onCompleted([filter, ]listener)`
* `filter` Object
* `listener` Function
* `details` Object
* `id` Integer
* `url` String
* `method` String
* `resourceType` String
* `timestamp` Double
* `responseHeaders` Object
* `fromCache` Boolean
* `statusCode` Integer
* `statusLine` String
The `listener` will be called with `listener(details)` when a request is
completed.
#### `webRequest.onErrorOccurred([filter, ]listener)`
* `filter` Object
* `listener` Function
* `details` Object
* `id` Integer
* `url` String
* `method` String
* `resourceType` String
* `timestamp` Double
* `fromCache` Boolean
* `error` String - The error description.
The `listener` will be called with `listener(details)` when an error occurs.

View file

@ -1,910 +0,0 @@
# `<webview>` Tag
> Display external web content in an isolated frame and process.
Use the `webview` tag to embed 'guest' content (such as web pages) in your
Electron app. The guest content is contained within the `webview` container.
An embedded page within your app controls how the guest content is laid out and
rendered.
Unlike an `iframe`, the `webview` runs in a separate process than your
app. It doesn't have the same permissions as your web page and all interactions
between your app and embedded content will be asynchronous. This keeps your app
safe from the embedded content.
For security purposes, `webview` can only be used in `BrowserWindow`s that have
`nodeIntegration` enabled.
## Example
To embed a web page in your app, add the `webview` tag to your app's embedder
page (this is the app page that will display the guest content). In its simplest
form, the `webview` tag includes the `src` of the web page and css styles that
control the appearance of the `webview` container:
```html
<webview id="foo" src="https://www.github.com/" style="display:inline-flex; width:640px; height:480px"></webview>
```
If you want to control the guest content in any way, you can write JavaScript
that listens for `webview` events and responds to those events using the
`webview` methods. Here's sample code with two event listeners: one that listens
for the web page to start loading, the other for the web page to stop loading,
and displays a "loading..." message during the load time:
```html
<script>
onload = () => {
const webview = document.getElementById('foo')
const indicator = document.querySelector('.indicator')
const loadstart = () => {
indicator.innerText = 'loading...'
}
const loadstop = () => {
indicator.innerText = ''
}
webview.addEventListener('did-start-loading', loadstart)
webview.addEventListener('did-stop-loading', loadstop)
}
</script>
```
## CSS Styling Notes
Please note that the `webview` tag's style uses `display:flex;` internally to
ensure the child `object` element fills the full height and width of its `webview`
container when used with traditional and flexbox layouts (since v0.36.11). Please
do not overwrite the default `display:flex;` CSS property, unless specifying
`display:inline-flex;` for inline layout.
`webview` has issues being hidden using the `hidden` attribute or using `display: none;`.
It can cause unusual rendering behaviour within its child `browserplugin` object
and the web page is reloaded, when the `webview` is un-hidden, as opposed to just
becoming visible again. The recommended approach is to hide the `webview` using
CSS by zeroing the `width` & `height` and allowing the element to shrink to the 0px
dimensions via `flex`.
```html
<style>
webview {
display:inline-flex;
width:640px;
height:480px;
}
webview.hide {
flex: 0 1;
width: 0px;
height: 0px;
}
</style>
```
## Tag Attributes
The `webview` tag has the following attributes:
### `src`
```html
<webview src="https://www.github.com/"></webview>
```
Returns the visible URL. Writing to this attribute initiates top-level
navigation.
Assigning `src` its own value will reload the current page.
The `src` attribute can also accept data URLs, such as
`data:text/plain,Hello, world!`.
### `autosize`
```html
<webview src="https://www.github.com/" autosize="on" minwidth="576" minheight="432"></webview>
```
If "on", the `webview` container will automatically resize within the
bounds specified by the attributes `minwidth`, `minheight`, `maxwidth`, and
`maxheight`. These constraints do not impact the `webview` unless `autosize` is
enabled. When `autosize` is enabled, the `webview` container size cannot be less
than the minimum values or greater than the maximum.
### `nodeintegration`
```html
<webview src="http://www.google.com/" nodeintegration></webview>
```
If "on", the guest page in `webview` will have node integration and can use node
APIs like `require` and `process` to access low level system resources.
### `plugins`
```html
<webview src="https://www.github.com/" plugins></webview>
```
If "on", the guest page in `webview` will be able to use browser plugins.
### `preload`
```html
<webview src="https://www.github.com/" preload="./test.js"></webview>
```
Specifies a script that will be loaded before other scripts run in the guest
page. The protocol of script's URL must be either `file:` or `asar:`, because it
will be loaded by `require` in guest page under the hood.
When the guest page doesn't have node integration this script will still have
access to all Node APIs, but global objects injected by Node will be deleted
after this script has finished executing.
### `httpreferrer`
```html
<webview src="https://www.github.com/" httpreferrer="http://cheng.guru"></webview>
```
Sets the referrer URL for the guest page.
### `useragent`
```html
<webview src="https://www.github.com/" useragent="Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; AS; rv:11.0) like Gecko"></webview>
```
Sets the user agent for the guest page before the page is navigated to. Once the
page is loaded, use the `setUserAgent` method to change the user agent.
### `disablewebsecurity`
```html
<webview src="https://www.github.com/" disablewebsecurity></webview>
```
If "on", the guest page will have web security disabled.
### `partition`
```html
<webview src="https://github.com" partition="persist:github"></webview>
<webview src="http://electron.atom.io" partition="electron"></webview>
```
Sets the session used by the page. If `partition` starts with `persist:`, the
page will use a persistent session available to all pages in the app with the
same `partition`. if there is no `persist:` prefix, the page will use an
in-memory session. By assigning the same `partition`, multiple pages can share
the same session. If the `partition` is unset then default session of the app
will be used.
This value can only be modified before the first navigation, since the session
of an active renderer process cannot change. Subsequent attempts to modify the
value will fail with a DOM exception.
### `allowpopups`
```html
<webview src="https://www.github.com/" allowpopups></webview>
```
If "on", the guest page will be allowed to open new windows.
### `webpreferences`
```html
<webview src="https://github.com" webpreferences="allowDisplayingInsecureContent, javascript=no"></webview>
```
A list of strings which specifies the web preferences to be set on the webview, separated by `,`.
The full list of supported preference strings can be found in [BrowserWindow](browser-window.md#new-browserwindowoptions).
The string follows the same format as the features string in `window.open`.
A name by itself is given a `true` boolean value.
A preference can be set to another value by including an `=`, followed by the value.
Special values `yes` and `1` are interpreted as `true`, while `no` and `0` are interpreted as `false`.
### `blinkfeatures`
```html
<webview src="https://www.github.com/" blinkfeatures="PreciseMemoryInfo, CSSVariables"></webview>
```
A list of strings which specifies the blink features to be enabled separated by `,`.
The full list of supported feature strings can be found in the
[RuntimeEnabledFeatures.in][blink-feature-string] file.
### `disableblinkfeatures`
```html
<webview src="https://www.github.com/" disableblinkfeatures="PreciseMemoryInfo, CSSVariables"></webview>
```
A list of strings which specifies the blink features to be disabled separated by `,`.
The full list of supported feature strings can be found in the
[RuntimeEnabledFeatures.in][blink-feature-string] file.
### `guestinstance`
```html
<webview src="https://www.github.com/" guestinstance="3"></webview>
```
A value that links the webview to a specific webContents. When a webview
first loads a new webContents is created and this attribute is set to its
instance identifier. Setting this attribute on a new or existing webview
connects it to the existing webContents that currently renders in a different
webview.
The existing webview will see the `destroy` event and will then create a new
webContents when a new url is loaded.
### `disableguestresize`
```html
<webview src="https://www.github.com/" disableguestresize></webview>
```
Prevents the webview contents from resizing when the webview element itself is
resized.
This can be used in combination with
[`webContents.setSize`](web-contents.md#contentssetsizeoptions) to manually
resize the webview contents in reaction to a window size change. This can
make resizing faster compared to relying on the webview element bounds to
automatically resize the contents.
```javascript
const {webContents} = require('electron')
// We assume that `win` points to a `BrowserWindow` instance containing a
// `<webview>` with `disableguestresize`.
win.on('resize', () => {
const [width, height] = win.getContentSize()
for (let wc of webContents.getAllWebContents()) {
// Check if `wc` belongs to a webview in the `win` window.
if (wc.hostWebContents &&
wc.hostWebContents.id === win.webContents.id) {
wc.setSize({
normal: {
width: width,
height: height
}
})
}
}
})
```
## Methods
The `webview` tag has the following methods:
**Note:** The webview element must be loaded before using the methods.
**Example**
```javascript
const webview = document.getElementById('foo')
webview.addEventListener('dom-ready', () => {
webview.openDevTools()
})
```
### `<webview>.loadURL(url[, options])`
* `url` URL
* `options` Object (optional)
* `httpReferrer` String (optional) - A HTTP Referrer url.
* `userAgent` String (optional) - A user agent originating the request.
* `extraHeaders` String (optional) - Extra headers separated by "\n"
* `postData` ([UploadRawData](structures/upload-raw-data.md) | [UploadFile](structures/upload-file.md) | [UploadFileSystem](structures/upload-file-system.md) | [UploadBlob](structures/upload-blob.md))[] - (optional)
Loads the `url` in the webview, the `url` must contain the protocol prefix,
e.g. the `http://` or `file://`.
### `<webview>.getURL()`
Returns `String` - The URL of guest page.
### `<webview>.getTitle()`
Returns `String` - The title of guest page.
### `<webview>.isLoading()`
Returns `Boolean` - Whether guest page is still loading resources.
### `<webview>.isWaitingForResponse()`
Returns `Boolean` - Whether the guest page is waiting for a first-response for the
main resource of the page.
### `<webview>.stop()`
Stops any pending navigation.
### `<webview>.reload()`
Reloads the guest page.
### `<webview>.reloadIgnoringCache()`
Reloads the guest page and ignores cache.
### `<webview>.canGoBack()`
Returns `Boolean` - Whether the guest page can go back.
### `<webview>.canGoForward()`
Returns `Boolean` - Whether the guest page can go forward.
### `<webview>.canGoToOffset(offset)`
* `offset` Integer
Returns `Boolean` - Whether the guest page can go to `offset`.
### `<webview>.clearHistory()`
Clears the navigation history.
### `<webview>.goBack()`
Makes the guest page go back.
### `<webview>.goForward()`
Makes the guest page go forward.
### `<webview>.goToIndex(index)`
* `index` Integer
Navigates to the specified absolute index.
### `<webview>.goToOffset(offset)`
* `offset` Integer
Navigates to the specified offset from the "current entry".
### `<webview>.isCrashed()`
Returns `Boolean` - Whether the renderer process has crashed.
### `<webview>.setUserAgent(userAgent)`
* `userAgent` String
Overrides the user agent for the guest page.
### `<webview>.getUserAgent()`
Returns `String` - The user agent for guest page.
### `<webview>.insertCSS(css)`
* `css` String
Injects CSS into the guest page.
### `<webview>.executeJavaScript(code, userGesture, callback)`
* `code` String
* `userGesture` Boolean - Default `false`.
* `callback` Function (optional) - Called after script has been executed.
* `result` Any
Evaluates `code` in page. If `userGesture` is set, it will create the user
gesture context in the page. HTML APIs like `requestFullScreen`, which require
user action, can take advantage of this option for automation.
### `<webview>.openDevTools()`
Opens a DevTools window for guest page.
### `<webview>.closeDevTools()`
Closes the DevTools window of guest page.
### `<webview>.isDevToolsOpened()`
Returns `Boolean` - Whether guest page has a DevTools window attached.
### `<webview>.isDevToolsFocused()`
Returns `Boolean` - Whether DevTools window of guest page is focused.
### `<webview>.inspectElement(x, y)`
* `x` Integer
* `y` Integer
Starts inspecting element at position (`x`, `y`) of guest page.
### `<webview>.inspectServiceWorker()`
Opens the DevTools for the service worker context present in the guest page.
### `<webview>.setAudioMuted(muted)`
* `muted` Boolean
Set guest page muted.
### `<webview>.isAudioMuted()`
Returns `Boolean` - Whether guest page has been muted.
### `<webview>.undo()`
Executes editing command `undo` in page.
### `<webview>.redo()`
Executes editing command `redo` in page.
### `<webview>.cut()`
Executes editing command `cut` in page.
### `<webview>.copy()`
Executes editing command `copy` in page.
### `<webview>.paste()`
Executes editing command `paste` in page.
### `<webview>.pasteAndMatchStyle()`
Executes editing command `pasteAndMatchStyle` in page.
### `<webview>.delete()`
Executes editing command `delete` in page.
### `<webview>.selectAll()`
Executes editing command `selectAll` in page.
### `<webview>.unselect()`
Executes editing command `unselect` in page.
### `<webview>.replace(text)`
* `text` String
Executes editing command `replace` in page.
### `<webview>.replaceMisspelling(text)`
* `text` String
Executes editing command `replaceMisspelling` in page.
### `<webview>.insertText(text)`
* `text` String
Inserts `text` to the focused element.
### `<webview>.findInPage(text[, options])`
* `text` String - Content to be searched, must not be empty.
* `options` Object (optional)
* `forward` Boolean - Whether to search forward or backward, defaults to `true`.
* `findNext` Boolean - Whether the operation is first request or a follow up,
defaults to `false`.
* `matchCase` Boolean - Whether search should be case-sensitive,
defaults to `false`.
* `wordStart` Boolean - Whether to look only at the start of words.
defaults to `false`.
* `medialCapitalAsWordStart` Boolean - When combined with `wordStart`,
accepts a match in the middle of a word if the match begins with an
uppercase letter followed by a lowercase or non-letter.
Accepts several other intra-word matches, defaults to `false`.
Starts a request to find all matches for the `text` in the web page and returns an `Integer`
representing the request id used for the request. The result of the request can be
obtained by subscribing to [`found-in-page`](webview-tag.md#event-found-in-page) event.
### `<webview>.stopFindInPage(action)`
* `action` String - Specifies the action to take place when ending
[`<webview>.findInPage`](webview-tag.md#webviewtagfindinpage) request.
* `clearSelection` - Clear the selection.
* `keepSelection` - Translate the selection into a normal selection.
* `activateSelection` - Focus and click the selection node.
Stops any `findInPage` request for the `webview` with the provided `action`.
### `<webview>.print([options])`
Prints `webview`'s web page. Same as `webContents.print([options])`.
### `<webview>.printToPDF(options, callback)`
Prints `webview`'s web page as PDF, Same as `webContents.printToPDF(options, callback)`.
### `<webview>.capturePage([rect, ]callback)`
Captures a snapshot of the `webview`'s page. Same as `webContents.capturePage([rect, ]callback)`.
### `<webview>.send(channel[, arg1][, arg2][, ...])`
* `channel` String
* `arg` (optional)
Send an asynchronous message to renderer process via `channel`, you can also
send arbitrary arguments. The renderer process can handle the message by
listening to the `channel` event with the `ipcRenderer` module.
See [webContents.send](web-contents.md#webcontentssendchannel-args) for
examples.
### `<webview>.sendInputEvent(event)`
* `event` Object
Sends an input `event` to the page.
See [webContents.sendInputEvent](web-contents.md#webcontentssendinputeventevent)
for detailed description of `event` object.
### `<webview>.setZoomFactor(factor)`
* `factor` Number - Zoom factor.
Changes the zoom factor to the specified factor. Zoom factor is
zoom percent divided by 100, so 300% = 3.0.
### `<webview>.setZoomLevel(level)`
* `level` Number - Zoom level
Changes the zoom level to the specified level. The original size is 0 and each
increment above or below represents zooming 20% larger or smaller to default
limits of 300% and 50% of original size, respectively.
### `<webview>.showDefinitionForSelection()` _macOS_
Shows pop-up dictionary that searches the selected word on the page.
### `<webview>.getWebContents()`
Returns [`WebContents`](web-contents.md) - The web contents associated with
this `webview`.
## DOM events
The following DOM events are available to the `webview` tag:
### Event: 'load-commit'
Returns:
* `url` String
* `isMainFrame` Boolean
Fired when a load has committed. This includes navigation within the current
document as well as subframe document-level loads, but does not include
asynchronous resource loads.
### Event: 'did-finish-load'
Fired when the navigation is done, i.e. the spinner of the tab will stop
spinning, and the `onload` event is dispatched.
### Event: 'did-fail-load'
Returns:
* `errorCode` Integer
* `errorDescription` String
* `validatedURL` String
* `isMainFrame` Boolean
This event is like `did-finish-load`, but fired when the load failed or was
cancelled, e.g. `window.stop()` is invoked.
### Event: 'did-frame-finish-load'
Returns:
* `isMainFrame` Boolean
Fired when a frame has done navigation.
### Event: 'did-start-loading'
Corresponds to the points in time when the spinner of the tab starts spinning.
### Event: 'did-stop-loading'
Corresponds to the points in time when the spinner of the tab stops spinning.
### Event: 'did-get-response-details'
Returns:
* `status` Boolean
* `newURL` String
* `originalURL` String
* `httpResponseCode` Integer
* `requestMethod` String
* `referrer` String
* `headers` Object
* `resourceType` String
Fired when details regarding a requested resource is available.
`status` indicates socket connection to download the resource.
### Event: 'did-get-redirect-request'
Returns:
* `oldURL` String
* `newURL` String
* `isMainFrame` Boolean
Fired when a redirect was received while requesting a resource.
### Event: 'dom-ready'
Fired when document in the given frame is loaded.
### Event: 'page-title-updated'
Returns:
* `title` String
* `explicitSet` Boolean
Fired when page title is set during navigation. `explicitSet` is false when
title is synthesized from file url.
### Event: 'page-favicon-updated'
Returns:
* `favicons` String[] - Array of URLs.
Fired when page receives favicon urls.
### Event: 'enter-html-full-screen'
Fired when page enters fullscreen triggered by HTML API.
### Event: 'leave-html-full-screen'
Fired when page leaves fullscreen triggered by HTML API.
### Event: 'console-message'
Returns:
* `level` Integer
* `message` String
* `line` Integer
* `sourceId` String
Fired when the guest window logs a console message.
The following example code forwards all log messages to the embedder's console
without regard for log level or other properties.
```javascript
const webview = document.getElementById('foo')
webview.addEventListener('console-message', (e) => {
console.log('Guest page logged a message:', e.message)
})
```
### Event: 'found-in-page'
Returns:
* `result` Object
* `requestId` Integer
* `activeMatchOrdinal` Integer - Position of the active match.
* `matches` Integer - Number of Matches.
* `selectionArea` Object - Coordinates of first match region.
Fired when a result is available for
[`webview.findInPage`](webview-tag.md#webviewtagfindinpage) request.
```javascript
const webview = document.getElementById('foo')
webview.addEventListener('found-in-page', (e) => {
webview.stopFindInPage('keepSelection')
})
const requestId = webview.findInPage('test')
console.log(requestId)
```
### Event: 'new-window'
Returns:
* `url` String
* `frameName` String
* `disposition` String - Can be `default`, `foreground-tab`, `background-tab`,
`new-window`, `save-to-disk` and `other`.
* `options` Object - The options which should be used for creating the new
`BrowserWindow`.
Fired when the guest page attempts to open a new browser window.
The following example code opens the new url in system's default browser.
```javascript
const {shell} = require('electron')
const webview = document.getElementById('foo')
webview.addEventListener('new-window', (e) => {
const protocol = require('url').parse(e.url).protocol
if (protocol === 'http:' || protocol === 'https:') {
shell.openExternal(e.url)
}
})
```
### Event: 'will-navigate'
Returns:
* `url` String
Emitted when a user or the page wants to start navigation. It can happen when
the `window.location` object is changed or a user clicks a link in the page.
This event will not emit when the navigation is started programmatically with
APIs like `<webview>.loadURL` and `<webview>.back`.
It is also not emitted during in-page navigation, such as clicking anchor links
or updating the `window.location.hash`. Use `did-navigate-in-page` event for
this purpose.
Calling `event.preventDefault()` does __NOT__ have any effect.
### Event: 'did-navigate'
Returns:
* `url` String
Emitted when a navigation is done.
This event is not emitted for in-page navigations, such as clicking anchor links
or updating the `window.location.hash`. Use `did-navigate-in-page` event for
this purpose.
### Event: 'did-navigate-in-page'
Returns:
* `isMainFrame` Boolean
* `url` String
Emitted when an in-page navigation happened.
When in-page navigation happens, the page URL changes but does not cause
navigation outside of the page. Examples of this occurring are when anchor links
are clicked or when the DOM `hashchange` event is triggered.
### Event: 'close'
Fired when the guest page attempts to close itself.
The following example code navigates the `webview` to `about:blank` when the
guest attempts to close itself.
```javascript
const webview = document.getElementById('foo')
webview.addEventListener('close', () => {
webview.src = 'about:blank'
})
```
### Event: 'ipc-message'
Returns:
* `channel` String
* `args` Array
Fired when the guest page has sent an asynchronous message to embedder page.
With `sendToHost` method and `ipc-message` event you can easily communicate
between guest page and embedder page:
```javascript
// In embedder page.
const webview = document.getElementById('foo')
webview.addEventListener('ipc-message', (event) => {
console.log(event.channel)
// Prints "pong"
})
webview.send('ping')
```
```javascript
// In guest page.
const {ipcRenderer} = require('electron')
ipcRenderer.on('ping', () => {
ipcRenderer.sendToHost('pong')
})
```
### Event: 'crashed'
Fired when the renderer process is crashed.
### Event: 'gpu-crashed'
Fired when the gpu process is crashed.
### Event: 'plugin-crashed'
Returns:
* `name` String
* `version` String
Fired when a plugin process is crashed.
### Event: 'destroyed'
Fired when the WebContents is destroyed.
### Event: 'media-started-playing'
Emitted when media starts playing.
### Event: 'media-paused'
Emitted when media is paused or done playing.
### Event: 'did-change-theme-color'
Returns:
* `themeColor` String
Emitted when a page's theme color changes. This is usually due to encountering a meta tag:
```html
<meta name='theme-color' content='#ff0000'>
```
### Event: 'update-target-url'
Returns:
* `url` String
Emitted when mouse moves over a link or the keyboard moves the focus to a link.
### Event: 'devtools-opened'
Emitted when DevTools is opened.
### Event: 'devtools-closed'
Emitted when DevTools is closed.
### Event: 'devtools-focused'
Emitted when DevTools is focused / opened.
[blink-feature-string]: https://cs.chromium.org/chromium/src/third_party/WebKit/Source/platform/RuntimeEnabledFeatures.in

View file

@ -1,43 +0,0 @@
# `window.open` Function
> Open a new window and load a URL.
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
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 full 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` String
* `frameName` String (optional)
* `features` String (optional)
Returns [`BrowserWindowProxy`](browser-window-proxy.md) - Creates a new window
and returns an instance of `BrowserWindowProxy` class.
The `features` string follows the format of standard browser, but each feature
has to be a field of `BrowserWindow`'s options.
**Notes:**
* Node integration will always be disabled in the opened `window` if it is
disabled on the parent window.
* 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.
### `window.opener.postMessage(message, targetOrigin)`
* `message` String
* `targetOrigin` String
Sends a message to the parent window with the specified origin or `*` for no
origin preference.

View file

@ -1,52 +0,0 @@
# Technical Differences Between Electron and NW.js (formerly node-webkit)
__Note: Electron was previously named Atom Shell.__
Like NW.js, Electron provides a platform to write desktop applications
with JavaScript and HTML and has Node integration to grant access to the low
level system from web pages.
But there are also fundamental differences between the two projects that make
Electron a completely separate product from NW.js:
__1. Entry of Application__
In NW.js the main entry point of an application is a web page. You specify a
main page URL in the `package.json` and it is opened in a browser window as
the application's main window.
In Electron, the entry point is a JavaScript script. Instead of
providing a URL directly, you manually create a browser window and load
an HTML file using the API. You also need to listen to window events
to decide when to quit the application.
Electron works more like the Node.js runtime. Electron's APIs are lower level
so you can use it for browser testing in place of [PhantomJS](http://phantomjs.org/).
__2. Build System__
In order to avoid the complexity of building all of Chromium, Electron uses [`libchromiumcontent`](https://github.com/brightray/libchromiumcontent) to access
Chromium's Content API. `libchromiumcontent` is a single shared library that
includes the Chromium Content module and all of its dependencies. Users don't
need a powerful machine to build Electron.
__3. Node Integration__
In NW.js, the Node integration in web pages requires patching Chromium to
work, while in Electron we chose a different way to integrate the libuv loop
with each platform's message loop to avoid hacking Chromium. See the
[`node_bindings`][node-bindings] code for how that was done.
__4. Multi-context__
If you are an experienced NW.js user, you should be familiar with the
concept of Node context and web context. These concepts were invented because
of how NW.js was implemented.
By using the [multi-context](http://strongloop.com/strongblog/whats-new-node-js-v0-12-multiple-context-execution/)
feature of Node, Electron doesn't introduce a new JavaScript context in web
pages.
Note: NW.js has optionally supported multi-context since 0.13.
[node-bindings]: https://github.com/electron/electron/tree/master/atom/common

View file

@ -1,204 +0,0 @@
# Build Instructions (Linux)
Follow the guidelines below for building Electron on Linux.
## Prerequisites
* At least 25GB disk space and 8GB RAM.
* Python 2.7.x. Some distributions like CentOS 6.x still use Python 2.6.x
so you may need to check your Python version with `python -V`.
* Node.js. There are various ways to install Node. You can download
source code from [Node.js](http://nodejs.org) and compile from source.
Doing so permits installing Node on your own home directory as a standard user.
Or try repositories such as [NodeSource](https://nodesource.com/blog/nodejs-v012-iojs-and-the-nodesource-linux-repositories).
* Clang 3.4 or later.
* Development headers of GTK+ and libnotify.
On Ubuntu, install the following libraries:
```bash
$ sudo apt-get install build-essential clang libdbus-1-dev libgtk2.0-dev \
libnotify-dev libgnome-keyring-dev libgconf2-dev \
libasound2-dev libcap-dev libcups2-dev libxtst-dev \
libxss1 libnss3-dev gcc-multilib g++-multilib curl \
gperf bison
```
On RHEL / CentOS, install the following libraries:
```bash
$ sudo yum install clang dbus-devel gtk2-devel libnotify-devel \
libgnome-keyring-devel xorg-x11-server-utils libcap-devel \
cups-devel libXtst-devel alsa-lib-devel libXrandr-devel \
GConf2-devel nss-devel
```
On Fedora, install the following libraries:
```bash
$ sudo dnf install clang dbus-devel gtk2-devel libnotify-devel \
libgnome-keyring-devel xorg-x11-server-utils libcap-devel \
cups-devel libXtst-devel alsa-lib-devel libXrandr-devel \
GConf2-devel nss-devel
```
Other distributions may offer similar packages for installation via package
managers such as pacman. Or one can compile from source code.
## Getting the Code
```bash
$ git clone https://github.com/electron/electron.git
```
## Bootstrapping
The bootstrap script will download all necessary build dependencies and create
the build project files. You must have Python 2.7.x for the script to succeed.
Downloading certain files can take a long time. Notice that we are using
`ninja` to build Electron so there is no `Makefile` generated.
```bash
$ cd electron
$ ./script/bootstrap.py -v
```
### Cross compilation
If you want to build for an `arm` target you should also install the following
dependencies:
```bash
$ sudo apt-get install libc6-dev-armhf-cross linux-libc-dev-armhf-cross \
g++-arm-linux-gnueabihf
```
And to cross compile for `arm` or `ia32` targets, you should pass the
`--target_arch` parameter to the `bootstrap.py` script:
```bash
$ ./script/bootstrap.py -v --target_arch=arm
```
## Building
If you would like to build both `Release` and `Debug` targets:
```bash
$ ./script/build.py
```
This script will cause a very large Electron executable to be placed in
the directory `out/R`. The file size is in excess of 1.3 gigabytes. This
happens because the Release target binary contains debugging symbols.
To reduce the file size, run the `create-dist.py` script:
```bash
$ ./script/create-dist.py
```
This will put a working distribution with much smaller file sizes in
the `dist` directory. After running the create-dist.py script, you
may want to remove the 1.3+ gigabyte binary which is still in `out/R`.
You can also build the `Debug` target only:
```bash
$ ./script/build.py -c D
```
After building is done, you can find the `electron` debug binary under `out/D`.
## Cleaning
To clean the build files:
```bash
$ npm run clean
```
## Troubleshooting
### Error While Loading Shared Libraries: libtinfo.so.5
Prebulit `clang` will try to link to `libtinfo.so.5`. Depending on the host
architecture, symlink to appropriate `libncurses`:
```bash
$ sudo ln -s /usr/lib/libncurses.so.5 /usr/lib/libtinfo.so.5
```
## Tests
See [Build System Overview: Tests](build-system-overview.md#tests)
## Advanced topics
The default building configuration is targeted for major desktop Linux
distributions, to build for a specific distribution or device, following
information may help you.
### Building `libchromiumcontent` locally
To avoid using the prebuilt binaries of `libchromiumcontent`, you can pass the
`--build_libchromiumcontent` switch to `bootstrap.py` script:
```bash
$ ./script/bootstrap.py -v --build_libchromiumcontent
```
Note that by default the `shared_library` configuration is not built, so you can
only build `Release` version of Electron if you use this mode:
```bash
$ ./script/build.py -c R
```
### Using system `clang` instead of downloaded `clang` binaries
By default Electron is built with prebuilt `clang` binaries provided by Chromium
project. If for some reason you want to build with the `clang` installed in your
system, you can call `bootstrap.py` with `--clang_dir=<path>` switch. By passing
it the build script will assume the `clang` binaries reside in `<path>/bin/`.
For example if you installed `clang` under `/user/local/bin/clang`:
```bash
$ ./script/bootstrap.py -v --build_libchromiumcontent --clang_dir /usr/local
$ ./script/build.py -c R
```
### Using other compilers other than `clang`
To build Electron with compilers like `g++`, you first need to disable `clang`
with `--disable_clang` switch first, and then set `CC` and `CXX` environment
variables to the ones you want.
For example building with GCC toolchain:
```bash
$ env CC=gcc CXX=g++ ./script/bootstrap.py -v --build_libchromiumcontent --disable_clang
$ ./script/build.py -c R
```
### Environment variables
Apart from `CC` and `CXX`, you can also set following environment variables to
custom the building configurations:
* `CPPFLAGS`
* `CPPFLAGS_host`
* `CFLAGS`
* `CFLAGS_host`
* `CXXFLAGS`
* `CXXFLAGS_host`
* `AR`
* `AR_host`
* `CC`
* `CC_host`
* `CXX`
* `CXX_host`
* `LDFLAGS`
The environment variables have to be set when executing the `bootstrap.py`
script, it won't work in the `build.py` script.

View file

@ -1,64 +0,0 @@
# Build Instructions (macOS)
Follow the guidelines below for building Electron on macOS.
## Prerequisites
* macOS >= 10.8
* [Xcode](https://developer.apple.com/technologies/tools/) >= 5.1
* [node.js](http://nodejs.org) (external)
If you are using the Python downloaded by Homebrew, you also need to install
the following Python modules:
* [pyobjc](https://pythonhosted.org/pyobjc/install.html)
## Getting the Code
```bash
$ git clone https://github.com/electron/electron
```
## Bootstrapping
The bootstrap script will download all necessary build dependencies and create
the build project files. Notice that we're using [ninja](https://ninja-build.org/)
to build Electron so there is no Xcode project generated.
```bash
$ cd electron
$ ./script/bootstrap.py -v
```
## Building
Build both `Release` and `Debug` targets:
```bash
$ ./script/build.py
```
You can also only build the `Debug` target:
```bash
$ ./script/build.py -c D
```
After building is done, you can find `Electron.app` under `out/D`.
## 32bit Support
Electron can only be built for a 64bit target on macOS and there is no plan to
support 32bit macOS in the future.
## Cleaning
To clean the build files:
```bash
$ npm run clean
```
## Tests
See [Build System Overview: Tests](build-system-overview.md#tests)

View file

@ -1,146 +0,0 @@
# Build Instructions (Windows)
Follow the guidelines below for building Electron on Windows.
## Prerequisites
* Windows 7 / Server 2008 R2 or higher
* Visual Studio 2015 - [download VS 2015 Community Edition for
free](https://www.visualstudio.com/en-us/products/visual-studio-community-vs.aspx)
* [Python 2.7](http://www.python.org/download/releases/2.7/)
* [Node.js](http://nodejs.org/download/)
* [Git](http://git-scm.com)
If you don't currently have a Windows installation,
[dev.microsoftedge.com](https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/)
has timebombed versions of Windows that you can use to build Electron.
Building Electron is done entirely with command-line scripts and cannot be done
with Visual Studio. You can develop Electron with any editor but support for
building with Visual Studio will come in the future.
**Note:** Even though Visual Studio is not used for building, it's still
**required** because we need the build toolchains it provides.
**Note:** While older versions of Electron required Visual Studio 2013, Electron 1.1 and later does require Visual Studio 2015.
## Getting the Code
```powershell
$ git clone https://github.com/electron/electron.git
```
## Bootstrapping
The bootstrap script will download all necessary build dependencies and create
the build project files. Notice that we're using `ninja` to build Electron so
there is no Visual Studio project generated.
```powershell
$ cd electron
$ python script\bootstrap.py -v
```
## Building
Build both Release and Debug targets:
```powershell
$ python script\build.py
```
You can also only build the Debug target:
```powershell
$ python script\build.py -c D
```
After building is done, you can find `electron.exe` under `out\D` (debug
target) or under `out\R` (release target).
## 32bit Build
To build for the 32bit target, you need to pass `--target_arch=ia32` when
running the bootstrap script:
```powershell
$ python script\bootstrap.py -v --target_arch=ia32
```
The other building steps are exactly the same.
## Visual Studio project
To generate a Visual Studio project, you can pass the `--msvs` parameter:
```powershell
$ python script\bootstrap.py --msvs
```
## Cleaning
To clean the build files:
```powershell
$ npm run clean
```
## Tests
See [Build System Overview: Tests](build-system-overview.md#tests)
## Troubleshooting
### Command xxxx not found
If you encountered an error like `Command xxxx not found`, you may try to use
the `VS2015 Command Prompt` console to execute the build scripts.
### Fatal internal compiler error: C1001
Make sure you have the latest Visual Studio update installed.
### Assertion failed: ((handle))->activecnt >= 0
If building under Cygwin, you may see `bootstrap.py` failed with following
error:
```
Assertion failed: ((handle))->activecnt >= 0, file src\win\pipe.c, line 1430
Traceback (most recent call last):
File "script/bootstrap.py", line 87, in <module>
sys.exit(main())
File "script/bootstrap.py", line 22, in main
update_node_modules('.')
File "script/bootstrap.py", line 56, in update_node_modules
execute([NPM, 'install'])
File "/home/zcbenz/codes/raven/script/lib/util.py", line 118, in execute
raise e
subprocess.CalledProcessError: Command '['npm.cmd', 'install']' returned non-zero exit status 3
```
This is caused by a bug when using Cygwin Python and Win32 Node together. The
solution is to use the Win32 Python to execute the bootstrap script (assuming
you have installed Python under `C:\Python27`):
```powershell
$ /cygdrive/c/Python27/python.exe script/bootstrap.py
```
### LNK1181: cannot open input file 'kernel32.lib'
Try reinstalling 32bit Node.js.
### Error: ENOENT, stat 'C:\Users\USERNAME\AppData\Roaming\npm'
Simply making that directory [should fix the problem](http://stackoverflow.com/a/25095327/102704):
```powershell
$ mkdir ~\AppData\Roaming\npm
```
### node-gyp is not recognized as an internal or external command
You may get this error if you are using Git Bash for building, you should use
PowerShell or VS2015 Command Prompt instead.

View file

@ -1,122 +0,0 @@
# Build System Overview
Electron uses [gyp](https://gyp.gsrc.io/) for project generation and
[ninja](https://ninja-build.org/) for building. Project configurations can
be found in the `.gyp` and `.gypi` files.
## Gyp Files
Following `gyp` files contain the main rules for building Electron:
* `electron.gyp` defines how Electron itself is built.
* `common.gypi` adjusts the build configurations of Node to make it build
together with Chromium.
* `vendor/brightray/brightray.gyp` defines how `brightray` is built and
includes the default configurations for linking with Chromium.
* `vendor/brightray/brightray.gypi` includes general build configurations about
building.
## Component Build
Since Chromium is quite a large project, the final linking stage can take
quite a few minutes, which makes it hard for development. In order to solve
this, Chromium introduced the "component build", which builds each component as
a separate shared library, making linking very quick but sacrificing file size
and performance.
In Electron we took a very similar approach: for `Debug` builds, the binary
will be linked to a shared library version of Chromium's components to achieve
fast linking time; for `Release` builds, the binary will be linked to the static
library versions, so we can have the best possible binary size and performance.
## Minimal Bootstrapping
All of Chromium's prebuilt binaries (`libchromiumcontent`) are downloaded when
running the bootstrap script. By default both static libraries and shared
libraries will be downloaded and the final size should be between 800MB and 2GB
depending on the platform.
By default, `libchromiumcontent` is downloaded from Amazon Web Services.
If the `LIBCHROMIUMCONTENT_MIRROR` environment variable is set, the bootstrap
script will download from it.
[`libchromiumcontent-qiniu-mirror`](https://github.com/hokein/libchromiumcontent-qiniu-mirror)
is a mirror for `libchromiumcontent`. If you have trouble in accessing AWS, you
can switch the download address to it via
`export LIBCHROMIUMCONTENT_MIRROR=http://7xk3d2.dl1.z0.glb.clouddn.com/`
If you only want to build Electron quickly for testing or development, you
can download just the shared library versions by passing the `--dev` parameter:
```bash
$ ./script/bootstrap.py --dev
$ ./script/build.py -c D
```
## Two-Phase Project Generation
Electron links with different sets of libraries in `Release` and `Debug`
builds. `gyp`, however, doesn't support configuring different link settings for
different configurations.
To work around this Electron uses a `gyp` variable
`libchromiumcontent_component` to control which link settings to use and only
generates one target when running `gyp`.
## Target Names
Unlike most projects that use `Release` and `Debug` as target names, Electron
uses `R` and `D` instead. This is because `gyp` randomly crashes if there is
only one `Release` or `Debug` build configuration defined, and Electron only has
to generate one target at a time as stated above.
This only affects developers, if you are just building Electron for rebranding
you are not affected.
## Tests
Test your changes conform to the project coding style using:
```bash
$ npm run lint
```
Test functionality using:
```bash
$ npm test
```
Whenever you make changes to Electron source code, you'll need to re-run the
build before the tests:
```bash
$ npm run build && npm test
```
You can make the test suite run faster by isolating the specific test or block
you're currently working on using Mocha's
[exclusive tests](https://mochajs.org/#exclusive-tests) feature. Just append
`.only` to any `describe` or `it` function call:
```js
describe.only('some feature', function () {
// ... only tests in this block will be run
})
```
Alternatively, you can use mocha's `grep` option to only run tests matching the
given regular expression pattern:
```sh
$ npm test -- --grep child_process
```
Tests that include native modules (e.g. `runas`) can't be executed with the
debug build (see [#2558](https://github.com/electron/electron/issues/2558) for
details), but they will work with the release build.
To run the tests with the release build use:
```bash
$ npm test -- -R
```

View file

@ -1,34 +0,0 @@
# Using clang-format on C++ Code
[`clang-format`](http://clang.llvm.org/docs/ClangFormat.html) is a tool to
automatically format C/C++/Objective-C code, so that developers don't need to
worry about style issues during code reviews.
It is highly recommended to format your changed C++ code before opening pull
requests, which will save you and the reviewers' time.
You can install `clang-format` and `git-clang-format` via
`npm install -g clang-format`.
To automatically format a file according to Electron C++ code style, simply run
`clang-format -i path/to/electron/file.cc`. It should work on macOS/Linux/Windows.
The workflow to format your changed code:
1. Make codes changes in Electron repository.
2. Run `git add your_changed_file.cc`.
3. Run `git-clang-format`, and you will probably see modifications in
`your_changed_file.cc`, these modifications are generated from `clang-format`.
4. Run `git add your_changed_file.cc`, and commit your change.
5. Now the branch is ready to be opened as a pull request.
If you want to format the changed code on your latest git commit (HEAD), you can
run `git-clang-format HEAD~1`. See `git-clang-format -h` for more details.
## Editor Integration
You can also integrate `clang-format` directly into your favorite editors.
For further guidance on setting up editor integration, see these pages:
* [Atom](https://atom.io/packages/clang-format)
* [Vim & Emacs](http://clang.llvm.org/docs/ClangFormat.html#vim-integration)

View file

@ -1,55 +0,0 @@
# Coding Style
These are the style guidelines for coding in Electron.
You can run `npm run lint` to show any style issues detected by `cpplint` and
`eslint`.
## C++ and Python
For C++ and Python, we follow Chromium's [Coding
Style](http://www.chromium.org/developers/coding-style). You can use
[clang-format](clang-format.md) to format the C++ code automatically. There is
also a script `script/cpplint.py` to check whether all files conform.
The Python version we are using now is Python 2.7.
The C++ code uses a lot of Chromium's abstractions and types, so it's
recommended to get acquainted with them. A good place to start is
Chromium's [Important Abstractions and Data Structures](https://www.chromium.org/developers/coding-style/important-abstractions-and-data-structures)
document. The document mentions some special types, scoped types (that
automatically release their memory when going out of scope), logging mechanisms
etc.
## JavaScript
* Write [standard](http://npm.im/standard) JavaScript style.
* File names should be concatenated with `-` instead of `_`, e.g.
`file-name.js` rather than `file_name.js`, because in
[github/atom](https://github.com/github/atom) module names are usually in
the `module-name` form. This rule only applies to `.js` files.
* Use newer ES6/ES2015 syntax where appropriate
* [`const`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
for requires and other constants
* [`let`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
for defining variables
* [Arrow functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
instead of `function () { }`
* [Template literals](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals)
instead of string concatenation using `+`
## Naming Things
Electron APIs uses the same capitalization scheme as Node.js:
- When the module itself is a class like `BrowserWindow`, use `CamelCase`.
- When the module is a set of APIs, like `globalShortcut`, use `mixedCase`.
- When the API is a property of object, and it is complex enough to be in a
separate chapter like `win.webContents`, use `mixedCase`.
- For other non-module APIs, use natural titles, like `<webview> Tag` or
`Process Object`.
When creating a new API, it is preferred to use getters and setters instead of
jQuery's one-function style. For example, `.getText()` and `.setText(text)`
are preferred to `.text([text])`. There is a
[discussion](https://github.com/electron/electron/issues/46) on this.

View file

@ -1,93 +0,0 @@
# Debugging on Windows
If you experience crashes or issues in Electron that you believe are not caused
by your JavaScript application, but instead by Electron itself, debugging can
be a little bit tricky, especially for developers not used to native/C++
debugging. However, using Visual Studio, GitHub's hosted Electron Symbol Server,
and the Electron source code, it is fairly easy to enable step-through debugging
with breakpoints inside Electron's source code.
## Requirements
* **A debug build of Electron**: The easiest way is usually building it
yourself, using the tools and prerequisites listed in the
[build instructions for Windows](build-instructions-windows.md). While you can
easily attach to and debug Electron as you can download it directly, you will
find that it is heavily optimized, making debugging substantially more
difficult: The debugger will not be able to show you the content of all
variables and the execution path can seem strange because of inlining,
tail calls, and other compiler optimizations.
* **Visual Studio with C++ Tools**: The free community editions of Visual
Studio 2013 and Visual Studio 2015 both work. Once installed,
[configure Visual Studio to use GitHub's Electron Symbol server](setting-up-symbol-server.md).
It will enable Visual Studio to gain a better understanding of what happens
inside Electron, making it easier to present variables in a human-readable
format.
* **ProcMon**: The [free SysInternals tool][sys-internals] allows you to inspect
a processes parameters, file handles, and registry operations.
## Attaching to and Debugging Electron
To start a debugging session, open up PowerShell/CMD and execute your debug
build of Electron, using the application to open as a parameter.
```powershell
$ ./out/D/electron.exe ~/my-electron-app/
```
### Setting Breakpoints
Then, open up Visual Studio. Electron is not built with Visual Studio and hence
does not contain a project file - you can however open up the source code files
"As File", meaning that Visual Studio will open them up by themselves. You can
still set breakpoints - Visual Studio will automatically figure out that the
source code matches the code running in the attached process and break
accordingly.
Relevant code files can be found in `./atom/` as well as in Brightray, found in
`./vendor/brightray/browser` and `./vendor/brightray/common`. If you're hardcore,
you can also debug Chromium directly, which is obviously found in `chromium_src`.
### Attaching
You can attach the Visual Studio debugger to a running process on a local or
remote computer. After the process is running, click Debug / Attach to Process
(or press `CTRL+ALT+P`) to open the "Attach to Process" dialog box. You can use
this capability to debug apps that are running on a local or remote computer,
debug multiple processes simultaneously.
If Electron is running under a different user account, select the
`Show processes from all users` check box. Notice that depending on how many
BrowserWindows your app opened, you will see multiple processes. A typical
one-window app will result in Visual Studio presenting you with two
`Electron.exe` entries - one for the main process and one for the renderer
process. Since the list only gives you names, there's currently no reliable
way of figuring out which is which.
### Which Process Should I Attach to?
Code executed within the main process (that is, code found in or eventually run
by your main JavaScript file) as well as code called using the remote
(`require('electron').remote`) will run inside the main process, while other
code will execute inside its respective renderer process.
You can be attached to multiple programs when you are debugging, but only one
program is active in the debugger at any time. You can set the active program
in the `Debug Location` toolbar or the `Processes window`.
## Using ProcMon to Observe a Process
While Visual Studio is fantastic for inspecting specific code paths, ProcMon's
strength is really in observing everything your application is doing with the
operating system - it captures File, Registry, Network, Process, and Profiling
details of processes. It attempts to log **all** events occurring and can be
quite overwhelming, but if you seek to understand what and how your application
is doing to the operating system, it can be a valuable resource.
For an introduction to ProcMon's basic and advanced debugging features, go check
out [this video tutorial][procmon-instructions] provided by Microsoft.
[sys-internals]: https://technet.microsoft.com/en-us/sysinternals/processmonitor.aspx
[procmon-instructions]: https://channel9.msdn.com/shows/defrag-tools/defrag-tools-4-process-monitor

View file

@ -1,125 +0,0 @@
# Debugging on macOS
If you experience crashes or issues in Electron that you believe are not caused
by your JavaScript application, but instead by Electron itself, debugging can
be a little bit tricky, especially for developers not used to native/C++
debugging. However, using lldb, and the Electron source code, it is fairly easy
to enable step-through debugging with breakpoints inside Electron's source code.
## Requirements
* **A debug build of Electron**: The easiest way is usually building it
yourself, using the tools and prerequisites listed in the
[build instructions for macOS](build-instructions-osx.md). While you can
easily attach to and debug Electron as you can download it directly, you will
find that it is heavily optimized, making debugging substantially more
difficult: The debugger will not be able to show you the content of all
variables and the execution path can seem strange because of inlining,
tail calls, and other compiler optimizations.
* **Xcode**: In addition to Xcode, also install the Xcode command line tools.
They include LLDB, the default debugger in Xcode on Mac OS X. It supports
debugging C, Objective-C and C++ on the desktop and iOS devices and simulator.
## Attaching to and Debugging Electron
To start a debugging session, open up Terminal and start `lldb`, passing a debug
build of Electron as a parameter.
```bash
$ lldb ./out/D/Electron.app
(lldb) target create "./out/D/Electron.app"
Current executable set to './out/D/Electron.app' (x86_64).
```
### Setting Breakpoints
LLDB is a powerful tool and supports multiple strategies for code inspection. For
this basic introduction, let's assume that you're calling a command from JavaScript
that isn't behaving correctly - so you'd like to break on that command's C++
counterpart inside the Electron source.
Relevant code files can be found in `./atom/` as well as in Brightray, found in
`./vendor/brightray/browser` and `./vendor/brightray/common`. If you're hardcore,
you can also debug Chromium directly, which is obviously found in `chromium_src`.
Let's assume that you want to debug `app.setName()`, which is defined in `browser.cc`
as `Browser::SetName()`. Set the breakpoint using the `breakpoint` command, specifying
file and line to break on:
```bash
(lldb) breakpoint set --file browser.cc --line 117
Breakpoint 1: where = Electron Framework`atom::Browser::SetName(std::__1::basic_string<char, std::__1::char_traits<char>, std::__1::allocator<char> > const&) + 20 at browser.cc:118, address = 0x000000000015fdb4
```
Then, start Electron:
```bash
(lldb) run
```
The app will immediately be paused, since Electron sets the app's name on launch:
```bash
(lldb) run
Process 25244 launched: '/Users/fr/Code/electron/out/D/Electron.app/Contents/MacOS/Electron' (x86_64)
Process 25244 stopped
* thread #1: tid = 0x839a4c, 0x0000000100162db4 Electron Framework`atom::Browser::SetName(this=0x0000000108b14f20, name="Electron") + 20 at browser.cc:118, queue = 'com.apple.main-thread', stop reason = breakpoint 1.1
frame #0: 0x0000000100162db4 Electron Framework`atom::Browser::SetName(this=0x0000000108b14f20, name="Electron") + 20 at browser.cc:118
115 }
116
117 void Browser::SetName(const std::string& name) {
-> 118 name_override_ = name;
119 }
120
121 int Browser::GetBadgeCount() {
(lldb)
```
To show the arguments and local variables for the current frame, run `frame variable` (or `fr v`),
which will show you that the app is currently setting the name to "Electron".
```bash
(lldb) frame variable
(atom::Browser *) this = 0x0000000108b14f20
(const string &) name = "Electron": {
[...]
}
```
To do a source level single step in the currently selected thread, execute `step` (or `s`).
This would take you into into `name_override_.empty()`. To proceed and do a step over,
run `next` (or `n`).
```bash
(lldb) step
Process 25244 stopped
* thread #1: tid = 0x839a4c, 0x0000000100162dcc Electron Framework`atom::Browser::SetName(this=0x0000000108b14f20, name="Electron") + 44 at browser.cc:119, queue = 'com.apple.main-thread', stop reason = step in
frame #0: 0x0000000100162dcc Electron Framework`atom::Browser::SetName(this=0x0000000108b14f20, name="Electron") + 44 at browser.cc:119
116
117 void Browser::SetName(const std::string& name) {
118 name_override_ = name;
-> 119 }
120
121 int Browser::GetBadgeCount() {
122 return badge_count_;
```
To finish debugging at this point, run `process continue`. You can also continue until a certain
line is hit in this thread (`thread until 100`). This command will run the thread in the current
frame till it reaches line 100 in this frame or stops if it leaves the current frame.
Now, if you open up Electron's developer tools and call `setName`, you will once again hit the
breakpoint.
### Further Reading
LLDB is a powerful tool with a great documentation. To learn more about it, consider
Apple's debugging documentation, for instance the [LLDB Command Structure Reference][lldb-command-structure]
or the introduction to [Using LLDB as a Standalone Debugger][lldb-standalone].
You can also check out LLDB's fantastic [manual and tutorial][lldb-tutorial], which
will explain more complex debugging scenarios.
[lldb-command-structure]: https://developer.apple.com/library/mac/documentation/IDEs/Conceptual/gdb_to_lldb_transition_guide/document/lldb-basics.html#//apple_ref/doc/uid/TP40012917-CH2-SW2
[lldb-standalone]: https://developer.apple.com/library/mac/documentation/IDEs/Conceptual/gdb_to_lldb_transition_guide/document/lldb-terminal-workflow-tutorial.html
[lldb-tutorial]: http://lldb.llvm.org/tutorial.html

View file

@ -1,101 +0,0 @@
# Releasing
This document describes the process for releasing a new version of Electron.
## Compile release notes
The current process is to maintain a local file, keeping track of notable changes as pull requests are merged. For examples of how to format the notes, see previous releases on [the releases page].
## Create a temporary branch
Create a new branch from `master` named `release`.
```sh
git checkout master
git pull
git checkout -b release
```
This branch is created as a precaution to prevent any merged PRs from sneaking into a release between the time the temporary release branch is created and the CI builds are complete.
## Bump the version
Run the `bump-version` script, passing `major`, `minor`, or `patch` as an argument:
```sh
npm run bump-version -- patch
git push origin HEAD
```
This will bump the version number in several files. See [this bump commit] for an example.
Most releases will be `patch` level. Upgrades to Chrome or other major changes should use `minor`. For more info, see [electron-versioning].
## Edit the release draft
1. Visit [the releases page] and you'll see a new draft release with placeholder release notes.
1. Edit the release and add release notes.
1. Click 'Save draft'. **Do not click 'Publish release'!**
1. Wait for all the builds to pass. :hourglass_flowing_sand:
## Merge temporary branch
Merge the temporary back into master, without creating a merge commit:
```sh
git merge release master --no-commit
git push origin master
```
If this fails, rebase with master and rebuild:
```sh
git pull
git checkout release
git rebase master
git push origin HEAD
```
## Run local debug build
Run local debug build to verify that you are actually building the version you want. Sometimes you thought you were doing a release for a new version, but you're actually not.
```sh
npm run build
npm start
```
Verify the window is displaying the current updated version.
## Set environment variables
You'll need to set the following environment variables to publish a release. Ask another team member for these credentials.
- `ELECTRON_S3_BUCKET`
- `ELECTRON_S3_ACCESS_KEY`
- `ELECTRON_S3_SECRET_KEY`
- `ELECTRON_GITHUB_TOKEN` - A personal access token with "repo" scope.
You will only need to do this once.
## Publish the release
This script will download the binaries and generate the node headers and the .lib linker used on Windows by node-gyp to build native modules.
```sh
npm run release
```
Note: Many distributions of Python still ship with old HTTPS certificates. You may see a `InsecureRequestWarning`, but it can be disregarded.
## Delete the temporary branch
```sh
git checkout master
git branch -D release # delete local branch
git push origin :release # delete remote branch
```
[the releases page]: https://github.com/electron/electron/releases
[this bump commit]: https://github.com/electron/electron/commit/78ec1b8f89b3886b856377a1756a51617bc33f5a
[electron-versioning]: /docs/tutorial/electron-versioning.md

View file

@ -1,56 +0,0 @@
# Setting Up Symbol Server in Debugger
Debug symbols allow you to have better debugging sessions. They have information
about the functions contained in executables and dynamic libraries and provide
you with information to get clean call stacks. A Symbol Server allows the
debugger to load the correct symbols, binaries and sources automatically without
forcing users to download large debugging files. The server functions like
[Microsoft's symbol server](http://support.microsoft.com/kb/311503) so the
documentation there can be useful.
Note that because released Electron builds are heavily optimized, debugging is
not always easy. The debugger will not be able to show you the content of all
variables and the execution path can seem strange because of inlining, tail
calls, and other compiler optimizations. The only workaround is to build an
unoptimized local build.
The official symbol server URL for Electron is
https://electron-symbols.githubapp.com.
You cannot visit this URL directly, you must add it to the symbol path of your
debugging tool. In the examples below, a local cache directory is used to avoid
repeatedly fetching the PDB from the server. Replace `c:\code\symbols` with an
appropriate cache directory on your machine.
## Using the Symbol Server in Windbg
The Windbg symbol path is configured with a string value delimited with asterisk
characters. To use only the Electron symbol server, add the following entry to
your symbol path (**Note:** you can replace `c:\code\symbols` with any writable
directory on your computer, if you'd prefer a different location for downloaded
symbols):
```
SRV*c:\code\symbols\*https://electron-symbols.githubapp.com
```
Set this string as `_NT_SYMBOL_PATH` in the environment, using the Windbg menus,
or by typing the `.sympath` command. If you would like to get symbols from
Microsoft's symbol server as well, you should list that first:
```
SRV*c:\code\symbols\*http://msdl.microsoft.com/download/symbols;SRV*c:\code\symbols\*https://electron-symbols.githubapp.com
```
## Using the symbol server in Visual Studio
<img src='http://mdn.mozillademos.org/files/733/symbol-server-vc8express-menu.jpg'>
<img src='http://mdn.mozillademos.org/files/2497/2005_options.gif'>
## Troubleshooting: Symbols will not load
Type the following commands in Windbg to print why symbols are not loading:
```
> !sym noisy
> .reload /f electron.exe
```

View file

@ -1,93 +0,0 @@
# Source Code Directory Structure
The source code of Electron is separated into a few parts, mostly
following Chromium on the separation conventions.
You may need to become familiar with [Chromium's multi-process
architecture](http://dev.chromium.org/developers/design-documents/multi-process-architecture)
to understand the source code better.
## Structure of Source Code
```
Electron
├── atom/ - C++ source code.
| ├── app/ - System entry code.
| ├── browser/ - The frontend including the main window, UI, and all of the
| | main process things. This talks to the renderer to manage web pages.
| | ├── ui/ - Implementation of UI stuff for different platforms.
| | | ├── cocoa/ - Cocoa specific source code.
| | | ├── win/ - Windows GUI specific source code.
| | | └── x/ - X11 specific source code.
| | ├── api/ - The implementation of the main process APIs.
| | ├── net/ - Network related code.
| | ├── mac/ - Mac specific Objective-C source code.
| | └── resources/ - Icons, platform-dependent files, etc.
| ├── renderer/ - Code that runs in renderer process.
| | └── api/ - The implementation of renderer process APIs.
| └── common/ - Code that used by both the main and renderer processes,
| including some utility functions and code to integrate node's message
| loop into Chromium's message loop.
| └── api/ - The implementation of common APIs, and foundations of
| Electron's built-in modules.
├── chromium_src/ - Source code that copied from Chromium.
├── default_app/ - The default page to show when Electron is started without
| providing an app.
├── docs/ - Documentations.
├── lib/ - JavaScript source code.
| ├── browser/ - Javascript main process initialization code.
| | └── api/ - Javascript API implementation.
| ├── common/ - JavaScript used by both the main and renderer processes
| | └── api/ - Javascript API implementation.
| └── renderer/ - Javascript renderer process initialization code.
| └── api/ - Javascript API implementation.
├── spec/ - Automatic tests.
├── electron.gyp - Building rules of Electron.
└── common.gypi - Compiler specific settings and building rules for other
components like `node` and `breakpad`.
```
## Structure of Other Directories
* **script** - Scripts used for development purpose like building, packaging,
testing, etc.
* **tools** - Helper scripts used by gyp files, unlike `script`, scripts put
here should never be invoked by users directly.
* **vendor** - Source code of third party dependencies, we didn't use
`third_party` as name because it would confuse it with the same directory in
Chromium's source code tree.
* **node_modules** - Third party node modules used for building.
* **out** - Temporary output directory of `ninja`.
* **dist** - Temporary directory created by `script/create-dist.py` script
when creating a distribution.
* **external_binaries** - Downloaded binaries of third-party frameworks which
do not support building with `gyp`.
## Keeping Git Submodules Up to Date
The Electron repository has a few vendored dependencies, found in the
[/vendor][vendor] directory. Occasionally you might see a message like this
when running `git status`:
```sh
$ git status
modified: vendor/brightray (new commits)
modified: vendor/node (new commits)
```
To update these vendored dependencies, run the following command:
```sh
git submodule update --init --recursive
```
If you find yourself running this command often, you can create an alias for it
in your `~/.gitconfig` file:
```
[alias]
su = submodule update --init --recursive
```
[vendor]: https://github.com/electron/electron/tree/master/vendor

View file

@ -1,176 +0,0 @@
# Application Distribution
To distribute your app with Electron, you need to download Electron's [prebuilt
binaries](https://github.com/electron/electron/releases). Next, the folder
containing your app should be named `app` and placed in Electron's resources
directory as shown in the following examples. Note that the location of
Electron's prebuilt binaries is indicated with `electron/` in the examples
below.
On macOS:
```text
electron/Electron.app/Contents/Resources/app/
├── package.json
├── main.js
└── index.html
```
On Windows and Linux:
```text
electron/resources/app
├── package.json
├── main.js
└── index.html
```
Then execute `Electron.app` (or `electron` on Linux, `electron.exe` on Windows),
and Electron will start as your app. The `electron` directory will then be
your distribution to deliver to final users.
## Packaging Your App into a File
Apart from shipping your app by copying all of its source files, you can also
package your app into an [asar](https://github.com/electron/asar) archive to avoid
exposing your app's source code to users.
To use an `asar` archive to replace the `app` folder, you need to rename the
archive to `app.asar`, and put it under Electron's resources directory like
below, and Electron will then try to read the archive and start from it.
On macOS:
```text
electron/Electron.app/Contents/Resources/
└── app.asar
```
On Windows and Linux:
```text
electron/resources/
└── app.asar
```
More details can be found in [Application packaging](application-packaging.md).
## Rebranding with Downloaded Binaries
After bundling your app into Electron, you will want to rebrand Electron
before distributing it to users.
### Windows
You can rename `electron.exe` to any name you like, and edit its icon and other
information with tools like [rcedit](https://github.com/atom/rcedit).
### macOS
You can rename `Electron.app` to any name you want, and you also have to rename
the `CFBundleDisplayName`, `CFBundleIdentifier` and `CFBundleName` fields in the
following files:
* `Electron.app/Contents/Info.plist`
* `Electron.app/Contents/Frameworks/Electron Helper.app/Contents/Info.plist`
You can also rename the helper app to avoid showing `Electron Helper` in the
Activity Monitor, but make sure you have renamed the helper app's executable
file's name.
The structure of a renamed app would be like:
```
MyApp.app/Contents
├── Info.plist
├── MacOS/
│   └── MyApp
└── Frameworks/
├── MyApp Helper EH.app
| ├── Info.plist
| └── MacOS/
|    └── MyApp Helper EH
├── MyApp Helper NP.app
| ├── Info.plist
| └── MacOS/
|    └── MyApp Helper NP
└── MyApp Helper.app
├── Info.plist
└── MacOS/
   └── MyApp Helper
```
### Linux
You can rename the `electron` executable to any name you like.
## Packaging Tools
Apart from packaging your app manually, you can also choose to use third party
packaging tools to do the work for you:
* [electron-builder](https://github.com/electron-userland/electron-builder)
* [electron-packager](https://github.com/electron-userland/electron-packager)
## Rebranding by Rebuilding Electron from Source
It is also possible to rebrand Electron by changing the product name and
building it from source. To do this you need to modify the `atom.gyp` file and
have a clean rebuild.
### grunt-build-atom-shell
Manually checking out Electron's code and rebuilding could be complicated, so
a Grunt task has been created that will handle this automatically:
[grunt-build-atom-shell](https://github.com/paulcbetts/grunt-build-atom-shell).
This task will automatically handle editing the `.gyp` file, building from
source, then rebuilding your app's native Node modules to match the new
executable name.
### Creating a Custom Electron Fork
Creating a custom fork of Electron is almost certainly not something you will
need to do in order to build your app, even for "Production Level" applications.
Using a tool such as `electron-packager` or `electron-builder` will allow you to
"Rebrand" Electron without having to do these steps.
You need to fork Electron when you have custom C++ code that you have patched
directly into Electron, that either cannot be upstreamed, or has been rejected
from the official version. As maintainers of Electron, we very much would like
to make your scenario work, so please try as hard as you can to get your changes
into the official version of Electron, it will be much much easier on you, and
we appreciate your help.
#### Creating a Custom Release with surf-build
1. Install [Surf](https://github.com/surf-build/surf), via npm:
`npm install -g surf-build@latest`
2. Create a new S3 bucket and create the following empty directory structure:
```
- atom-shell/
- symbols/
- dist/
```
3. Set the following Environment Variables:
* `ELECTRON_GITHUB_TOKEN` - a token that can create releases on GitHub
* `ELECTRON_S3_ACCESS_KEY`, `ELECTRON_S3_BUCKET`, `ELECTRON_S3_SECRET_KEY` -
the place where you'll upload node.js headers as well as symbols
* `ELECTRON_RELEASE` - Set to `true` and the upload part will run, leave unset
and `surf-build` will just do CI-type checks, appropriate to run for every
pull request.
* `CI` - Set to `true` or else it will fail
* `GITHUB_TOKEN` - set it to the same as `ELECTRON_GITHUB_TOKEN`
* `SURF_TEMP` - set to `C:\Temp` on Windows to prevent path too long issues
* `TARGET_ARCH` - set to `ia32` or `x64`
4. In `script/upload.py`, you _must_ set `ELECTRON_REPO` to your fork (`MYORG/electron`),
especially if you are a contributor to Electron proper.
5. `surf-build -r https://github.com/MYORG/electron -s YOUR_COMMIT -n 'surf-PLATFORM-ARCH'`
6. Wait a very, very long time for the build to complete.

View file

@ -1,185 +0,0 @@
# Application Packaging
To mitigate [issues](https://github.com/joyent/node/issues/6960) around long
path names on Windows, slightly speed up `require` and conceal your source code
from cursory inspection, you can choose to package your app into an [asar][asar]
archive with little changes to your source code.
## Generating `asar` Archive
An [asar][asar] archive is a simple tar-like format that concatenates files
into a single file. Electron can read arbitrary files from it without unpacking
the whole file.
Steps to package your app into an `asar` archive:
### 1. Install the asar Utility
```bash
$ npm install -g asar
```
### 2. Package with `asar pack`
```bash
$ asar pack your-app app.asar
```
## Using `asar` Archives
In Electron there are two sets of APIs: Node APIs provided by Node.js and Web
APIs provided by Chromium. Both APIs support reading files from `asar` archives.
### Node API
With special patches in Electron, Node APIs like `fs.readFile` and `require`
treat `asar` archives as virtual directories, and the files in it as normal
files in the filesystem.
For example, suppose we have an `example.asar` archive under `/path/to`:
```bash
$ asar list /path/to/example.asar
/app.js
/file.txt
/dir/module.js
/static/index.html
/static/main.css
/static/jquery.min.js
```
Read a file in the `asar` archive:
```javascript
const fs = require('fs')
fs.readFileSync('/path/to/example.asar/file.txt')
```
List all files under the root of the archive:
```javascript
const fs = require('fs')
fs.readdirSync('/path/to/example.asar')
```
Use a module from the archive:
```javascript
require('/path/to/example.asar/dir/module.js')
```
You can also display a web page in an `asar` archive with `BrowserWindow`:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow({width: 800, height: 600})
win.loadURL('file:///path/to/example.asar/static/index.html')
```
### Web API
In a web page, files in an archive can be requested with the `file:` protocol.
Like the Node API, `asar` archives are treated as directories.
For example, to get a file with `$.get`:
```html
<script>
let $ = require('./jquery.min.js')
$.get('file:///path/to/example.asar/file.txt', (data) => {
console.log(data)
})
</script>
```
### Treating an `asar` Archive as a Normal File
For some cases like verifying the `asar` archive's checksum, we need to read the
content of an `asar` archive as a file. For this purpose you can use the built-in
`original-fs` module which provides original `fs` APIs without `asar` support:
```javascript
const originalFs = require('original-fs')
originalFs.readFileSync('/path/to/example.asar')
```
You can also set `process.noAsar` to `true` to disable the support for `asar` in
the `fs` module:
```javascript
const fs = require('fs')
process.noAsar = true
fs.readFileSync('/path/to/example.asar')
```
## Limitations of the Node API
Even though we tried hard to make `asar` archives in the Node API work like
directories as much as possible, there are still limitations due to the
low-level nature of the Node API.
### Archives Are Read-only
The archives can not be modified so all Node APIs that can modify files will not
work with `asar` archives.
### Working Directory Can Not Be Set to Directories in Archive
Though `asar` archives are treated as directories, there are no actual
directories in the filesystem, so you can never set the working directory to
directories in `asar` archives. Passing them as the `cwd` option of some APIs
will also cause errors.
### Extra Unpacking on Some APIs
Most `fs` APIs can read a file or get a file's information from `asar` archives
without unpacking, but for some APIs that rely on passing the real file path to
underlying system calls, Electron will extract the needed file into a
temporary file and pass the path of the temporary file to the APIs to make them
work. This adds a little overhead for those APIs.
APIs that requires extra unpacking are:
* `child_process.execFile`
* `child_process.execFileSync`
* `fs.open`
* `fs.openSync`
* `process.dlopen` - Used by `require` on native modules
### Fake Stat Information of `fs.stat`
The `Stats` object returned by `fs.stat` and its friends on files in `asar`
archives is generated by guessing, because those files do not exist on the
filesystem. So you should not trust the `Stats` object except for getting file
size and checking file type.
### Executing Binaries Inside `asar` Archive
There are Node APIs that can execute binaries like `child_process.exec`,
`child_process.spawn` and `child_process.execFile`, but only `execFile` is
supported to execute binaries inside `asar` archive.
This is because `exec` and `spawn` accept `command` instead of `file` as input,
and `command`s are executed under shell. There is no reliable way to determine
whether a command uses a file in asar archive, and even if we do, we can not be
sure whether we can replace the path in command without side effects.
## Adding Unpacked Files in `asar` Archive
As stated above, some Node APIs will unpack the file to filesystem when
calling, apart from the performance issues, it could also lead to false alerts
of virus scanners.
To work around this, you can unpack some files creating archives by using the
`--unpack` option, an example of excluding shared libraries of native modules
is:
```bash
$ asar pack app app.asar --unpack *.node
```
After running the command, apart from the `app.asar`, there is also an
`app.asar.unpacked` folder generated which contains the unpacked files, you
should copy it together with `app.asar` when shipping it to users.
[asar]: https://github.com/electron/asar

View file

@ -1,131 +0,0 @@
# Debugging the Main Process in node-inspector
[`node-inspector`][node-inspector] provides a familiar DevTools GUI that can
be used in Chrome to debug Electron's main process, however, because
`node-inspector` relies on some native Node modules they must be rebuilt to
target the version of Electron you wish to debug. You can either rebuild
the `node-inspector` dependencies yourself, or let
[`electron-inspector`][electron-inspector] do it for you, both approaches are
covered in this document.
**Note**: At the time of writing the latest release of `node-inspector`
(0.12.8) can't be rebuilt to target Electron 1.3.0 or later without patching
one of its dependencies. If you use `electron-inspector` it will take care of
this for you.
## Use `electron-inspector` for Debugging
### 1. Install the [node-gyp required tools][node-gyp-required-tools]
### 2. Install [`electron-rebuild`][electron-rebuild], if you haven't done so already.
```shell
npm install electron-rebuild --save-dev
```
### 3. Install [`electron-inspector`][electron-inspector]
```shell
npm install electron-inspector --save-dev
```
### 4. Start Electron
Launch Electron with the `--debug` switch:
```shell
electron --debug=5858 your/app
```
or, to pause execution on the first line of JavaScript:
```shell
electron --debug-brk=5858 your/app
```
### 5. Start electron-inspector
On macOS / Linux:
```shell
node_modules/.bin/electron-inspector
```
On Windows:
```shell
node_modules\\.bin\\electron-inspector
```
`electron-inspector` will need to rebuild `node-inspector` dependencies on the
first run, and any time you change your Electron version. The rebuild process
may require an internet connection to download Node headers and libs, and may
take a few minutes.
### 6. Load the debugger UI
Open http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858 in the Chrome
browser. You may have to click pause if starting with `--debug-brk` to force
the UI to update.
## Use `node-inspector` for Debugging
### 1. Install the [node-gyp required tools][node-gyp-required-tools]
### 2. Install [`node-inspector`][node-inspector]
```bash
$ npm install node-inspector
```
### 3. Install [`node-pre-gyp`][node-pre-gyp]
```bash
$ npm install node-pre-gyp
```
### 4. Recompile the `node-inspector` `v8` modules for Electron
**Note:** Update the target argument to be your Electron version number
```bash
$ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-debug/ --dist-url=https://atom.io/download/atom-shell reinstall
$ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-profiler/ --dist-url=https://atom.io/download/atom-shell reinstall
```
See also [How to install native modules][how-to-install-native-modules].
### 5. Enable debug mode for Electron
You can either start Electron with a debug flag like:
```bash
$ electron --debug=5858 your/app
```
or, to pause your script on the first line:
```bash
$ electron --debug-brk=5858 your/app
```
### 6. Start the [`node-inspector`][node-inspector] server using Electron
```bash
$ ELECTRON_RUN_AS_NODE=true path/to/electron.exe node_modules/node-inspector/bin/inspector.js
```
### 7. Load the debugger UI
Open http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858 in the Chrome
browser. You may have to click pause if starting with `--debug-brk` to see the
entry line.
[electron-inspector]: https://github.com/enlight/electron-inspector
[electron-rebuild]: https://github.com/electron/electron-rebuild
[node-inspector]: https://github.com/node-inspector/node-inspector
[node-pre-gyp]: https://github.com/mapbox/node-pre-gyp
[node-gyp-required-tools]: https://github.com/nodejs/node-gyp#installation
[how-to-install-native-modules]: using-native-node-modules.md#how-to-install-native-modules

View file

@ -1,34 +0,0 @@
# Debugging the Main Process in VSCode
### 1. Open an Electron project in VSCode.
```bash
$ git clone git@github.com:electron/electron-quick-start.git
$ code electron-quick-start
```
### 2. Add a file `.vscode/launch.json` with the following configuration:
```json
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug Main Process",
"type": "node",
"request": "launch",
"cwd": "${workspaceRoot}",
"runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
"program": "${workspaceRoot}/main.js"
}
]
}
```
**Note:** For Windows, use `"${workspaceRoot}/node_modules/.bin/electron.cmd"` for `runtimeExecutable`.
### 3. Debugging
Set some breakpoints in `main.js`, and start debugging in the [Debug View](https://code.visualstudio.com/docs/editor/debugging). You should be able to hit the breakpoints.
Here is a pre-configured project that you can download and directly debug in VSCode: https://github.com/octref/vscode-electron-debug/tree/master/electron-quick-start

View file

@ -1,33 +0,0 @@
# Debugging the Main Process
The DevTools in an Electron browser window can only debug JavaScript that's
executed in that window (i.e. the web pages). To debug JavaScript that's
executed in the main process you will need to use an external debugger and
launch Electron with the `--debug` or `--debug-brk` switch.
## Command Line Switches
Use one of the following command line switches to enable debugging of the main
process:
### `--debug=[port]`
Electron will listen for V8 debugger protocol messages on the specified `port`,
an external debugger will need to connect on this port. The default `port` is
`5858`.
```shell
electron --debug=5858 your/app
```
### `--debug-brk=[port]`
Like `--debug` but pauses execution on the first line of JavaScript.
## External Debuggers
You will need to use a debugger that supports the V8 debugger protocol,
the following guides should help you to get started:
- [Debugging the Main Process in VSCode](debugging-main-process-vscode.md)
- [Debugging the Main Process in node-inspector](debugging-main-process-node-inspector.md)

View file

@ -1,399 +0,0 @@
# Desktop Environment Integration
Different operating systems provide different features for integrating desktop
applications into their desktop environments. For example, on Windows,
applications can put shortcuts in the JumpList of task bar, and on Mac,
applications can put a custom menu in the dock menu.
This guide explains how to integrate your application into those desktop
environments with Electron APIs.
## Notifications (Windows, Linux, macOS)
All three operating systems provide means for applications to send notifications
to the user. Electron conveniently allows developers to send notifications with
the [HTML5 Notification API](https://notifications.spec.whatwg.org/), using
the currently running operating system's native notification APIs to display it.
**Note:** Since this is an HTML5 API it is only available in the renderer process.
```javascript
let myNotification = new Notification('Title', {
body: 'Lorem Ipsum Dolor Sit Amet'
})
myNotification.onclick = () => {
console.log('Notification clicked')
}
```
While code and user experience across operating systems are similar, there
are fine differences.
### Windows
* On Windows 10, notifications "just work".
* On Windows 8.1 and Windows 8, a shortcut to your app, with a [Application User
Model ID][app-user-model-id], must be installed to the Start screen. Note,
however, that it does not need to be pinned to the Start screen.
* On Windows 7, notifications are not supported. You can however send
"balloon notifications" using the [Tray API][tray-balloon].
Furthermore, the maximum length for the notification body is 250 characters,
with the Windows team recommending that notifications should be kept to 200
characters.
### Linux
Notifications are sent using `libnotify`, it can show notifications on any
desktop environment that follows [Desktop Notifications
Specification][notification-spec], including Cinnamon, Enlightenment, Unity,
GNOME, KDE.
### macOS
Notifications are straight-forward on macOS, you should however be aware of
[Apple's Human Interface guidelines regarding notifications](https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/OSXHIGuidelines/NotificationCenter.html).
Note that notifications are limited to 256 bytes in size - and will be truncated
if you exceed that limit.
## Recent documents (Windows & macOS)
Windows and macOS provide easy access to a list of recent documents opened by
the application via JumpList or dock menu, respectively.
__JumpList:__
![JumpList Recent Files](http://i.msdn.microsoft.com/dynimg/IC420538.png)
__Application dock menu:__
<img src="https://cloud.githubusercontent.com/assets/639601/5069610/2aa80758-6e97-11e4-8cfb-c1a414a10774.png" height="353" width="428" >
To add a file to recent documents, you can use the
[app.addRecentDocument][addrecentdocument] API:
```javascript
const {app} = require('electron')
app.addRecentDocument('/Users/USERNAME/Desktop/work.type')
```
And you can use [app.clearRecentDocuments][clearrecentdocuments] API to empty
the recent documents list:
```javascript
const {app} = require('electron')
app.clearRecentDocuments()
```
### Windows Notes
In order to be able to use this feature on Windows, your application has to be
registered as a handler of the file type of the document, otherwise the file
won't appear in JumpList even after you have added it. You can find everything
on registering your application in [Application Registration][app-registration].
When a user clicks a file from the JumpList, a new instance of your application
will be started with the path of the file added as a command line argument.
### macOS Notes
When a file is requested from the recent documents menu, the `open-file` event
of `app` module will be emitted for it.
## Custom Dock Menu (macOS)
macOS enables developers to specify a custom menu for the dock, which usually
contains some shortcuts for commonly used features of your application:
__Dock menu of Terminal.app:__
<img src="https://cloud.githubusercontent.com/assets/639601/5069962/6032658a-6e9c-11e4-9953-aa84006bdfff.png" height="354" width="341" >
To set your custom dock menu, you can use the `app.dock.setMenu` API, which is
only available on macOS:
```javascript
const {app, Menu} = require('electron')
const dockMenu = Menu.buildFromTemplate([
{label: 'New Window', click () { console.log('New Window') }},
{label: 'New Window with Settings',
submenu: [
{label: 'Basic'},
{label: 'Pro'}
]
},
{label: 'New Command...'}
])
app.dock.setMenu(dockMenu)
```
## User Tasks (Windows)
On Windows you can specify custom actions in the `Tasks` category of JumpList,
as quoted from MSDN:
> Applications define tasks based on both the program's features and the key
> things a user is expected to do with them. Tasks should be context-free, in
> that the application does not need to be running for them to work. They
> should also be the statistically most common actions that a normal user would
> perform in an application, such as compose an email message or open the
> calendar in a mail program, create a new document in a word processor, launch
> an application in a certain mode, or launch one of its subcommands. An
> application should not clutter the menu with advanced features that standard
> users won't need or one-time actions such as registration. Do not use tasks
> for promotional items such as upgrades or special offers.
>
> It is strongly recommended that the task list be static. It should remain the
> same regardless of the state or status of the application. While it is
> possible to vary the list dynamically, you should consider that this could
> confuse the user who does not expect that portion of the destination list to
> change.
__Tasks of Internet Explorer:__
![IE](http://i.msdn.microsoft.com/dynimg/IC420539.png)
Unlike the dock menu in macOS which is a real menu, user tasks in Windows work
like application shortcuts such that when user clicks a task, a program will be
executed with specified arguments.
To set user tasks for your application, you can use
[app.setUserTasks][setusertaskstasks] API:
```javascript
const {app} = require('electron')
app.setUserTasks([
{
program: process.execPath,
arguments: '--new-window',
iconPath: process.execPath,
iconIndex: 0,
title: 'New Window',
description: 'Create a new window'
}
])
```
To clean your tasks list, just call `app.setUserTasks` with an empty array:
```javascript
const {app} = require('electron')
app.setUserTasks([])
```
The user tasks will still show even after your application closes, so the icon
and program path specified for a task should exist until your application is
uninstalled.
## Thumbnail Toolbars
On Windows you can add a thumbnail toolbar with specified buttons in a taskbar
layout of an application window. It provides users a way to access to a
particular window's command without restoring or activating the window.
From MSDN, it's illustrated:
> This toolbar is simply the familiar standard toolbar common control. It has a
> maximum of seven buttons. Each button's ID, image, tooltip, and state are defined
> in a structure, which is then passed to the taskbar. The application can show,
> enable, disable, or hide buttons from the thumbnail toolbar as required by its
> current state.
>
> For example, Windows Media Player might offer standard media transport controls
> such as play, pause, mute, and stop.
__Thumbnail toolbar of Windows Media Player:__
![player](https://i-msdn.sec.s-msft.com/dynimg/IC420540.png)
You can use [BrowserWindow.setThumbarButtons][setthumbarbuttons] to set
thumbnail toolbar in your application:
```javascript
const {BrowserWindow} = require('electron')
const path = require('path')
let win = new BrowserWindow({
width: 800,
height: 600
})
win.setThumbarButtons([
{
tooltip: 'button1',
icon: path.join(__dirname, 'button1.png'),
click () { console.log('button1 clicked') }
},
{
tooltip: 'button2',
icon: path.join(__dirname, 'button2.png'),
flags: ['enabled', 'dismissonclick'],
click () { console.log('button2 clicked.') }
}
])
```
To clean thumbnail toolbar buttons, just call `BrowserWindow.setThumbarButtons`
with an empty array:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.setThumbarButtons([])
```
## Unity Launcher Shortcuts (Linux)
In Unity, you can add custom entries to its launcher via modifying the
`.desktop` file, see [Adding Shortcuts to a Launcher][unity-launcher].
__Launcher shortcuts of Audacious:__
![audacious](https://help.ubuntu.com/community/UnityLaunchersAndDesktopFiles?action=AttachFile&do=get&target=shortcuts.png)
## Progress Bar in Taskbar (Windows, macOS, Unity)
On Windows a taskbar button can be used to display a progress bar. This enables
a window to provide progress information to the user without the user having to
switch to the window itself.
On macOS the progress bar will be displayed as a part of the dock icon.
The Unity DE also has a similar feature that allows you to specify the progress
bar in the launcher.
__Progress bar in taskbar button:__
![Taskbar Progress Bar](https://cloud.githubusercontent.com/assets/639601/5081682/16691fda-6f0e-11e4-9676-49b6418f1264.png)
To set the progress bar for a Window, you can use the
[BrowserWindow.setProgressBar][setprogressbar] API:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.setProgressBar(0.5)
```
## Icon Overlays in Taskbar (Windows)
On Windows a taskbar button can use a small overlay to display application
status, as quoted from MSDN:
> Icon overlays serve as a contextual notification of status, and are intended
> to negate the need for a separate notification area status icon to communicate
> that information to the user. For instance, the new mail status in Microsoft
> Outlook, currently shown in the notification area, can now be indicated
> through an overlay on the taskbar button. Again, you must decide during your
> development cycle which method is best for your application. Overlay icons are
> intended to supply important, long-standing status or notifications such as
> network status, messenger status, or new mail. The user should not be
> presented with constantly changing overlays or animations.
__Overlay on taskbar button:__
![Overlay on taskbar button](https://i-msdn.sec.s-msft.com/dynimg/IC420441.png)
To set the overlay icon for a window, you can use the
[BrowserWindow.setOverlayIcon][setoverlayicon] API:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.setOverlayIcon('path/to/overlay.png', 'Description for overlay')
```
## Flash Frame (Windows)
On Windows you can highlight the taskbar button to get the user's attention.
This is similar to bouncing the dock icon on macOS.
From the MSDN reference documentation:
> Typically, a window is flashed to inform the user that the window requires
> attention but that it does not currently have the keyboard focus.
To flash the BrowserWindow taskbar button, you can use the
[BrowserWindow.flashFrame][flashframe] API:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.once('focus', () => win.flashFrame(false))
win.flashFrame(true)
```
Don't forget to call the `flashFrame` method with `false` to turn off the flash. In
the above example, it is called when the window comes into focus, but you might
use a timeout or some other event to disable it.
## Represented File of Window (macOS)
On macOS a window can set its represented file, so the file's icon can show in
the title bar and when users Command-Click or Control-Click on the title a path
popup will show.
You can also set the edited state of a window so that the file icon can indicate
whether the document in this window has been modified.
__Represented file popup menu:__
<img src="https://cloud.githubusercontent.com/assets/639601/5082061/670a949a-6f14-11e4-987a-9aaa04b23c1d.png" height="232" width="663" >
To set the represented file of window, you can use the
[BrowserWindow.setRepresentedFilename][setrepresentedfilename] and
[BrowserWindow.setDocumentEdited][setdocumentedited] APIs:
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.setRepresentedFilename('/etc/passwd')
win.setDocumentEdited(true)
```
## Dragging files out of the window
For certain kinds of apps that manipulate on files, it is important to be able
to drag files from Electron to other apps. To implement this feature in your
app, you need to call `webContents.startDrag(item)` API on `ondragstart` event.
In web page:
```html
<a href="#" id="drag">item</a>
<script type="text/javascript" charset="utf-8">
document.getElementById('drag').ondragstart = (event) => {
event.preventDefault()
ipcRenderer.send('ondragstart', '/path/to/item')
}
</script>
```
In the main process:
```javascript
const {ipcMain} = require('electron')
ipcMain.on('ondragstart', (event, filePath) => {
event.sender.startDrag({
file: filePath,
icon: '/path/to/icon.png'
})
})
```
[addrecentdocument]: ../api/app.md#appaddrecentdocumentpath-os-x-windows
[clearrecentdocuments]: ../api/app.md#appclearrecentdocuments-os-x-windows
[setusertaskstasks]: ../api/app.md#appsetusertaskstasks-windows
[setprogressbar]: ../api/browser-window.md#winsetprogressbarprogress
[setoverlayicon]: ../api/browser-window.md#winsetoverlayiconoverlay-description-windows-7
[setrepresentedfilename]: ../api/browser-window.md#winsetrepresentedfilenamefilename-os-x
[setdocumentedited]: ../api/browser-window.md#winsetdocumenteditededited-os-x
[app-registration]: http://msdn.microsoft.com/en-us/library/windows/desktop/ee872121(v=vs.85).aspx
[unity-launcher]: https://help.ubuntu.com/community/UnityLaunchersAndDesktopFiles#Adding_shortcuts_to_a_launcher
[setthumbarbuttons]: ../api/browser-window.md#winsetthumbarbuttonsbuttons-windows-7
[tray-balloon]: ../api/tray.md#traydisplayballoonoptions-windows
[app-user-model-id]: https://msdn.microsoft.com/en-us/library/windows/desktop/dd378459(v=vs.85).aspx
[notification-spec]: https://developer.gnome.org/notification-spec/
[flashframe]: ../api/browser-window.md#winflashframeflag

View file

@ -1,66 +0,0 @@
# DevTools Extension
Electron supports the [Chrome DevTools Extension][devtools-extension], which can
be used to extend the ability of devtools for debugging popular web frameworks.
## How to load a DevTools Extension
This document outlines the process for manually loading an extension.
You may also try
[electron-devtools-installer](https://github.com/GPMDP/electron-devtools-installer),
a third-party tool that downloads extensions directly from the Chrome WebStore.
To load an extension in Electron, you need to download it in Chrome browser,
locate its filesystem path, and then load it by calling the
`BrowserWindow.addDevToolsExtension(extension)` API.
Using the [React Developer Tools][react-devtools] as example:
1. Install it in Chrome browser.
1. Navigate to `chrome://extensions`, and find its extension ID, which is a hash
string like `fmkadmapgofadopljbjfkapdkoienihi`.
1. Find out filesystem location used by Chrome for storing extensions:
* on Windows it is `%LOCALAPPDATA%\Google\Chrome\User Data\Default\Extensions`;
* on Linux it could be:
* `~/.config/google-chrome/Default/Extensions/`
* `~/.config/google-chrome-beta/Default/Extensions/`
* `~/.config/google-chrome-canary/Default/Extensions/`
* `~/.config/chromium/Default/Extensions/`
* on macOS it is `~/Library/Application Support/Google/Chrome/Default/Extensions`.
1. Pass the location of the extension to `BrowserWindow.addDevToolsExtension`
API, for the React Developer Tools, it is something like:
`~/Library/Application Support/Google/Chrome/Default/Extensions/fmkadmapgofadopljbjfkapdkoienihi/0.15.0_0`
**Note:** The `BrowserWindow.addDevToolsExtension` API cannot be called before the
ready event of the app module is emitted.
The name of the extension is returned by `BrowserWindow.addDevToolsExtension`,
and you can pass the name of the extension to the `BrowserWindow.removeDevToolsExtension`
API to unload it.
## Supported DevTools Extensions
Electron only supports a limited set of `chrome.*` APIs, so some extensions
using unsupported `chrome.*` APIs for chrome extension features may not work.
Following Devtools Extensions are tested and guaranteed to work in Electron:
* [Ember Inspector](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi)
* [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi)
* [Backbone Debugger](https://chrome.google.com/webstore/detail/backbone-debugger/bhljhndlimiafopmmhjlgfpnnchjjbhd)
* [jQuery Debugger](https://chrome.google.com/webstore/detail/jquery-debugger/dbhhnnnpaeobfddmlalhnehgclcmjimi)
* [AngularJS Batarang](https://chrome.google.com/webstore/detail/angularjs-batarang/ighdmehidhipcmcojjgiloacoafjmpfk)
* [Vue.js devtools](https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd)
* [Cerebral Debugger](http://www.cerebraljs.com/documentation/the_debugger)
* [Redux DevTools Extension](https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd)
### What should I do if a DevTools Extension is not working?
First please make sure the extension is still being maintained, some extensions
can not even work for recent versions of Chrome browser, and we are not able to
do anything for them.
Then file a bug at Electron's issues list, and describe which part of the
extension is not working as expected.
[devtools-extension]: https://developer.chrome.com/extensions/devtools
[react-devtools]: https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi

View file

@ -1,21 +0,0 @@
# Electron Versioning
If you are a seasoned Node developer, you are surely aware of `semver` - and
might be used to giving your dependency management systems only rough guidelines
rather than fixed version numbers. Due to the hard dependency on Node and
Chromium, Electron is in a slightly more difficult position and does not follow
semver. You should therefore always reference a specific version of Electron.
Version numbers are bumped using the following rules:
* Major: For breaking changes in Electron's API - if you upgrade from `0.37.0`
to `1.0.0`, you will have to update your app.
* Minor: For major Chrome and minor Node upgrades; or significant Electron
changes - if you upgrade from `1.0.0` to `1.1.0`, your app is supposed to
still work, but you might have to work around small changes.
* Patch: For new features and bug fixes - if you upgrade from `1.0.0` to
`1.0.1`, your app will continue to work as-is.
If you are using `electron` or `electron-prebuilt`, we recommend that you set a fixed version
number (`1.1.0` instead of `^1.1.0`) to ensure that all upgrades of Electron are
a manual operation made by you, the developer.

View file

@ -1,266 +0,0 @@
# Mac App Store Submission Guide
Since v0.34.0, Electron allows submitting packaged apps to the Mac App Store
(MAS). This guide provides information on: how to submit your app and the
limitations of the MAS build.
**Note:** Submitting an app to Mac App Store requires enrolling [Apple Developer
Program][developer-program], which costs money.
## How to Submit Your App
The following steps introduce a simple way to submit your app to Mac App Store.
However, these steps do not ensure your app will be approved by Apple; you
still need to read Apple's [Submitting Your App][submitting-your-app] guide on
how to meet the Mac App Store requirements.
### Get Certificate
To submit your app to the Mac App Store, you first must get a certificate from
Apple. You can follow these [existing guides][nwjs-guide] on web.
### Get Team ID
Before signing your app, you need to know the Team ID of your account. To locate
your Team ID, Sign in to [Apple Developer Center](https://developer.apple.com/account/),
and click Membership in the sidebar. Your Team ID appears in the Membership
Information section under the team name.
### Sign Your App
After finishing the preparation work, you can package your app by following
[Application Distribution](application-distribution.md), and then proceed to
signing your app.
First, you have to add a `ElectronTeamID` key to your app's `Info.plist`, which
has your Team ID as value:
```xml
<plist version="1.0">
<dict>
...
<key>ElectronTeamID</key>
<string>TEAM_ID</string>
</dict>
</plist>
```
Then, you need to prepare two entitlements files.
`child.plist`:
```xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>com.apple.security.app-sandbox</key>
<true/>
<key>com.apple.security.inherit</key>
<true/>
</dict>
</plist>
```
`parent.plist`:
```xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>com.apple.security.app-sandbox</key>
<true/>
<key>com.apple.security.application-groups</key>
<string>TEAM_ID.your.bundle.id</string>
</dict>
</plist>
```
You have to replace `TEAM_ID` with your Team ID, and replace `your.bundle.id`
with the Bundle ID of your app.
And then sign your app with the following script:
```bash
#!/bin/bash
# Name of your app.
APP="YourApp"
# The path of your app to sign.
APP_PATH="/path/to/YourApp.app"
# The path to the location you want to put the signed package.
RESULT_PATH="~/Desktop/$APP.pkg"
# The name of certificates you requested.
APP_KEY="3rd Party Mac Developer Application: Company Name (APPIDENTITY)"
INSTALLER_KEY="3rd Party Mac Developer Installer: Company Name (APPIDENTITY)"
# The path of your plist files.
CHILD_PLIST="/path/to/child.plist"
PARENT_PLIST="/path/to/parent.plist"
FRAMEWORKS_PATH="$APP_PATH/Contents/Frameworks"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Electron Framework"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Libraries/libffmpeg.dylib"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Libraries/libnode.dylib"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/Electron Framework.framework"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/$APP Helper.app/Contents/MacOS/$APP Helper"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/$APP Helper.app/"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/$APP Helper EH.app/Contents/MacOS/$APP Helper EH"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/$APP Helper EH.app/"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/$APP Helper NP.app/Contents/MacOS/$APP Helper NP"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/$APP Helper NP.app/"
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$APP_PATH/Contents/MacOS/$APP"
codesign -s "$APP_KEY" -f --entitlements "$PARENT_PLIST" "$APP_PATH"
productbuild --component "$APP_PATH" /Applications --sign "$INSTALLER_KEY" "$RESULT_PATH"
```
If you are new to app sandboxing under macOS, you should also read through
Apple's [Enabling App Sandbox][enable-app-sandbox] to have a basic idea, then
add keys for the permissions needed by your app to the entitlements files.
Apart from manually signing your app, you can also choose to use the
[electron-osx-sign][electron-osx-sign] module to do the job.
#### Sign Native Modules
Native modules used in your app also need to be signed. If using
electron-osx-sign, be sure to include the path to the built binaries in the
argument list:
```bash
electron-osx-sign YourApp.app YourApp.app/Contents/Resources/app/node_modules/nativemodule/build/release/nativemodule
```
Also note that native modules may have intermediate files produced which should
not be included (as they would also need to be signed). If you use
[electron-packager][electron-packager] before version 8.1.0, add
`--ignore=.+\.o$` to your build step to ignore these files. Versions 8.1.0 and
later ignores those files by default.
### Upload Your App
After signing your app, you can use Application Loader to upload it to iTunes
Connect for processing, making sure you have [created a record][create-record]
before uploading.
### Submit Your App for Review
After these steps, you can [submit your app for review][submit-for-review].
## Limitations of MAS Build
In order to satisfy all requirements for app sandboxing, the following modules
have been disabled in the MAS build:
* `crashReporter`
* `autoUpdater`
and the following behaviors have been changed:
* Video capture may not work for some machines.
* Certain accessibility features may not work.
* Apps will not be aware of DNS changes.
* APIs for launching apps at login are disabled. See
https://github.com/electron/electron/issues/7312#issuecomment-249479237
Also, due to the usage of app sandboxing, the resources which can be accessed by
the app are strictly limited; you can read [App Sandboxing][app-sandboxing] for
more information.
### Additional Entitlements
Depending on which Electron APIs your app uses, you may need to add additional
entitlements to your `parent.plist` file to be able to use these APIs from your
app's Mac App Store build.
#### Network Access
Enable outgoing network connections to allow your app to connect to a server:
```xml
<key>com.apple.security.network.client</key>
<true/>
```
Enable incoming network connections to allow your app to open a network
listening socket:
```xml
<key>com.apple.security.network.server</key>
<true/>
```
See the [Enabling Network Access documentation][network-access] for more
details.
#### dialog.showOpenDialog
```xml
<key>com.apple.security.files.user-selected.read-only</key>
<true/>
```
See the [Enabling User-Selected File Access documentation][user-selected] for
more details.
#### dialog.showSaveDialog
```xml
<key>com.apple.security.files.user-selected.read-write</key>
<true/>
```
See the [Enabling User-Selected File Access documentation][user-selected] for
more details.
## Cryptographic Algorithms Used by Electron
Depending on the country and region you are located, Mac App Store may require
documenting the cryptographic algorithms used in your app, and even ask you to
submit a copy of U.S. Encryption Registration (ERN) approval.
Electron uses following cryptographic algorithms:
* AES - [NIST SP 800-38A](http://csrc.nist.gov/publications/nistpubs/800-38a/sp800-38a.pdf), [NIST SP 800-38D](http://csrc.nist.gov/publications/nistpubs/800-38D/SP-800-38D.pdf), [RFC 3394](http://www.ietf.org/rfc/rfc3394.txt)
* HMAC - [FIPS 198-1](http://csrc.nist.gov/publications/fips/fips198-1/FIPS-198-1_final.pdf)
* ECDSA - ANS X9.622005
* ECDH - ANS X9.632001
* HKDF - [NIST SP 800-56C](http://csrc.nist.gov/publications/nistpubs/800-56C/SP-800-56C.pdf)
* PBKDF2 - [RFC 2898](https://tools.ietf.org/html/rfc2898)
* RSA - [RFC 3447](http://www.ietf.org/rfc/rfc3447)
* SHA - [FIPS 180-4](http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf)
* Blowfish - https://www.schneier.com/cryptography/blowfish/
* CAST - [RFC 2144](https://tools.ietf.org/html/rfc2144), [RFC 2612](https://tools.ietf.org/html/rfc2612)
* DES - [FIPS 46-3](http://csrc.nist.gov/publications/fips/fips46-3/fips46-3.pdf)
* DH - [RFC 2631](https://tools.ietf.org/html/rfc2631)
* DSA - [ANSI X9.30](http://webstore.ansi.org/RecordDetail.aspx?sku=ANSI+X9.30-1%3A1997)
* EC - [SEC 1](http://www.secg.org/sec1-v2.pdf)
* IDEA - "On the Design and Security of Block Ciphers" book by X. Lai
* MD2 - [RFC 1319](http://tools.ietf.org/html/rfc1319)
* MD4 - [RFC 6150](https://tools.ietf.org/html/rfc6150)
* MD5 - [RFC 1321](https://tools.ietf.org/html/rfc1321)
* MDC2 - [ISO/IEC 10118-2](https://www.openssl.org/docs/manmaster/crypto/mdc2.html)
* RC2 - [RFC 2268](https://tools.ietf.org/html/rfc2268)
* RC4 - [RFC 4345](https://tools.ietf.org/html/rfc4345)
* RC5 - http://people.csail.mit.edu/rivest/Rivest-rc5rev.pdf
* RIPEMD - [ISO/IEC 10118-3](http://webstore.ansi.org/RecordDetail.aspx?sku=ISO%2FIEC%2010118-3:2004)
On how to get the ERN approval, you can reference the article: [How to legally
submit an app to Apples App Store when it uses encryption (or how to obtain an
ERN)][ern-tutorial].
[developer-program]: https://developer.apple.com/support/compare-memberships/
[submitting-your-app]: https://developer.apple.com/library/mac/documentation/IDEs/Conceptual/AppDistributionGuide/SubmittingYourApp/SubmittingYourApp.html
[nwjs-guide]: https://github.com/nwjs/nw.js/wiki/Mac-App-Store-%28MAS%29-Submission-Guideline#first-steps
[enable-app-sandbox]: https://developer.apple.com/library/ios/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/EnablingAppSandbox.html
[create-record]: https://developer.apple.com/library/ios/documentation/LanguagesUtilities/Conceptual/iTunesConnect_Guide/Chapters/CreatingiTunesConnectRecord.html
[electron-osx-sign]: https://github.com/electron-userland/electron-osx-sign
[electron-packager]: https://github.com/electron-userland/electron-packager
[submit-for-review]: https://developer.apple.com/library/ios/documentation/LanguagesUtilities/Conceptual/iTunesConnect_Guide/Chapters/SubmittingTheApp.html
[app-sandboxing]: https://developer.apple.com/app-sandboxing/
[ern-tutorial]: https://carouselapps.com/2015/12/15/legally-submit-app-apples-app-store-uses-encryption-obtain-ern/
[temporary-exception]: https://developer.apple.com/library/mac/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/AppSandboxTemporaryExceptionEntitlements.html
[user-selected]: https://developer.apple.com/library/mac/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/EnablingAppSandbox.html#//apple_ref/doc/uid/TP40011195-CH4-SW6
[network-access]: https://developer.apple.com/library/ios/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/EnablingAppSandbox.html#//apple_ref/doc/uid/TP40011195-CH4-SW9

View file

@ -1,57 +0,0 @@
# Offscreen Rendering
Offscreen rendering lets you obtain the content of a browser window in a bitmap,
so it can be rendered anywhere, for example on a texture in a 3D scene. The
offscreen rendering in Electron uses a similar approach than the [Chromium
Embedded Framework](https://bitbucket.org/chromiumembedded/cef) project.
Two modes of rendering can be used and only the dirty area is passed in the
`'paint'` event to be more efficient. The rendering can be stopped, continued
and the frame rate can be set. The specified frame rate is a top limit value,
when there is nothing happening on a webpage, no frames are generated. The
maximum frame rate is 60, because above that there is no benefit, just
performance loss.
**Note:** An offscreen window is always created as a [Frameless Window](../api/frameless-window.md).
## Two modes of rendering
### GPU accelerated
GPU accelerated rendering means that the GPU is used for composition. Because of
that the frame has to be copied from the GPU which requires more performance,
thus this mode is quite a bit slower than the other one. The benefit of this
mode that WebGL and 3D CSS animations are supported.
### Software output device
This mode uses a software output device for rendering in the CPU, so the frame
generation is much faster, thus this mode is preferred over the GPU accelerated
one.
To enable this mode GPU acceleration has to be disabled by calling the
[`app.disableHardwareAcceleration()`][disablehardwareacceleration] API.
## Usage
``` javascript
const {app, BrowserWindow} = require('electron')
app.disableHardwareAcceleration()
let win
app.once('ready', () => {
win = new BrowserWindow({
webPreferences: {
offscreen: true
}
})
win.loadURL('http://github.com')
win.webContents.on('paint', (event, dirty, image) => {
// updateBitmap(dirty, image.getBitmap())
})
win.webContents.setFrameRate(30)
})
```
[disablehardwareacceleration]: ../api/app.md#appdisablehardwareacceleration

View file

@ -1,90 +0,0 @@
# Online/Offline Event Detection
Online and offline event detection can be implemented in the renderer process
using standard HTML5 APIs, as shown in the following example.
_main.js_
```javascript
const {app, BrowserWindow} = require('electron')
let onlineStatusWindow
app.on('ready', () => {
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
})
```
_online-status.html_
```html
<!DOCTYPE html>
<html>
<body>
<script>
const alertOnlineStatus = () => {
window.alert(navigator.onLine ? 'online' : 'offline')
}
window.addEventListener('online', alertOnlineStatus)
window.addEventListener('offline', alertOnlineStatus)
alertOnlineStatus()
</script>
</body>
</html>
```
There may be instances where you want to respond to these events in the
main process as well. The main process however does not have a
`navigator` object and thus cannot detect these events directly. Using
Electron's inter-process communication utilities, the events can be forwarded
to the main process and handled as needed, as shown in the following example.
_main.js_
```javascript
const {app, BrowserWindow, ipcMain} = require('electron')
let onlineStatusWindow
app.on('ready', () => {
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
})
ipcMain.on('online-status-changed', (event, status) => {
console.log(status)
})
```
_online-status.html_
```html
<!DOCTYPE html>
<html>
<body>
<script>
const {ipcRenderer} = require('electron')
const updateOnlineStatus = () => {
ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline')
}
window.addEventListener('online', updateOnlineStatus)
window.addEventListener('offline', updateOnlineStatus)
updateOnlineStatus()
</script>
</body>
</html>
```
**NOTE:** If Electron is not able to connect to a local area network (LAN) or
a router, it is considered offline; all other conditions return `true`.
So while you can assume that Electron is offline when `navigator.onLine`
returns a `false` value, you cannot assume that a `true` value necessarily
means that Electron can access the internet. You could be getting false
positives, such as in cases where the computer is running a virtualization
software that has virtual ethernet adapters that are always "connected."
Therefore, if you really want to determine the internet access status of Electron,
you should develop additional means for checking.

View file

@ -1,159 +0,0 @@
# Planned Breaking API Changes
The following list includes the APIs that will be removed in Electron 2.0.
There is no timetable for when this release will occur but deprecation
warnings will be added at least 90 days beforehand.
## `BrowserWindow`
```js
// Deprecated
let optionsA = {webPreferences: {blinkFeatures: ''}}
let windowA = new BrowserWindow(optionsA)
// Replace with
let optionsB = {webPreferences: {enableBlinkFeatures: ''}}
let windowB = new BrowserWindow(optionsB)
```
## `clipboard`
```js
// Deprecated
clipboard.readRtf()
// Replace with
clipboard.readRTF()
// Deprecated
clipboard.writeRtf()
// Replace with
clipboard.writeRTF()
// Deprecated
clipboard.readHtml()
// Replace with
clipboard.readHTML()
// Deprecated
clipboard.writeHtml()
// Replace with
clipboard.writeHTML()
```
## `crashReporter`
```js
// Deprecated
crashReporter.start({
companyName: 'Crashly',
submitURL: 'https://crash.server.com',
autoSubmit: true
})
// Replace with
crashReporter.start({
companyName: 'Crashly',
submitURL: 'https://crash.server.com',
uploadToServer: true
})
```
## `nativeImage`
```js
// Deprecated
nativeImage.toPng()
// Replace with
nativeImage.toPNG()
// Deprecated
nativeImage.toJpeg()
// Replace with
nativeImage.toJPEG()
// Deprecated
nativeImage.createFromBuffer(buffer, 1.0)
// Replace with
nativeImage.createFromBuffer(buffer, {
scaleFactor: 1.0
})
```
## `process`
```js
// Deprecated
process.versions['atom-shell']
// Replace with
process.versions.electron
```
* `process.versions.electron` and `process.version.chrome` will be made
read-only properties for consistency with the other `process.versions`
properties set by Node.
## `Tray`
```js
// Deprecated
tray.setHighlightMode(true)
// Replace with
tray.setHighlightMode('on')
// Deprecated
tray.setHighlightMode(false)
// Replace with
tray.setHighlightMode('off')
```
## `webContents`
```js
// Deprecated
webContents.openDevTools({detach: true})
// Replace with
webContents.openDevTools({mode: 'detach'})
```
```js
// Deprecated
webContents.setZoomLevelLimits(1, 2)
// Replace with
webContents.setVisualZoomLevelLimits(1, 2)
```
## `webFrame`
```js
// Deprecated
webFrame.setZoomLevelLimits(1, 2)
// Replace with
webFrame.setVisualZoomLevelLimits(1, 2)
// Deprecated
webFrame.registerURLSchemeAsSecure('app')
// Replace with
protocol.registerStandardSchemes(['app'], {secure: true})
// Deprecated
webFrame.registerURLSchemeAsPrivileged('app', {secure: true})
// Replace with
protocol.registerStandardSchemes(['app'], {secure: true})
```
## `<webview>`
```js
// Deprecated
webview.setZoomLevelLimits(1, 2)
// Replace with
webview.setVisualZoomLevelLimits(1, 2)
```
## Node Headers URL
This is the URL specified as `disturl` in a `.npmrc` file or as the `--dist-url`
command line flag when building native Node modules.
Deprecated: https://atom.io/download/atom-shell
Replace with: https://atom.io/download/electron

View file

@ -1,26 +0,0 @@
# REPL
Read-Eval-Print-Loop (REPL) is a simple, interactive computer programming
environment that takes single user inputs (i.e. single expressions), evaluates
them, and returns the result to the user.
The `repl` module provides a REPL implementation that can be accessed using:
* Assuming you have `electron` or `electron-prebuilt` installed as a local
project dependency:
```sh
./node_modules/.bin/electron --interactive
```
* Assuming you have `electron` or `electron-prebuilt` installed globally:
```sh
electron --interactive
```
This only creates a REPL for the main process. You can use the Console
tab of the Dev Tools to get a REPL for the renderer processes.
**Note:** `electron --interactive` is not available on Windows.
More information can be found in the [Node.js REPL docs](https://nodejs.org/dist/latest/docs/api/repl.html).

View file

@ -1,96 +0,0 @@
# Security, Native Capabilities, and Your Responsibility
As web developers, we usually enjoy the strong security net of the browser - the
risks associated with the code we write are relatively small. Our websites are
granted limited powers in a sandbox, and we trust that our users enjoy a browser
built by a large team of engineers that is able to quickly respond to newly
discovered security threats.
When working with Electron, it is important to understand that Electron is not
a web browser. It allows you to build feature-rich desktop applications with
familiar web technologies, but your code wields much greater power. JavaScript
can access the filesystem, user shell, and more. This allows you to build
high quality native applications, but the inherent security risks scale with the
additional powers granted to your code.
With that in mind, be aware that displaying arbitrary content from untrusted
sources poses a severe security risk that Electron is not intended to handle.
In fact, the most popular Electron apps (Atom, Slack, Visual Studio Code, etc)
display primarily local content (or trusted, secure remote content without Node
integration) if your application executes code from an online source, it is
your responsibility to ensure that the code is not malicious.
## Chromium Security Issues and Upgrades
While Electron strives to support new versions of Chromium as soon as possible,
developers should be aware that upgrading is a serious undertaking - involving
hand-editing dozens or even hundreds of files. Given the resources and
contributions available today, Electron will often not be on the very latest
version of Chromium, lagging behind by either days or weeks.
We feel that our current system of updating the Chromium component strikes an
appropriate balance between the resources we have available and the needs of the
majority of applications built on top of the framework. We definitely are
interested in hearing more about specific use cases from the people that build
things on top of Electron. Pull requests and contributions supporting this
effort are always very welcome.
## Ignoring Above Advice
A security issue exists whenever you receive code from a remote destination and
execute it locally. As an example, consider a remote website being displayed
inside a browser window. If an attacker somehow manages to change said content
(either by attacking the source directly, or by sitting between your app and
the actual destination), they will be able to execute native code on the user's
machine.
> :warning: Under no circumstances should you load and execute remote code with
Node integration enabled. Instead, use only local files (packaged together with
your application) to execute Node code. To display remote content, use the
`webview` tag and make sure to disable the `nodeIntegration`.
#### Checklist
This is not bulletproof, but at the least, you should attempt the following:
* Only display secure (https) content
* Disable the Node integration in all renderers that display remote content
(setting `nodeIntegration` to `false` in `webPreferences`)
* Enable context isolation in all rendererers that display remote content
(setting `contextIsolation` to `true` in `webPreferences`)
* Do not disable `webSecurity`. Disabling it will disable the same-origin policy.
* Define a [`Content-Security-Policy`](http://www.html5rocks.com/en/tutorials/security/content-security-policy/)
, and use restrictive rules (i.e. `script-src 'self'`)
* [Override and disable `eval`](https://github.com/nylas/N1/blob/0abc5d5defcdb057120d726b271933425b75b415/static/index.js#L6-L8)
, which allows strings to be executed as code.
* Do not set `allowDisplayingInsecureContent` to true.
* Do not set `allowRunningInsecureContent` to true.
* Do not enable `experimentalFeatures` or `experimentalCanvasFeatures` unless
you know what you're doing.
* Do not use `blinkFeatures` unless you know what you're doing.
* WebViews: Do not add the `nodeintegration` attribute.
* WebViews: Do not use `disablewebsecurity`
* WebViews: Do not use `allowpopups`
* WebViews: Do not use `insertCSS` or `executeJavaScript` with remote CSS/JS.
Again, this list merely minimizes the risk, it does not remove it. If your goal
is to display a website, a browser will be a more secure option.
## Buffer Global
Node's [Buffer](https://nodejs.org/api/buffer.html) class is currently available
as a global even when the `nodeintegration` attribute is not added. You can
delete this in your app by doing the following in your `preload` script:
```js
delete global.Buffer
```
Deleting it may break Node modules used in your preload script and app since
many libraries expect it to be a global instead of requiring it directly via:
```js
const {Buffer} = require('buffer')
```
The `Buffer` global may be removed in future major versions of Electron.

View file

@ -1,31 +0,0 @@
# Supported Platforms
Following platforms are supported by Electron:
### macOS
Only 64bit binaries are provided for macOS, and the minimum macOS version
supported is macOS 10.9.
### Windows
Windows 7 and later are supported, older operating systems are not supported
(and do not work).
Both `ia32` (`x86`) and `x64` (`amd64`) binaries are provided for Windows.
Please note, the `ARM` version of Windows is not supported for now.
### Linux
The prebuilt `ia32` (`i686`) and `x64` (`amd64`) binaries of Electron are built on
Ubuntu 12.04, the `arm` binary is built against ARM v7 with hard-float ABI and
NEON for Debian Wheezy.
Whether the prebuilt binary can run on a distribution depends on whether the
distribution includes the libraries that Electron is linked to on the building
platform, so only Ubuntu 12.04 is guaranteed to work, but following platforms
are also verified to be able to run the prebuilt binaries of Electron:
* Ubuntu 12.04 and later
* Fedora 21
* Debian 8

View file

@ -1,60 +0,0 @@
# Testing on Headless CI Systems (Travis CI, Jenkins)
Being based on Chromium, Electron requires a display driver to function.
If Chromium can't find a display driver, Electron will simply fail to launch -
and therefore not executing any of your tests, regardless of how you are running
them. Testing Electron-based apps on Travis, Circle, Jenkins or similar Systems
requires therefore a little bit of configuration. In essence, we need to use
a virtual display driver.
## Configuring the Virtual Display Server
First, install [Xvfb](https://en.wikipedia.org/wiki/Xvfb).
It's a virtual framebuffer, implementing the X11 display server protocol -
it performs all graphical operations in memory without showing any screen output,
which is exactly what we need.
Then, create a virtual xvfb screen and export an environment variable
called DISPLAY that points to it. Chromium in Electron will automatically look
for `$DISPLAY`, so no further configuration of your app is required.
This step can be automated with Paul Betts's
[xvfb-maybe](https://github.com/paulcbetts/xvfb-maybe): Prepend your test
commands with `xvfb-maybe` and the little tool will automatically configure
xvfb, if required by the current system. On Windows or macOS, it will simply
do nothing.
```
## On Windows or macOS, this just invokes electron-mocha
## On Linux, if we are in a headless environment, this will be equivalent
## to xvfb-run electron-mocha ./test/*.js
xvfb-maybe electron-mocha ./test/*.js
```
### Travis CI
On Travis, your `.travis.yml` should look roughly like this:
```yml
addons:
apt:
packages:
- xvfb
install:
- export DISPLAY=':99.0'
- Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
```
### Jenkins
For Jenkins, a [Xvfb plugin is available](https://wiki.jenkins-ci.org/display/JENKINS/Xvfb+Plugin).
### Circle CI
Circle CI is awesome and has xvfb and `$DISPLAY`
[already setup, so no further configuration is required](https://circleci.com/docs/environment#browsers).
### AppVeyor
AppVeyor runs on Windows, supporting Selenium, Chromium, Electron and similar
tools out of the box - no configuration is required.

View file

@ -1,104 +0,0 @@
# Using Native Node Modules
The native Node modules are supported by Electron, but since Electron is very
likely to use a different V8 version from the Node binary installed in your
system, you have to manually specify the location of Electron's headers when
building native modules.
## How to install native modules
Three ways to install native modules:
### Using `npm`
By setting a few environment variables, you can use `npm` to install modules
directly.
An example of installing all dependencies for Electron:
```bash
# Electron's version.
export npm_config_target=1.2.3
# The architecture of Electron, can be ia32 or x64.
export npm_config_arch=x64
export npm_config_target_arch=x64
# Download headers for Electron.
export npm_config_disturl=https://atom.io/download/electron
# Tell node-pre-gyp that we are building for Electron.
export npm_config_runtime=electron
# Tell node-pre-gyp to build module from source code.
export npm_config_build_from_source=true
# Install all dependencies, and store cache to ~/.electron-gyp.
HOME=~/.electron-gyp npm install
```
### Installing modules and rebuilding for Electron
You can also choose to install modules like other Node projects, and then
rebuild the modules for Electron with the [`electron-rebuild`][electron-rebuild]
package. This module can get the version of Electron and handle the manual steps
of downloading headers and building native modules for your app.
An example of installing `electron-rebuild` and then rebuild modules with it:
```bash
npm install --save-dev electron-rebuild
# Every time you run "npm install", run this:
./node_modules/.bin/electron-rebuild
# On Windows if you have trouble, try:
.\node_modules\.bin\electron-rebuild.cmd
```
### Manually building for Electron
If you are a developer developing a native module and want to test it against
Electron, you might want to rebuild the module for Electron manually. You can
use `node-gyp` directly to build for Electron:
```bash
cd /path-to-module/
HOME=~/.electron-gyp node-gyp rebuild --target=1.2.3 --arch=x64 --dist-url=https://atom.io/download/electron
```
The `HOME=~/.electron-gyp` changes where to find development headers. The
`--target=1.2.3` is version of Electron. The `--dist-url=...` specifies
where to download the headers. The `--arch=x64` says the module is built for
64bit system.
## Troubleshooting
If you installed a native module and found it was not working, you need to check
following things:
* The architecture of module has to match Electron's architecture (ia32 or x64).
* After you upgraded Electron, you usually need to rebuild the modules.
* When in doubt, run `electron-rebuild` first.
## Modules that rely on `prebuild`
[`prebuild`](https://github.com/mafintosh/prebuild) provides a way to easily
publish native Node modules with prebuilt binaries for multiple versions of Node
and Electron.
If modules provide binaries for the usage in Electron, make sure to omit
`--build-from-source` and the `npm_config_build_from_source` environment
variable in order to take full advantage of the prebuilt binaries.
## Modules that rely on `node-pre-gyp`
The [`node-pre-gyp` tool][node-pre-gyp] provides a way to deploy native Node
modules with prebuilt binaries, and many popular modules are using it.
Usually those modules work fine under Electron, but sometimes when Electron uses
a newer version of V8 than Node, and there are ABI changes, bad things may
happen. So in general it is recommended to always build native modules from
source code.
If you are following the `npm` way of installing modules, then this is done
by default, if not, you have to pass `--build-from-source` to `npm`, or set the
`npm_config_build_from_source` environment variable.
[electron-rebuild]: https://github.com/paulcbetts/electron-rebuild
[node-pre-gyp]: https://github.com/mapbox/node-pre-gyp

View file

@ -1,82 +0,0 @@
# Using Pepper Flash Plugin
Electron supports the Pepper Flash plugin. To use the Pepper Flash plugin in
Electron, you should manually specify the location of the Pepper Flash plugin
and then enable it in your application.
## Prepare a Copy of Flash Plugin
On macOS and Linux, the details of the Pepper Flash plugin can be found by
navigating to `chrome://plugins` in the Chrome browser. Its location and version
are useful for Electron's Pepper Flash support. You can also copy it to another
location.
## Add Electron Switch
You can directly add `--ppapi-flash-path` and `--ppapi-flash-version` to the
Electron command line or by using the `app.commandLine.appendSwitch` method
before the app ready event. Also, turn on `plugins` option of `BrowserWindow`.
For example:
```javascript
const {app, BrowserWindow} = require('electron')
const path = require('path')
// Specify flash path, supposing it is placed in the same directory with main.js.
let pluginName
switch (process.platform) {
case 'win32':
pluginName = 'pepflashplayer.dll'
break
case 'darwin':
pluginName = 'PepperFlashPlayer.plugin'
break
case 'linux':
pluginName = 'libpepflashplayer.so'
break
}
app.commandLine.appendSwitch('ppapi-flash-path', path.join(__dirname, pluginName))
// Optional: Specify flash version, for example, v17.0.0.169
app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169')
app.on('ready', () => {
let win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
plugins: true
}
})
win.loadURL(`file://${__dirname}/index.html`)
// Something else
})
```
You can also try loading the system wide Pepper Flash plugin instead of shipping
the plugins yourself, its path can be received by calling
`app.getPath('pepperFlashSystemPlugin')`.
## Enable Flash Plugin in a `<webview>` Tag
Add `plugins` attribute to `<webview>` tag.
```html
<webview src="http://www.adobe.com/software/flash/about/" plugins></webview>
```
## Troubleshooting
You can check if Pepper Flash plugin was loaded by inspecting
`navigator.plugins` in the console of devtools (although you can't know if the
plugin's path is correct).
The architecture of Pepper Flash plugin has to match Electron's one. On Windows,
a common error is to use 32bit version of Flash plugin against 64bit version of
Electron.
On Windows the path passed to `--ppapi-flash-path` has to use `\` as path
delimiter, using POSIX-style paths will not work.
For some operations, such as streaming media using RTMP, it is necessary to grant wider permissions to players `.swf` files. One way of accomplishing this, is to use [nw-flash-trust](https://github.com/szwacz/nw-flash-trust).

View file

@ -1,172 +0,0 @@
# Using Selenium and WebDriver
From [ChromeDriver - WebDriver for Chrome][chrome-driver]:
> WebDriver is an open source tool for automated testing of web apps across many
> browsers. It provides capabilities for navigating to web pages, user input,
> JavaScript execution, and more. ChromeDriver is a standalone server which
> implements WebDriver's wire protocol for Chromium. It is being developed by
> members of the Chromium and WebDriver teams.
## Setting up Spectron
[Spectron][spectron] is the officially supported ChromeDriver testing framework
for Electron. It is built on top of [WebdriverIO](http://webdriver.io/) and
has helpers to access Electron APIs in your tests and bundles ChromeDriver.
```bash
$ npm install --save-dev spectron
```
```javascript
// A simple test to verify a visible window is opened with a title
var Application = require('spectron').Application
var assert = require('assert')
var app = new Application({
path: '/Applications/MyApp.app/Contents/MacOS/MyApp'
})
app.start().then(function () {
// Check if the window is visible
return app.browserWindow.isVisible()
}).then(function (isVisible) {
// Verify the window is visible
assert.equal(isVisible, true)
}).then(function () {
// Get the window's title
return app.client.getTitle()
}).then(function (title) {
// Verify the window's title
assert.equal(title, 'My App')
}).catch(function (error) {
// Log any failures
console.error('Test failed', error.message)
}).then(function () {
// Stop the application
return app.stop()
})
```
## Setting up with WebDriverJs
[WebDriverJs](https://code.google.com/p/selenium/wiki/WebDriverJs) provides
a Node package for testing with web driver, we will use it as an example.
### 1. Start ChromeDriver
First you need to download the `chromedriver` binary, and run it:
```bash
$ npm install electron-chromedriver
$ ./node_modules/.bin/chromedriver
Starting ChromeDriver (v2.10.291558) on port 9515
Only local connections are allowed.
```
Remember the port number `9515`, which will be used later
### 2. Install WebDriverJS
```bash
$ npm install selenium-webdriver
```
### 3. Connect to ChromeDriver
The usage of `selenium-webdriver` with Electron is basically the same with
upstream, except that you have to manually specify how to connect chrome driver
and where to find Electron's binary:
```javascript
const webdriver = require('selenium-webdriver')
const driver = new webdriver.Builder()
// The "9515" is the port opened by chrome driver.
.usingServer('http://localhost:9515')
.withCapabilities({
chromeOptions: {
// Here is the path to your Electron binary.
binary: '/Path-to-Your-App.app/Contents/MacOS/Electron'
}
})
.forBrowser('electron')
.build()
driver.get('http://www.google.com')
driver.findElement(webdriver.By.name('q')).sendKeys('webdriver')
driver.findElement(webdriver.By.name('btnG')).click()
driver.wait(() => {
return driver.getTitle().then((title) => {
return title === 'webdriver - Google Search'
})
}, 1000)
driver.quit()
```
## Setting up with WebdriverIO
[WebdriverIO](http://webdriver.io/) provides a Node package for testing with web
driver.
### 1. Start ChromeDriver
First you need to download the `chromedriver` binary, and run it:
```bash
$ npm install electron-chromedriver
$ ./node_modules/.bin/chromedriver --url-base=wd/hub --port=9515
Starting ChromeDriver (v2.10.291558) on port 9515
Only local connections are allowed.
```
Remember the port number `9515`, which will be used later
### 2. Install WebdriverIO
```bash
$ npm install webdriverio
```
### 3. Connect to chrome driver
```javascript
const webdriverio = require('webdriverio')
const options = {
host: 'localhost', // Use localhost as chrome driver server
port: 9515, // "9515" is the port opened by chrome driver.
desiredCapabilities: {
browserName: 'chrome',
chromeOptions: {
binary: '/Path-to-Your-App/electron', // Path to your Electron binary.
args: [/* cli arguments */] // Optional, perhaps 'app=' + /path/to/your/app/
}
}
}
let client = webdriverio.remote(options)
client
.init()
.url('http://google.com')
.setValue('#q', 'webdriverio')
.click('#btnG')
.getTitle().then((title) => {
console.log('Title was: ' + title)
})
.end()
```
## Workflow
To test your application without rebuilding Electron, simply
[place](https://github.com/electron/electron/blob/master/docs/tutorial/application-distribution.md)
your app source into Electron's resource directory.
Alternatively, pass an argument to run with your electron binary that points to
your app's folder. This eliminates the need to copy-paste your app into
Electron's resource directory.
[chrome-driver]: https://sites.google.com/a/chromium.org/chromedriver/
[spectron]: http://electron.atom.io/spectron

View file

@ -1,85 +0,0 @@
# Using Widevine CDM Plugin
In Electron you can use the Widevine CDM plugin shipped with Chrome browser.
## Getting the plugin
Electron doesn't ship with the Widevine CDM plugin for license reasons, to get
it, you need to install the official Chrome browser first, which should match
the architecture and Chrome version of the Electron build you use.
**Note:** The major version of Chrome browser has to be the same with the Chrome
version used by Electron, otherwise the plugin will not work even though
`navigator.plugins` would show it has been loaded.
### Windows & macOS
Open `chrome://components/` in Chrome browser, find `WidevineCdm` and make
sure it is up to date, then you can find all the plugin binaries from the
`APP_DATA/Google/Chrome/WidevineCDM/VERSION/_platform_specific/PLATFORM_ARCH/`
directory.
`APP_DATA` is system's location for storing app data, on Windows it is
`%LOCALAPPDATA%`, on macOS it is `~/Library/Application Support`. `VERSION` is
Widevine CDM plugin's version string, like `1.4.8.866`. `PLATFORM` is `mac` or
`win`. `ARCH` is `x86` or `x64`.
On Windows the required binaries are `widevinecdm.dll` and
`widevinecdmadapter.dll`, on macOS they are `libwidevinecdm.dylib` and
`widevinecdmadapter.plugin`. You can copy them to anywhere you like, but they
have to be put together.
### Linux
On Linux the plugin binaries are shipped together with Chrome browser, you can
find them under `/opt/google/chrome`, the filenames are `libwidevinecdm.so` and
`libwidevinecdmadapter.so`.
## Using the plugin
After getting the plugin files, you should pass the `widevinecdmadapter`'s path
to Electron with `--widevine-cdm-path` command line switch, and the plugin's
version with `--widevine-cdm-version` switch.
**Note:** Though only the `widevinecdmadapter` binary is passed to Electron, the
`widevinecdm` binary has to be put aside it.
The command line switches have to be passed before the `ready` event of `app`
module gets emitted, and the page that uses this plugin must have plugin
enabled.
Example code:
```javascript
const {app, BrowserWindow} = require('electron')
// You have to pass the filename of `widevinecdmadapter` here, it is
// * `widevinecdmadapter.plugin` on macOS,
// * `libwidevinecdmadapter.so` on Linux,
// * `widevinecdmadapter.dll` on Windows.
app.commandLine.appendSwitch('widevine-cdm-path', '/path/to/widevinecdmadapter.plugin')
// The version of plugin can be got from `chrome://plugins` page in Chrome.
app.commandLine.appendSwitch('widevine-cdm-version', '1.4.8.866')
let win = null
app.on('ready', () => {
win = new BrowserWindow({
webPreferences: {
// The `plugins` have to be enabled.
plugins: true
}
})
win.show()
})
```
## Verifying the plugin
To verify whether the plugin works, you can use following ways:
* Open devtools and check whether `navigator.plugins` includes the Widevine
CDM plugin.
* Open https://shaka-player-demo.appspot.com/ and load a manifest that uses
`Widevine`.
* Open http://www.dash-player.com/demo/drm-test-area/, check whether the page
says `bitdash uses Widevine in your browser`, then play the video.

View file

@ -1,161 +0,0 @@
# Windows Store Guide
With Windows 8, the good old win32 executable got a new sibling: The Universal
Windows Platform. The new `.appx` format does not only enable a number of new
powerful APIs like Cortana or Push Notifications, but through the Windows Store,
also simplifies installation and updating.
Microsoft [developed a tool that compiles Electron apps as `.appx` packages][electron-windows-store],
enabling developers to use some of the goodies found in the new application
model. This guide explains how to use it - and what the capabilities and
limitations of an Electron AppX package are.
## Background and Requirements
Windows 10 "Anniversary Update" is able to run win32 `.exe` binaries by
launching them together with a virtualized filesystem and registry. Both are
created during compilation by running app and installer inside a Windows
Container, allowing Windows to identify exactly which modifications to the
operating system are done during installation. Pairing the executable with a
virtual filesystem and a virtual registry allows Windows to enable one-click
installation and uninstallation.
In addition, the exe is launched inside the appx model - meaning that it can use
many of the APIs available to the Universal Windows Platform. To gain even more
capabilities, an Electron app can pair up with an invisible UWP background task
launched together with the `exe` - sort of launched as a sidekick to run tasks
in the background, receive push notifications, or to communicate with other UWP
applications.
To compile any existing Electron app, ensure that you have the following
requirements:
* Windows 10 with Anniversary Update (released August 2nd, 2016)
* The Windows 10 SDK, [downloadable here][windows-sdk]
* At least Node 4 (to check, run `node -v`)
Then, go and install the `electron-windows-store` CLI:
```
npm install -g electron-windows-store
```
## Step 1: Package Your Electron Application
Package the application using [electron-packager][electron-packager] (or a similar tool).
Make sure to remove `node_modules` that you don't need in your final application, since
any module you don't actually need will just increase your application's size.
The output should look roughly like this:
```
├── Ghost.exe
├── LICENSE
├── content_resources_200_percent.pak
├── content_shell.pak
├── d3dcompiler_47.dll
├── ffmpeg.dll
├── icudtl.dat
├── libEGL.dll
├── libGLESv2.dll
├── locales
│   ├── am.pak
│   ├── ar.pak
│   ├── [...]
├── natives_blob.bin
├── node.dll
├── resources
│   ├── app
│   └── atom.asar
├── snapshot_blob.bin
├── squirrel.exe
├── ui_resources_200_percent.pak
└── xinput1_3.dll
```
## Step 2: Running electron-windows-store
From an elevated PowerShell (run it "as Administrator"), run
`electron-windows-store` with the required parameters, passing both the input
and output directories, the app's name and version, and confirmation that
`node_modules` should be flattened.
```
electron-windows-store `
--input-directory C:\myelectronapp `
--output-directory C:\output\myelectronapp `
--flatten true `
--package-version 1.0.0.0 `
--package-name myelectronapp
```
Once executed, the tool goes to work: It accepts your Electron app as an input,
flattening the `node_modules`. Then, it archives your application as `app.zip`.
Using an installer and a Windows Container, the tool creates an "expanded" AppX
package - including the Windows Application Manifest (`AppXManifest.xml`) as
well as the virtual file system and the virtual registry inside your output
folder.
Once the expanded AppX files are created, the tool uses the Windows App Packager
(`MakeAppx.exe`) to create a single-file AppX package from those files on disk.
Finally, the tool can be used to create a trusted certificate on your computer
to sign the new AppX package. With the signed AppX package, the CLI can also
automatically install the package on your machine.
## Step 3: Using the AppX Package
In order to run your package, your users will need Windows 10 with the so-called
"Anniversary Update" - details on how to update Windows can be found [here][how-to-update].
In opposition to traditional UWP apps, packaged apps currently need to undergo a
manual verification process, for which you can apply [here][centennial-campaigns].
In the meantime, all users will be able to just install your package by double-clicking it,
so a submission to the store might not be necessary if you're simply looking for an
easier installation method. In managed environments (usually enterprises), the
`Add-AppxPackage` [PowerShell Cmdlet can be used to install it in an automated fashion][add-appxpackage].
Another important limitation is that the compiled AppX package still contains a
win32 executable - and will therefore not run on Xbox, HoloLens, or Phones.
## Optional: Add UWP Features using a BackgroundTask
You can pair your Electron app up with an invisible UWP background task that
gets to make full use of Windows 10 features - like push notifications,
Cortana integration, or live tiles.
To check out how an Electron app that uses a background task to send toast
notifications and live tiles, [check out the Microsoft-provided sample][background-task].
## Optional: Convert using Container Virtualiziation
To generate the AppX package, the `electron-windows-store` CLI uses a template
that should work for most Electron apps. However, if you are using a custom
installer, or should you experience any trouble with the generated package, you
can attempt to create a package using compilation with a Windows Container - in
that mode, the CLI will install and run your application in blank Windows Container
to determine what modifications your application is exactly doing to the operating
system.
Before running the CLI for the, you will have to setup the "Windows Desktop App
Converter". This will take a few minutes, but don't worry - you only have to do
this once. Download and Desktop App Converter from [here][app-converter].
You will receive two files: `DesktopAppConverter.zip` and `BaseImage-14316.wim`.
1. Unzip `DesktopAppConverter.zip`. From an elevated PowerShell (opened with
"run as Administrator", ensure that your systems execution policy allows us to
run everything we intend to run by calling `Set-ExecutionPolicy bypass`.
2. Then, run the installation of the Desktop App Converter, passing in the
location of the Windows base Image (downloaded as `BaseImage-14316.wim`), by
calling `.\DesktopAppConverter.ps1 -Setup -BaseImage .\BaseImage-14316.wim`.
3. If running the above command prompts you for a reboot, please restart your
machine and run the above command again after a successful restart.
Once installation succeeded, you can move on to compiling your Electron app.
[windows-sdk]: https://developer.microsoft.com/en-us/windows/downloads/windows-10-sdk
[app-converter]: https://www.microsoft.com/en-us/download/details.aspx?id=51691
[add-appxpackage]: https://technet.microsoft.com/en-us/library/hh856048.aspx
[electron-packager]: https://github.com/electron-userland/electron-packager
[electron-windows-store]: https://github.com/catalystcode/electron-windows-store
[background-task]: https://github.com/felixrieseberg/electron-uwp-background
[centennial-campaigns]: https://developer.microsoft.com/en-us/windows/projects/campaigns/desktop-bridge
[how-to-update]: https://blogs.windows.com/windowsexperience/2016/08/02/how-to-get-the-windows-10-anniversary-update