standardize all javascript blocks in English docs

docs/api/app.md

@@ -6,10 +6,10 @@ The following example shows how to quit the application when the last window is
 closed:
 
 ```javascript
-const {app} = require('electron');
+const {app} = require('electron')
 app.on('window-all-closed', () => {
-  app.quit();
+  app.quit()
-});
+})
 ```
 
 ## Events
@@ -192,15 +192,17 @@ 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();
+    event.preventDefault()
-    callback(true);
+    callback(true)
   } else {
-    callback(false);
+    callback(false)
   }
-});
+})
 ```
 
 ### Event: 'select-client-certificate'
@@ -228,10 +230,12 @@ and `callback` needs to be called with an entry filtered from the list. Using
 certificate from the store.
 
 ```javascript
+const {app} = require('electron')
+
 app.on('select-client-certificate', (event, webContents, url, list, callback) => {
-  event.preventDefault();
+  event.preventDefault()
-  callback(list[0]);
+  callback(list[0])
-});
+})
 ```
 
 ### Event: 'login'
@@ -259,10 +263,12 @@ 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();
+  event.preventDefault()
-  callback('username', 'secret');
+  callback('username', 'secret')
-});
+})
 ```
 
 ### Event: 'gpu-process-crashed'
@@ -331,6 +337,8 @@ 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) + ['--relaunch']})
 app.exit(0)
 ```
@@ -537,24 +545,24 @@ An example of activating the window of primary instance when a second instance
 starts:
 
 ```javascript
-let myWindow = null;
+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();
+    if (myWindow.isMinimized()) myWindow.restore()
-    myWindow.focus();
+    myWindow.focus()
   }
-});
+})
 
 if (shouldQuit) {
-  app.quit();
+  app.quit()
-  return;
 }
 
 // Create myWindow, load the rest of the app, etc...
 app.on('ready', () => {
-});
+})
 ```
 
 ### `app.releaseSingleInstance()`

docs/api/browser-window.md

@@ -6,8 +6,8 @@
 // In the main process.
 const {BrowserWindow} = require('electron')
 
-// Or in the renderer process.
+// Or use `remote` from the renderer process.
-const {BrowserWindow} = require('electron').remote
+// const {BrowserWindow} = require('electron').remote
 
 let win = new BrowserWindow({width: 800, height: 600})
 win.on('closed', () => {
@@ -35,6 +35,7 @@ process has done drawing for the first time, showing window after this event
 will have no visual flash:
 
 ```javascript
+const {BrowserWindow} = require('electron')
 let win = new BrowserWindow({show: false})
 win.once('ready-to-show', () => {
   win.show()
@@ -52,6 +53,8 @@ the app feel slow. In this case, it is recommended to show the window
 immediately, and use a `backgroundColor` close to your app's background:
 
 ```javascript
+const {BrowserWindow} = require('electron')
+
 let win = new BrowserWindow({backgroundColor: '#2e2c29'})
 win.loadURL('https://github.com')
 ```
@@ -64,8 +67,12 @@ to set `backgroundColor` to make app feel more native.
 By using `parent` option, you can create child windows:
 
 ```javascript
+const {BrowserWindow} = require('electron')
+
 let top = new BrowserWindow()
 let child = new BrowserWindow({parent: top})
+child.show()
+top.show()
 ```
 
 The `child` window will always show on top of the `top` window.
@@ -76,6 +83,8 @@ A modal window is a child window that disables parent window, to create a modal
 window, you have to set both `parent` and `modal` options:
 
 ```javascript
+const {BrowserWindow} = require('electron')
+
 let child = new BrowserWindow({parent: top, modal: true, show: false})
 child.loadURL('https://github.com')
 child.once('ready-to-show', () => {
@@ -308,14 +317,14 @@ close. For example:
 
 ```javascript
 window.onbeforeunload = (e) => {
-  console.log('I do not want to be closed');
+  console.log('I do not want to be closed')
 
   // Unlike usual browsers that a message box will be prompted to users, returning
   // a non-void value will silently cancel the close.
   // It is recommended to use the dialog API to let the user confirm closing the
   // application.
-  e.returnValue = false;
+  e.returnValue = false
-};
+}
 ```
 
 #### Event: 'closed'
@@ -414,12 +423,14 @@ Commands are lowercased, underscores are replaced with hyphens, and the
 e.g. `APPCOMMAND_BROWSER_BACKWARD` is emitted as `browser-backward`.
 
 ```javascript
-someWindow.on('app-command', (e, cmd) => {
+const {BrowserWindow} = require('electron')
+let win = new BrowserWindow()
+win.on('app-command', (e, cmd) => {
   // Navigate the window back when the user hits their mouse back button
-  if (cmd === 'browser-backward' && someWindow.webContents.canGoBack()) {
+  if (cmd === 'browser-backward' && win.webContents.canGoBack()) {
-    someWindow.webContents.goBack();
+    win.webContents.goBack()
   }
-});
+})
 ```
 
 #### Event: 'scroll-touch-begin' _macOS_
@@ -496,7 +507,10 @@ an Object containing `name` and `version` properties.
 To check if a DevTools extension is installed you can run the following:
 
 ```javascript
+const {BrowserWindow} = require('electron')
+
 let installed = BrowserWindow.getDevToolsExtensions().hasOwnProperty('devtron')
+console.log(installed)
 ```
 
 **Note:** This API cannot be called before the `ready` event of the `app` module
@@ -507,8 +521,10 @@ is emitted.
 Objects created with `new BrowserWindow` have the following properties:
 
 ```javascript
+const {BrowserWindow} = require('electron')
 // In this example `win` is our instance
-let win = new BrowserWindow({width: 800, height: 600});
+let win = new BrowserWindow({width: 800, height: 600})
+win.loadURL('https://github.com')
 ```
 
 #### `win.webContents`
@@ -809,8 +825,11 @@ attached just below the window frame, but you may want to display them beneath
 a HTML-rendered toolbar. For example:
 
 ```javascript
-let toolbarRect = document.getElementById('toolbar').getBoundingClientRect();
+const {BrowserWindow} = require('electron')
-win.setSheetOffset(toolbarRect.height);
+let win = new BrowserWindow()
+
+let toolbarRect = document.getElementById('toolbar').getBoundingClientRect()
+win.setSheetOffset(toolbarRect.height)
 ```
 
 #### `win.flashFrame(flag)`

docs/api/chrome-command-line-switches.md

@@ -7,13 +7,13 @@ your app's main script before the [ready][ready] event of the [app][app] module
 is emitted:
 
 ```javascript
-const {app} = require('electron');
+const {app} = require('electron')
-app.commandLine.appendSwitch('remote-debugging-port', '8315');
+app.commandLine.appendSwitch('remote-debugging-port', '8315')
-app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1');
+app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1')
 
 app.on('ready', () => {
   // Your code here
-});
+})
 ```
 
 ## --ignore-connections-limit=`domains`
@@ -57,6 +57,7 @@ list of hosts. This flag has an effect only if used in tandem with
 For example:
 
 ```javascript
+const {app} = require('electron')
 app.commandLine.appendSwitch('proxy-bypass-list', '<local>;*.google.com;*foo.com;1.2.3.4:5678')
 ```
 

docs/api/clipboard.md

@@ -5,16 +5,17 @@
 The following example shows how to write a string to the clipboard:
 
 ```javascript
-const {clipboard} = require('electron');
+const {clipboard} = require('electron')
-clipboard.writeText('Example String');
+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
-clipboard.writeText('Example String', 'selection');
+const {clipboard} = require('electron')
-console.log(clipboard.readText('selection'));
+clipboard.writeText('Example String', 'selection')
+console.log(clipboard.readText('selection'))
 ```
 
 ## Methods
@@ -109,7 +110,8 @@ Returns an array of supported formats for the clipboard `type`.
 Returns whether the clipboard supports the format of specified `data`.
 
 ```javascript
-console.log(clipboard.has('<p>selection</p>'));
+const {clipboard} = require('electron')
+console.log(clipboard.has('<p>selection</p>'))
 ```
 
 ### `clipboard.read(data[, type])` _Experimental_
@@ -130,6 +132,7 @@ Reads `data` from the clipboard.
 * `type` String (optional)
 
 ```javascript
-clipboard.write({text: 'test', html: "<b>test</b>"});
+const {clipboard} = require('electron')
+clipboard.write({text: 'test', html: '<b>test</b>'})
 ```
 Writes `data` to the clipboard.

docs/api/content-tracing.md

@@ -8,22 +8,22 @@ This module does not include a web interface so you need to open
 result.
 
 ```javascript
-const {contentTracing} = require('electron');
+const {contentTracing} = require('electron')
 
 const options = {
   categoryFilter: '*',
   traceOptions: 'record-until-full,enable-sampling'
-};
+}
 
 contentTracing.startRecording(options, () => {
-  console.log('Tracing started');
+  console.log('Tracing started')
 
   setTimeout(() => {
     contentTracing.stopRecording('', (path) => {
-      console.log('Tracing data recorded to ' + path);
+      console.log('Tracing data recorded to ' + path)
-    });
+    })
-  }, 5000);
+  }, 5000)
-});
+})
 ```
 
 ## Methods

docs/api/crash-reporter.md

@@ -6,14 +6,14 @@ The following is an example of automatically submitting a crash report to a
 remote server:
 
 ```javascript
-const {crashReporter} = require('electron');
+const {crashReporter} = require('electron')
 
 crashReporter.start({
   productName: 'YourName',
   companyName: 'YourCompany',
   submitURL: 'https://your-domain.com/url-to-submit',
   autoSubmit: true
-});
+})
 ```
 
 For setting up a server to accept and process crash reports, you can use

docs/api/desktop-capturer.md

@@ -8,10 +8,10 @@ title is `Electron`:
 
 ```javascript
 // In the renderer process.
-const {desktopCapturer} = require('electron');
+const {desktopCapturer} = require('electron')
 
 desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
-  if (error) throw error;
+  if (error) throw error
   for (let i = 0; i < sources.length; ++i) {
     if (sources[i].name === 'Electron') {
       navigator.webkitGetUserMedia({
@@ -26,18 +26,18 @@ desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
             maxHeight: 720
           }
         }
-      }, handleStream, handleError);
+      }, handleStream, handleError)
-      return;
+      return
     }
   }
-});
+})
 
 function handleStream(stream) {
-  document.querySelector('video').src = URL.createObjectURL(stream);
+  document.querySelector('video').src = URL.createObjectURL(stream)
 }
 
 function handleError(e) {
-  console.log(e);
+  console.log(e)
 }
 ```
 

docs/api/dialog.md

@@ -5,17 +5,16 @@
 An example of showing a dialog to select multiple files and directories:
 
 ```javascript
-let win = ...;  // BrowserWindow in which to show the dialog
+const {dialog} = require('electron')
-const {dialog} = require('electron');
+console.log(dialog.showOpenDialog({properties: ['openFile', 'openDirectory', 'multiSelections']}))
-
-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;
+const {dialog} = require('electron').remote
+console.log(dialog)
 ```
 
 ## Methods
@@ -42,7 +41,7 @@ otherwise it returns `undefined`.
 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']},

docs/api/download-item.md

@@ -8,6 +8,8 @@ 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')

docs/api/file-object.md

@@ -15,19 +15,19 @@ Example on getting a real path from a dragged-onto-the-app file:
 </div>
 
 <script>
-  const holder = document.getElementById('holder');
+  const holder = document.getElementById('holder')
   holder.ondragover = () => {
     return false;
-  };
+  }
   holder.ondragleave = holder.ondragend = () => {
     return false;
-  };
+  }
   holder.ondrop = (e) => {
-    e.preventDefault();
+    e.preventDefault()
     for (let f of e.dataTransfer.files) {
-      console.log('File(s) you dragged here: ', f.path);
+      console.log('File(s) you dragged here: ', f.path)
     }
     return false;
-  };
+  }
 </script>
 ```

docs/api/frameless-window.md

@@ -16,6 +16,7 @@ To create a frameless window, you need to set `frame` to `false` in
 ```javascript
 const {BrowserWindow} = require('electron')
 let win = new BrowserWindow({width: 800, height: 600, frame: false})
+win.show()
 ```
 
 ### Alternatives on macOS
@@ -28,7 +29,9 @@ the window controls ("traffic lights") for standard window actions.
 You can do so by specifying the new `titleBarStyle` option:
 
 ```javascript
+const {BrowserWindow} = require('electron')
 let win = new BrowserWindow({titleBarStyle: 'hidden'})
+win.show()
 ```
 
 ## Transparent window
@@ -37,7 +40,9 @@ 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
@@ -66,6 +71,8 @@ events, you can call the [win.setIgnoreMouseEvents(ignore)][ignore-mouse-events]
 API:
 
 ```javascript
+const {BrowserWindow} = require('electron')
+let win = new BrowserWindow()
 win.setIgnoreMouseEvents(true)
 ```
 

docs/api/global-shortcut.md

@@ -11,29 +11,29 @@ 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');
+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');
+    console.log('CommandOrControl+X is pressed')
-  });
+  })
 
   if (!ret) {
-    console.log('registration failed');
+    console.log('registration failed')
   }
 
   // Check whether a shortcut is registered.
-  console.log(globalShortcut.isRegistered('CommandOrControl+X'));
+  console.log(globalShortcut.isRegistered('CommandOrControl+X'))
-});
+})
 
 app.on('will-quit', () => {
   // Unregister a shortcut.
-  globalShortcut.unregister('CommandOrControl+X');
+  globalShortcut.unregister('CommandOrControl+X')
 
   // Unregister all shortcuts.
-  globalShortcut.unregisterAll();
+  globalShortcut.unregisterAll()
-});
+})
 ```
 
 ## Methods

docs/api/ipc-main.md

@@ -23,27 +23,27 @@ processes:
 
 ```javascript
 // In main process.
-const {ipcMain} = require('electron');
+const {ipcMain} = require('electron')
 ipcMain.on('asynchronous-message', (event, arg) => {
-  console.log(arg);  // prints "ping"
+  console.log(arg)  // prints "ping"
-  event.sender.send('asynchronous-reply', 'pong');
+  event.sender.send('asynchronous-reply', 'pong')
-});
+})
 
 ipcMain.on('synchronous-message', (event, arg) => {
-  console.log(arg);  // prints "ping"
+  console.log(arg)  // prints "ping"
-  event.returnValue = 'pong';
+  event.returnValue = 'pong'
-});
+})
 ```
 
 ```javascript
 // In renderer process (web page).
-const {ipcRenderer} = require('electron');
+const {ipcRenderer} = require('electron')
-console.log(ipcRenderer.sendSync('synchronous-message', 'ping')); // prints "pong"
+console.log(ipcRenderer.sendSync('synchronous-message', 'ping')) // prints "pong"
 
 ipcRenderer.on('asynchronous-reply', (event, arg) => {
-  console.log(arg); // prints "pong"
+  console.log(arg) // prints "pong"
-});
+})
-ipcRenderer.send('asynchronous-message', 'ping');
+ipcRenderer.send('asynchronous-message', 'ping')
 ```
 
 ## Listening for Messages

docs/api/menu.md

@@ -15,18 +15,18 @@ the user right clicks the page:
 ```html
 <!-- index.html -->
 <script>
-const {remote} = require('electron');
+const {remote} = require('electron')
 const {Menu, MenuItem} = remote;
 
-const menu = new Menu();
+const menu = new Menu()
-menu.append(new MenuItem({label: 'MenuItem1', click() { console.log('item 1 clicked'); }}));
+menu.append(new MenuItem({label: 'MenuItem1', click() { console.log('item 1 clicked') }}))
-menu.append(new MenuItem({type: 'separator'}));
+menu.append(new MenuItem({type: 'separator'}))
-menu.append(new MenuItem({label: 'MenuItem2', type: 'checkbox', checked: true}));
+menu.append(new MenuItem({label: 'MenuItem2', type: 'checkbox', checked: true}))
 
 window.addEventListener('contextmenu', (e) => {
-  e.preventDefault();
+  e.preventDefault()
-  menu.popup(remote.getCurrentWindow());
+  menu.popup(remote.getCurrentWindow())
-}, false);
+}, false)
 </script>
 ```
 
@@ -34,6 +34,8 @@ An example of creating the application menu in the render process with the
 simple template API:
 
 ```javascript
+const {Menu} = require('electron')
+
 const template = [
   {
     label: 'Edit',
@@ -64,7 +66,7 @@ const template = [
       },
       {
         role: 'selectall'
-      },
+      }
     ]
   },
   {
@@ -73,8 +75,8 @@ const template = [
       {
         label: 'Reload',
         accelerator: 'CmdOrCtrl+R',
-        click(item, focusedWindow) {
+        click (item, focusedWindow) {
-          if (focusedWindow) focusedWindow.reload();
+          if (focusedWindow) focusedWindow.reload()
         }
       },
       {
@@ -83,11 +85,10 @@ const template = [
       {
         label: 'Toggle Developer Tools',
         accelerator: process.platform === 'darwin' ? 'Alt+Command+I' : 'Ctrl+Shift+I',
-        click(item, focusedWindow) {
+        click (item, focusedWindow) {
-          if (focusedWindow)
+          if (focusedWindow) focusedWindow.webContents.toggleDevTools()
-            focusedWindow.webContents.toggleDevTools();
+        }
       }
-      },
     ]
   },
   {
@@ -98,7 +99,7 @@ const template = [
       },
       {
         role: 'close'
-      },
+      }
     ]
   },
   {
@@ -106,14 +107,14 @@ const template = [
     submenu: [
       {
         label: 'Learn More',
-        click() { require('electron').shell.openExternal('http://electron.atom.io'); }
+        click () { require('electron').shell.openExternal('http://electron.atom.io') }
-      },
+      }
     ]
-  },
+  }
-];
+]
 
 if (process.platform === 'darwin') {
-  const name = require('electron').remote.app.getName();
+  const name = require('electron').remote.app.getName()
   template.unshift({
     label: name,
     submenu: [
@@ -144,9 +145,9 @@ if (process.platform === 'darwin') {
       },
       {
         role: 'quit'
-      },
+      }
     ]
-  });
+  })
   // Window menu.
   template[3].submenu = [
     {
@@ -170,11 +171,11 @@ if (process.platform === 'darwin') {
       label: 'Bring All to Front',
       role: 'front'
     }
-  ];
+  ]
 }
 
-const menu = Menu.buildFromTemplate(template);
+const menu = Menu.buildFromTemplate(template)
-Menu.setApplicationMenu(menu);
+Menu.setApplicationMenu(menu)
 ```
 
 ## Class: Menu
@@ -320,7 +321,7 @@ the first item.
 
 Template:
 
-```javascript
+```
 [
   {label: '4', id: '4'},
   {label: '5', id: '5'},
@@ -342,7 +343,7 @@ Menu:
 
 Template:
 
-```javascript
+```
 [
   {label: 'a', position: 'endof=letters'},
   {label: '1', position: 'endof=numbers'},

docs/api/native-image.md

@@ -9,15 +9,20 @@ 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
@@ -55,7 +60,9 @@ images/
 
 
 ```javascript
+const {Tray} = require('electron')
 let appIcon = new Tray('/Users/somebody/images/icon.png')
+console.log(appIcon)
 ```
 
 Following suffixes for DPI are also supported:
@@ -105,8 +112,10 @@ Creates an empty `NativeImage` instance.
 Creates a new `NativeImage` instance from a file located at `path`.
 
 ```javascript
-const {nativeImage} = require('electron')
+const nativeImage = require('electron').nativeImage
+
 let image = nativeImage.createFromPath('/Users/somebody/images/icon.png')
+console.log(image)
 ```
 
 ### `nativeImage.createFromBuffer(buffer[, scaleFactor])`

docs/api/power-monitor.md

@@ -8,11 +8,13 @@ event of the `app` module is emitted.
 For example:
 
 ```javascript
+const {app} = require('electron')
+
 app.on('ready', () => {
   require('electron').powerMonitor.on('suspend', () => {
-    console.log('The system is going to sleep');
+    console.log('The system is going to sleep')
-  });
+  })
-});
+})
 ```
 
 ## Events

docs/api/power-save-blocker.md

@@ -5,12 +5,12 @@
 For example:
 
 ```javascript
-const {powerSaveBlocker} = require('electron');
+const {powerSaveBlocker} = require('electron')
 
-const id = powerSaveBlocker.start('prevent-display-sleep');
+const id = powerSaveBlocker.start('prevent-display-sleep')
-console.log(powerSaveBlocker.isStarted(id));
+console.log(powerSaveBlocker.isStarted(id))
 
-powerSaveBlocker.stop(id);
+powerSaveBlocker.stop(id)
 ```
 
 ## Methods

docs/api/process.md

@@ -16,12 +16,12 @@ the global scope when node integration is turned off:
 
 ```javascript
 // preload.js
-const _setImmediate = setImmediate;
+const _setImmediate = setImmediate
-const _clearImmediate = clearImmediate;
+const _clearImmediate = clearImmediate
 process.once('loaded', () => {
-  global.setImmediate = _setImmediate;
+  global.setImmediate = _setImmediate
-  global.clearImmediate = _clearImmediate;
+  global.clearImmediate = _clearImmediate
-});
+})
 ```
 
 ## Properties

docs/api/protocol.md

@@ -6,19 +6,19 @@ An example of implementing a protocol that has the same effect as the
 `file://` protocol:
 
 ```javascript
-const {app, protocol} = require('electron');
+const {app, protocol} = require('electron')
-const path = require('path');
+const path = require('path')
 
 app.on('ready', () => {
   protocol.registerFileProtocol('atom', (request, callback) => {
-    const url = request.url.substr(7);
+    const url = request.url.substr(7)
-    callback({path: path.normalize(__dirname + '/' + url)});
+    callback({path: path.normalize(`${__dirname}/${url}`)})
   }, (error) => {
-    if (error)
+    if (error) console.error('Failed to register protocol')
-      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.
 
@@ -52,10 +52,12 @@ So if you want to register a custom protocol to replace the `http` protocol, you
 have to register it as standard scheme:
 
 ```javascript
-protocol.registerStandardSchemes(['atom']);
+const {app, protocol} = require('electron')
+
+protocol.registerStandardSchemes(['atom'])
 app.on('ready', () => {
-  protocol.registerHttpProtocol('atom', ...);
+  protocol.registerHttpProtocol('atom', '...')
-});
+})
 ```
 
 **Note:** This method can only be used before the `ready` event of the `app`
@@ -119,12 +121,13 @@ should be called with either a `Buffer` object or an object that has the `data`,
 Example:
 
 ```javascript
+const {protocol} = require('electron')
+
 protocol.registerBufferProtocol('atom', (request, callback) => {
-  callback({mimeType: 'text/html', data: new Buffer('<h5>Response</h5>')});
+  callback({mimeType: 'text/html', data: new Buffer('<h5>Response</h5>')})
 }, (error) => {
-  if (error)
+  if (error) console.error('Failed to register protocol')
-    console.error('Failed to register protocol');
+})
-});
 ```
 
 ### `protocol.registerStringProtocol(scheme, handler[, completion])`

docs/api/remote.md

@@ -14,10 +14,9 @@ similar to Java's [RMI][rmi]. An example of creating a browser window from a
 renderer process:
 
 ```javascript
-const {BrowserWindow} = require('electron').remote;
+const {BrowserWindow} = require('electron').remote
-
+let win = new BrowserWindow({width: 800, height: 600})
-let win = new BrowserWindow({width: 800, height: 600});
+win.loadURL('https://github.com')
-win.loadURL('https://github.com');
 ```
 
 **Note:** for the reverse (access the renderer process from the main process),
@@ -70,23 +69,22 @@ For instance you can't use a function from the renderer process in an
 ```javascript
 // main process mapNumbers.js
 exports.withRendererCallback = (mapper) => {
-  return [1,2,3].map(mapper);
+  return [1, 2, 3].map(mapper)
-};
+}
 
 exports.withLocalCallback = () => {
-  return [1,2,3].map(x => x + 1);
+  return [1, 2, 3].map(x => x + 1)
-};
+}
 ```
 
 ```javascript
 // renderer process
-const mapNumbers = require('electron').remote.require('./mapNumbers');
+const mapNumbers = require('electron').remote.require('./mapNumbers')
+const withRendererCb = mapNumbers.withRendererCallback(x => x + 1)
+const withLocalCb = mapNumbers.withLocalCallback()
 
-const withRendererCb = mapNumbers.withRendererCallback(x => x + 1);
+console.log(withRendererCb, withLocalCb)
-
+// [undefined, undefined, undefined], [2, 3, 4]
-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
@@ -100,9 +98,9 @@ For example, the following code seems innocent at first glance. It installs a
 callback for the `close` event on a remote object:
 
 ```javascript
-remote.getCurrentWindow().on('close', () => {
+require('electron').remote.getCurrentWindow().on('close', () => {
-  // blabla...
+  // window was closed...
-});
+})
 ```
 
 But remember the callback is referenced by the main process until you
@@ -124,7 +122,8 @@ 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 = remote.app;
+const app = require('electron').remote.app
+console.log(app)
 ```
 
 ## Methods

docs/api/screen.md

@@ -21,7 +21,8 @@ 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:
@@ -43,6 +44,7 @@ app.on('ready', () => {
       x: externalDisplay.bounds.x + 50,
       y: externalDisplay.bounds.y + 50
     })
+    win.loadURL('https://github.com')
   }
 })
 ```

docs/api/session.md

@@ -1,4 +1,4 @@
-# session
+ # session
 
 > Manage browser sessions, cookies, cache, proxy settings, etc.
 
@@ -8,12 +8,13 @@ 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 {session, BrowserWindow} = require('electron')
+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
@@ -52,9 +53,9 @@ Returns the default session object of the app.
 You can create a `Session` object in the `session` module:
 
 ```javascript
-const session = require('electron').session;
+const {session} = require('electron')
-
+const ses = session.fromPartition('persist:name')
-const ses = session.fromPartition('persist:name');
+console.log(ses.getUserAgent())
 ```
 
 ### Instance Events
@@ -73,12 +74,13 @@ 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();
+  event.preventDefault()
   require('request')(item.getURL(), (data) => {
-    require('fs').writeFileSync('/somewhere', data);
+    require('fs').writeFileSync('/somewhere', data)
-  });
+  })
-});
+})
 ```
 
 ### Instance Methods
@@ -223,10 +225,10 @@ window.webContents.session.enableNetworkEmulation({
   latency: 500,
   downloadThroughput: 6400,
   uploadThroughput: 6400
-});
+})
 
 // To emulate a network outage.
-window.webContents.session.enableNetworkEmulation({offline: true});
+window.webContents.session.enableNetworkEmulation({offline: true})
 ```
 
 #### `ses.disableNetworkEmulation()`
@@ -247,12 +249,12 @@ Calling `setCertificateVerifyProc(null)` will revert back to default certificate
 verify proc.
 
 ```javascript
-myWindow.webContents.session.setCertificateVerifyProc((hostname, cert, callback) => {
+const {BrowserWindow} = require('electron')
-  if (hostname === 'github.com')
+let win = new BrowserWindow()
-    callback(true);
+
-  else
+win.webContents.session.setCertificateVerifyProc((hostname, cert, callback) => {
-    callback(false);
+  callback(hostname === 'github.com')
-});
+})
 ```
 
 #### `ses.setPermissionRequestHandler(handler)`
@@ -267,16 +269,14 @@ Sets the handler which can be used to respond to permission requests for the `se
 Calling `callback(true)` will allow the permission and `callback(false)` will reject it.
 
 ```javascript
-session.fromPartition(partition).setPermissionRequestHandler((webContents, permission, callback) => {
+const {session} = require('electron')
-  if (webContents.getURL() === host) {
+session.fromPartition('some-partition').setPermissionRequestHandler((webContents, permission, callback) => {
-    if (permission === 'notifications') {
+  if (webContents.getURL() === 'some-host' && permission === 'notifications') {
-      callback(false); // denied.
+    return callback(false) // denied.
-      return;
-    }
   }
 
-  callback(true);
+  callback(true)
-});
+})
 ```
 
 #### `ses.clearHostResolverCache([callback])`
@@ -294,6 +294,7 @@ 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')
@@ -340,13 +341,12 @@ const {app, session} = require('electron')
 const path = require('path')
 
 app.on('ready', function () {
-  const protocol = session.fromPartition(partitionName).protocol
+  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)})
+    callback({path: path.normalize(`${__dirname}/${url}`)})
   }, function (error) {
-    if (error)
+    if (error) console.error('Failed to register protocol')
-      console.error('Failed to register protocol')
   })
 })
 ```
@@ -359,22 +359,23 @@ The `Cookies` class gives you ability to query and modify cookies. Instances of
 For example:
 
 ```javascript
+const {session} = require('electron')
+
 // Query all cookies.
 session.defaultSession.cookies.get({}, (error, cookies) => {
-  console.log(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(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)
+  if (error) console.error(error)
-    console.error(error)
 })
 ```
 
@@ -464,13 +465,15 @@ called with an `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"
+  details.requestHeaders['User-Agent'] = 'MyAgent'
   callback({cancel: false, requestHeaders: details.requestHeaders})
 })
 ```

docs/api/shell.md

@@ -7,9 +7,9 @@ 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');
+const {shell} = require('electron')
 
-shell.openExternal('https://github.com');
+shell.openExternal('https://github.com')
 ```
 
 ## Methods

docs/api/synopsis.md

@@ -19,14 +19,13 @@ 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');
+const {app, BrowserWindow} = require('electron')
-
+let win = null
-let win = null;
 
 app.on('ready', () => {
-  win = new BrowserWindow({width: 800, height: 600});
+  win = new BrowserWindow({width: 800, height: 600})
-  win.loadURL('https://github.com');
+  win.loadURL('https://github.com')
-});
+})
 ```
 
 The renderer process is no different than a normal web page, except for the
@@ -37,8 +36,8 @@ extra ability to use node modules:
 <html>
 <body>
 <script>
-  const {app} = require('electron').remote;
+  const {app} = require('electron').remote
-  console.log(app.getVersion());
+  console.log(app.getVersion())
 </script>
 </body>
 </html>
@@ -53,23 +52,43 @@ As of 0.37, you can use
 built-in modules.
 
 ```javascript
-const {app, BrowserWindow} = require('electron');
+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 electron = require('electron')
-const {app, BrowserWindow} = 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 electron = require('electron')
-const app = electron.app;
+const app = electron.app
-const BrowserWindow = electron.BrowserWindow;
+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

docs/api/system-preferences.md

@@ -3,8 +3,8 @@
 > Get system preferences.
 
 ```javascript
-const {systemPreferences} = require('electron');
+const {systemPreferences} = require('electron')
-console.log(systemPreferences.isDarkMode());
+console.log(systemPreferences.isDarkMode())
 ```
 
 ## Methods
@@ -79,23 +79,24 @@ 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
-let browserOptions = {width: 1000, height: 800};
+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.transparent = true
-  browserOptions.frame = false;
+  browserOptions.frame = false
 }
 
 // Create the window.
-let win = new BrowserWindow(browserOptions);
+let win = new BrowserWindow(browserOptions)
 
 // Navigate.
 if (browserOptions.transparent) {
-  win.loadURL('file://' + __dirname + '/index.html');
+  win.loadURL(`file://${__dirname}/index.html`)
 } else {
   // No transparency, so we load a fallback that uses basic styles.
-  win.loadURL('file://' + __dirname + '/fallback.html');
+  win.loadURL(`file://${__dirname}/fallback.html`)
 }
 ```
 

docs/api/tray.md

@@ -13,7 +13,7 @@ app.on('ready', () => {
     {label: 'Item2', type: 'radio'},
     {label: 'Item3', type: 'radio', checked: true},
     {label: 'Item4', type: 'radio'}
-  ]);
+  ])
   tray.setToolTip('This is my application.')
   tray.setContextMenu(contextMenu)
 })
@@ -31,8 +31,18 @@ __Platform limitations:__
   you have to call `setContextMenu` again. For example:
 
 ```javascript
-contextMenu.items[2].checked = false;
+const {Menu, Tray} = require('electron')
-appIcon.setContextMenu(contextMenu);
+const 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[2].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.
 

docs/api/web-contents.md

@@ -9,12 +9,13 @@ the [`BrowserWindow`](browser-window.md) object. An example of accessing the
 `webContents` object:
 
 ```javascript
-const {BrowserWindow} = require('electron');
+const {BrowserWindow} = require('electron')
 
-let win = new BrowserWindow({width: 800, height: 1500});
+let win = new BrowserWindow({width: 800, height: 1500})
-win.loadURL('http://github.com');
+win.loadURL('http://github.com')
 
-let contents = win.webContents;
+let contents = win.webContents
+console.log(contents)
 ```
 
 ## Methods
@@ -22,7 +23,8 @@ let contents = win.webContents;
 These methods can be accessed from the `webContents` module:
 
 ```js
-const {webContents} = require('electron');
+const {webContents} = require('electron')
+console.log(webContents)
 ```
 
 ### `webContents.getAllWebContents()`
@@ -431,6 +433,7 @@ first available device will be selected. `callback` should be called with
 cancel the request.
 
 ```javascript
+const {app, webContents} = require('electron')
 app.commandLine.appendSwitch('enable-web-bluetooth')
 
 app.on('ready', () => {
@@ -467,8 +470,9 @@ e.g. the `http://` or `file://`. If the load should bypass http cache then
 use the `pragma` header to achieve it.
 
 ```javascript
-const options = {extraHeaders: 'pragma: no-cache\n'};
+const {webContents} = require('electron')
-webContents.loadURL(url, options);
+const options = {extraHeaders: 'pragma: no-cache\n'}
+webContents.loadURL('https://github.com', options)
 ```
 
 #### `contents.downloadURL(url)`
@@ -483,10 +487,12 @@ Initiates a download of the resource at `url` without navigating. The
 Returns URL of the current web page.
 
 ```javascript
-let win = new BrowserWindow({width: 800, height: 600});
+const {BrowserWindow} = require('electron')
-win.loadURL('http://github.com');
+let win = new BrowserWindow({width: 800, height: 600})
+win.loadURL('http://github.com')
 
-let currentURL = win.webContents.getURL();
+let currentURL = win.webContents.getURL()
+console.log(currentURL)
 ```
 
 #### `contents.getTitle()`
@@ -690,12 +696,13 @@ the request can be obtained by subscribing to
 Stops any `findInPage` request for the `webContents` with the provided `action`.
 
 ```javascript
+const {webContents} = require('electron')
 webContents.on('found-in-page', (event, result) => {
-  if (result.finalUpdate)
+  if (result.finalUpdate) webContents.stopFindInPage('clearSelection')
-    webContents.stopFindInPage('clearSelection');
+})
-});
 
-const requestId = webContents.findInPage('api');
+const requestId = webContents.findInPage('api')
+console.log(requestId)
 ```
 
 #### `contents.capturePage([rect, ]callback)`
@@ -761,7 +768,7 @@ The `callback` will be called with `callback(error, data)` on completion. The
 
 By default, an empty `options` will be regarded as:
 
-```javascript
+```
 {
   marginsType: 0,
   printBackground: false,
@@ -773,23 +780,22 @@ By default, an empty `options` will be regarded as:
 An example of `webContents.printToPDF`:
 
 ```javascript
-const {BrowserWindow} = require('electron');
+const {BrowserWindow} = require('electron')
-const fs = require('fs');
+const fs = require('fs')
 
-let win = new BrowserWindow({width: 800, height: 600});
+let win = new BrowserWindow({width: 800, height: 600})
-win.loadURL('http://github.com');
+win.loadURL('http://github.com')
 
 win.webContents.on('did-finish-load', () => {
   // Use default printing options
   win.webContents.printToPDF({}, (error, data) => {
-    if (error) throw error;
+    if (error) throw error
     fs.writeFile('/tmp/print.pdf', data, (error) => {
-      if (error)
+      if (error) throw error
-        throw error;
+      console.log('Write PDF successfully.')
-      console.log('Write PDF successfully.');
+    })
-    });
+  })
-  });
+})
-});
 ```
 
 #### `contents.addWorkSpace(path)`
@@ -800,9 +806,11 @@ Adds the specified path to DevTools workspace. Must be used after DevTools
 creation:
 
 ```javascript
+const {BrowserWindow} = require('electron')
+let win = new BrowserWindow()
 win.webContents.on('devtools-opened', () => {
-  win.webContents.addWorkSpace(__dirname);
+  win.webContents.addWorkSpace(__dirname)
-});
+})
 ```
 
 #### `contents.removeWorkSpace(path)`
@@ -863,15 +871,16 @@ An example of sending messages from the main process to the renderer process:
 
 ```javascript
 // In the main process.
-let win = null;
+const {app, BrowserWindow} = require('electron')
+let win = null
 
 app.on('ready', () => {
-  win = new BrowserWindow({width: 800, height: 600});
+  win = new BrowserWindow({width: 800, height: 600})
-  win.loadURL(`file://${__dirname}/index.html`);
+  win.loadURL(`file://${__dirname}/index.html`)
   win.webContents.on('did-finish-load', () => {
-    win.webContents.send('ping', 'whoooooooh!');
+    win.webContents.send('ping', 'whoooooooh!')
-  });
+  })
-});
+})
 ```
 
 ```html
@@ -880,8 +889,8 @@ app.on('ready', () => {
 <body>
   <script>
     require('electron').ipcRenderer.on('ping', (event, message) => {
-      console.log(message);  // Prints "whoooooooh!"
+      console.log(message)  // Prints 'whoooooooh!'
-    });
+    })
   </script>
 </body>
 </html>
@@ -1010,14 +1019,16 @@ the cursor when dragging.
 Returns true if the process of saving page has been initiated successfully.
 
 ```javascript
-win.loadURL('https://github.com');
+const {BrowserWindow} = require('electron')
+let win = new BrowserWindow()
+
+win.loadURL('https://github.com')
 
 win.webContents.on('did-finish-load', () => {
   win.webContents.savePage('/tmp/test.html', 'HTMLComplete', (error) => {
-    if (!error)
+    if (!error) console.log('Save page successfully')
-      console.log('Save page successfully');
+  })
-  });
+})
-});
 ```
 
 #### `contents.showDefinitionForSelection()` _macOS_
@@ -1054,24 +1065,28 @@ Get the debugger instance for this webContents.
 Debugger API serves as an alternate transport for [remote debugging protocol][rdp].
 
 ```javascript
+const {BrowserWindow} = require('electron')
+let win = new BrowserWindow()
+
 try {
-  win.webContents.debugger.attach('1.1');
+  win.webContents.debugger.attach('1.1')
-} catch(err) {
+} catch (err) {
-  console.log('Debugger attach failed : ', err);
+  console.log('Debugger attach failed : ', err)
-};
+}
 
 win.webContents.debugger.on('detach', (event, reason) => {
-  console.log('Debugger detached due to : ', 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')
+    if (params.request.url === 'https://www.github.com') {
-      win.webContents.debugger.detach();
+      win.webContents.debugger.detach()
     }
-});
+  }
+})
 
-win.webContents.debugger.sendCommand('Network.enable');
+win.webContents.debugger.sendCommand('Network.enable')
 ```
 
 ### Instance Methods

docs/api/web-frame.md

@@ -5,9 +5,9 @@
 An example of zooming current page to 200%.
 
 ```javascript
-const {webFrame} = require('electron');
+const {webFrame} = require('electron')
 
-webFrame.setZoomFactor(2);
+webFrame.setZoomFactor(2)
 ```
 
 ## Methods
@@ -58,11 +58,12 @@ 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) {
+  spellCheck (text) {
-    return !(require('spellchecker').isMisspelled(text));
+    return !(require('spellchecker').isMisspelled(text))
   }
-});
+})
 ```
 
 ### `webFrame.registerURLSchemeAsSecure(scheme)`
@@ -112,12 +113,13 @@ 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,
@@ -130,8 +132,8 @@ This will generate:
   cssStyleSheets: { /* same with "images" */ },
   xslStyleSheets: { /* same with "images" */ },
   fonts: { /* same with "images" */ },
-  other: { /* same with "images" */ },
+  other: { /* same with "images" */ }
-}
+})
 ```
 
 ### `webFrame.clearCache()`

docs/api/web-view-tag.md

@@ -12,7 +12,7 @@ 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 purpose, `webview` can only be used in `BrowserWindow`s that have
+For security purposes, `webview` can only be used in `BrowserWindow`s that have
 `nodeIntegration` enabled.
 
 ## Example
@@ -35,20 +35,20 @@ and displays a "loading..." message during the load time:
 ```html
 <script>
   onload = () => {
-    const webview = document.getElementById('foo');
+    const webview = document.getElementById('foo')
-    const indicator = document.querySelector('.indicator');
+    const indicator = document.querySelector('.indicator')
 
     const loadstart = () => {
-      indicator.innerText = 'loading...';
+      indicator.innerText = 'loading...'
-    };
+    }
 
     const loadstop = () => {
-      indicator.innerText = '';
+      indicator.innerText = ''
-    };
+    }
 
-    webview.addEventListener('did-start-loading', loadstart);
+    webview.addEventListener('did-start-loading', loadstart)
-    webview.addEventListener('did-stop-loading', loadstop);
+    webview.addEventListener('did-stop-loading', loadstop)
-  };
+  }
 </script>
 ```
 
@@ -223,9 +223,10 @@ The `webview` tag has the following methods:
 **Example**
 
 ```javascript
+const webview = document.getElementById('foo')
 webview.addEventListener('dom-ready', () => {
-  webview.openDevTools();
+  webview.openDevTools()
-});
+})
 ```
 
 ### `<webview>.loadURL(url[, options])`
@@ -618,9 +619,10 @@ 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);
+  console.log('Guest page logged a message:', e.message)
-});
+})
 ```
 
 ### Event: 'found-in-page'
@@ -638,12 +640,13 @@ Fired when a result is available for
 [`webview.findInPage`](web-view-tag.md#webviewtagfindinpage) request.
 
 ```javascript
+const webview = document.getElementById('foo')
 webview.addEventListener('found-in-page', (e) => {
-  if (e.result.finalUpdate)
+  if (e.result.finalUpdate) webview.stopFindInPage('keepSelection')
-    webview.stopFindInPage('keepSelection');
+})
-});
 
-const requestId = webview.findInPage('test');
+const requestId = webview.findInPage('test')
+console.log(requestId)
 ```
 
 ### Event: 'new-window'
@@ -662,14 +665,15 @@ 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 {shell} = require('electron')
+const webview = document.getElementById('foo')
 
 webview.addEventListener('new-window', (e) => {
-  const protocol = require('url').parse(e.url).protocol;
+  const protocol = require('url').parse(e.url).protocol
   if (protocol === 'http:' || protocol === 'https:') {
-    shell.openExternal(e.url);
+    shell.openExternal(e.url)
   }
-});
+})
 ```
 
 ### Event: 'will-navigate'
@@ -722,9 +726,10 @@ 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';
+  webview.src = 'about:blank'
-});
+})
 ```
 
 ### Event: 'ipc-message'
@@ -741,19 +746,20 @@ between guest page and embedder page:
 
 ```javascript
 // In embedder page.
+const webview = document.getElementById('foo')
 webview.addEventListener('ipc-message', (event) => {
-  console.log(event.channel);
+  console.log(event.channel)
   // Prints "pong"
-});
+})
-webview.send('ping');
+webview.send('ping')
 ```
 
 ```javascript
 // In guest page.
-const {ipcRenderer} = require('electron');
+const {ipcRenderer} = require('electron')
 ipcRenderer.on('ping', () => {
-  ipcRenderer.sendToHost('pong');
+  ipcRenderer.sendToHost('pong')
-});
+})
 ```
 
 ### Event: 'crashed'

docs/faq.md

@@ -36,17 +36,17 @@ renderers through the `remote` property of `electron` module:
 // In the main process.
 global.sharedObject = {
   someProperty: 'default value'
-};
+}
 ```
 
 ```javascript
 // In page 1.
-require('electron').remote.getGlobal('sharedObject').someProperty = 'new value';
+require('electron').remote.getGlobal('sharedObject').someProperty = 'new value'
 ```
 
 ```javascript
 // In page 2.
-console.log(require('electron').remote.getGlobal('sharedObject').someProperty);
+console.log(require('electron').remote.getGlobal('sharedObject').someProperty)
 ```
 
 ## My app's window/tray disappeared after a few minutes.
@@ -63,18 +63,22 @@ If you want a quick fix, you can make the variables global by changing your
 code from this:
 
 ```javascript
+const {app, Tray} = require('electron')
 app.on('ready', () => {
-  const tray = new Tray('/path/to/icon.png');
+  const tray = new Tray('/path/to/icon.png')
-});
+  tray.setTitle('hello world')
+})
 ```
 
 to this:
 
 ```javascript
-let tray = null;
+const {app, Tray} = require('electron')
+let tray = null
 app.on('ready', () => {
-  tray = new Tray('/path/to/icon.png');
+  tray = new Tray('/path/to/icon.png')
-});
+  tray.setTitle('hello world')
+})
 ```
 
 ## I can not use jQuery/RequireJS/Meteor/AngularJS in Electron.
@@ -87,11 +91,13 @@ To solve this, you can turn off node integration in Electron:
 
 ```javascript
 // In the main process.
+const {BrowserWindow} = require('electron')
 let win = new BrowserWindow({
   webPreferences: {
     nodeIntegration: false
   }
-});
+})
+win.show()
 ```
 
 But if you want to keep the abilities of using Node.js and Electron APIs, you
@@ -114,7 +120,7 @@ delete window.module;
 When using Electron's built-in module you might encounter an error like this:
 
 ```
-> require('electron').webFrame.setZoomFactor(1.0);
+> require('electron').webFrame.setZoomFactor(1.0)
 Uncaught TypeError: Cannot read property 'setZoomLevel' of undefined
 ```
 
@@ -125,7 +131,7 @@ To verify whether you are using the correct built-in module, you can print the
 path of the `electron` module:
 
 ```javascript
-console.log(require.resolve('electron'));
+console.log(require.resolve('electron'))
 ```
 
 and then check if it is in the following form:

docs/tutorial/application-packaging.md

@@ -51,29 +51,29 @@ $ asar list /path/to/example.asar
 Read a file in the `asar` archive:
 
 ```javascript
-const fs = require('fs');
+const fs = require('fs')
-fs.readFileSync('/path/to/example.asar/file.txt');
+fs.readFileSync('/path/to/example.asar/file.txt')
 ```
 
 List all files under the root of the archive:
 
 ```javascript
-const fs = require('fs');
+const fs = require('fs')
-fs.readdirSync('/path/to/example.asar');
+fs.readdirSync('/path/to/example.asar')
 ```
 
 Use a module from the archive:
 
 ```javascript
-require('/path/to/example.asar/dir/module.js');
+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');
+const {BrowserWindow} = require('electron')
-let win = new BrowserWindow({width: 800, height: 600});
+let win = new BrowserWindow({width: 800, height: 600})
-win.loadURL('file:///path/to/example.asar/static/index.html');
+win.loadURL('file:///path/to/example.asar/static/index.html')
 ```
 
 ### Web API
@@ -85,10 +85,10 @@ For example, to get a file with `$.get`:
 
 ```html
 <script>
-let $ = require('./jquery.min.js');
+let $ = require('./jquery.min.js')
 $.get('file:///path/to/example.asar/file.txt', (data) => {
-  console.log(data);
+  console.log(data)
-});
+})
 </script>
 ```
 
@@ -99,16 +99,17 @@ content of an `asar` archive as a file. For this purpose you can use the built-i
 `original-fs` module which provides original `fs` APIs without `asar` support:
 
 ```javascript
-const originalFs = require('original-fs');
+const originalFs = require('original-fs')
-originalFs.readFileSync('/path/to/example.asar');
+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
-process.noAsar = true;
+const fs = require('fs')
-fs.readFileSync('/path/to/example.asar');
+process.noAsar = true
+fs.readFileSync('/path/to/example.asar')
 ```
 
 ## Limitations of the Node API

docs/tutorial/desktop-environment-integration.md

@@ -20,11 +20,11 @@ the currently running operating system's native notification APIs to display it.
 ```javascript
 let myNotification = new Notification('Title', {
   body: 'Lorem Ipsum Dolor Sit Amet'
-});
+})
 
 myNotification.onclick = () => {
-  console.log('Notification clicked');
+  console.log('Notification clicked')
-};
+}
 ```
 
 While code and user experience across operating systems are similar, there
@@ -75,14 +75,16 @@ To add a file to recent documents, you can use the
 [app.addRecentDocument][addrecentdocument] API:
 
 ```javascript
-app.addRecentDocument('/Users/USERNAME/Desktop/work.type');
+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
-app.clearRecentDocuments();
+const {app} = require('electron')
+app.clearRecentDocuments()
 ```
 
 ### Windows Notes
@@ -113,19 +115,17 @@ To set your custom dock menu, you can use the `app.dock.setMenu` API, which is
 only available on macOS:
 
 ```javascript
-const electron = require('electron');
+const {app, Menu} = require('electron')
-const app = electron.app;
-const Menu = electron.Menu;
 
 const dockMenu = Menu.buildFromTemplate([
-  { label: 'New Window', click() { console.log('New Window'); } },
+  {label: 'New Window', click () { console.log('New Window') }},
-  { label: 'New Window with Settings', submenu: [
+  {label: 'New Window with Settings', submenu: [
-    { label: 'Basic' },
+    {label: 'Basic'},
-    { label: 'Pro'}
+    {label: 'Pro'}
   ]},
-  { label: 'New Command...'}
+  {label: 'New Command...'}
-]);
+])
-app.dock.setMenu(dockMenu);
+app.dock.setMenu(dockMenu)
 ```
 
 ## User Tasks (Windows)
@@ -162,6 +162,7 @@ To set user tasks for your application, you can use
 [app.setUserTasks][setusertaskstasks] API:
 
 ```javascript
+const {app} = require('electron')
 app.setUserTasks([
   {
     program: process.execPath,
@@ -171,13 +172,14 @@ app.setUserTasks([
     title: 'New Window',
     description: 'Create a new window'
   }
-]);
+])
 ```
 
 To clean your tasks list, just call `app.setUserTasks` with an empty array:
 
 ```javascript
-app.setUserTasks([]);
+const {app} = require('electron')
+app.setUserTasks([])
 ```
 
 The user tasks will still show even after your application closes, so the icon
@@ -209,34 +211,36 @@ You can use [BrowserWindow.setThumbarButtons][setthumbarbuttons] to set
 thumbnail toolbar in your application:
 
 ```javascript
-const {BrowserWindow} = require('electron');
+const {BrowserWindow} = require('electron')
-const path = require('path');
+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'); }
+    click () { console.log('button1 clicked') }
   },
   {
     tooltip: 'button2',
     icon: path.join(__dirname, 'button2.png'),
     flags: ['enabled', 'dismissonclick'],
-    click() { console.log('button2 clicked.'); }
+    click () { console.log('button2 clicked.') }
   }
-]);
+])
 ```
 
 To clean thumbnail toolbar buttons, just call `BrowserWindow.setThumbarButtons`
 with an empty array:
 
 ```javascript
-win.setThumbarButtons([]);
+const {BrowserWindow} = require('electron')
+let win = new BrowserWindow()
+win.setThumbarButtons([])
 ```
 
 ## Unity Launcher Shortcuts (Linux)
@@ -267,8 +271,9 @@ To set the progress bar for a Window, you can use the
 [BrowserWindow.setProgressBar][setprogressbar] API:
 
 ```javascript
-let win = new BrowserWindow({...});
+const {BrowserWindow} = require('electron')
-win.setProgressBar(0.5);
+let win = new BrowserWindow()
+win.setProgressBar(0.5)
 ```
 
 ## Icon Overlays in Taskbar (Windows)
@@ -294,8 +299,9 @@ To set the overlay icon for a window, you can use the
 [BrowserWindow.setOverlayIcon][setoverlayicon] API:
 
 ```javascript
-let win = new BrowserWindow({...});
+const {BrowserWindow} = require('electron')
-win.setOverlayIcon('path/to/overlay.png', 'Description for overlay');
+let win = new BrowserWindow()
+win.setOverlayIcon('path/to/overlay.png', 'Description for overlay')
 ```
 
 ## Represented File of Window (macOS)
@@ -316,9 +322,10 @@ To set the represented file of window, you can use the
 [BrowserWindow.setDocumentEdited][setdocumentedited] APIs:
 
 ```javascript
-let win = new BrowserWindow({...});
+const {BrowserWindow} = require('electron')
-win.setRepresentedFilename('/etc/passwd');
+let win = new BrowserWindow()
-win.setDocumentEdited(true);
+win.setRepresentedFilename('/etc/passwd')
+win.setDocumentEdited(true)
 ```
 
 ## Dragging files out of the window
@@ -342,6 +349,7 @@ In web page:
 In the main process:
 
 ```javascript
+const {ipcMain} = require('electron')
 ipcMain.on('ondragstart', (event, filePath) => {
   event.sender.startDrag({
     file: filePath,

docs/tutorial/online-offline-events.md

@@ -6,16 +6,14 @@ using standard HTML5 APIs, as shown in the following example.
 _main.js_
 
 ```javascript
-const electron = require('electron');
+const {app, BrowserWindow} = require('electron')
-const app = electron.app;
-const BrowserWindow = electron.BrowserWindow;
 
-let onlineStatusWindow;
+let onlineStatusWindow
 
 app.on('ready', () => {
-  onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false });
+  onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
-  onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`);
+  onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
-});
+})
 ```
 
 _online-status.html_
@@ -26,13 +24,13 @@ _online-status.html_
 <body>
 <script>
   const alertOnlineStatus = () => {
-    window.alert(navigator.onLine ? 'online' : 'offline');
+    window.alert(navigator.onLine ? 'online' : 'offline')
-  };
+  }
 
-  window.addEventListener('online',  alertOnlineStatus);
+  window.addEventListener('online',  alertOnlineStatus)
-  window.addEventListener('offline',  alertOnlineStatus);
+  window.addEventListener('offline',  alertOnlineStatus)
 
-  alertOnlineStatus();
+  alertOnlineStatus()
 </script>
 </body>
 </html>
@@ -47,21 +45,17 @@ to the main process and handled as needed, as shown in the following example.
 _main.js_
 
 ```javascript
-const electron = require('electron');
+const {app, BrowserWindow, ipcMain} = require('electron')
-const app = electron.app;
+let onlineStatusWindow
-const ipcMain = electron.ipcMain;
-const BrowserWindow = electron.BrowserWindow;
-
-let onlineStatusWindow;
 
 app.on('ready', () => {
-  onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false });
+  onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
-  onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`);
+  onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
-});
+})
 
 ipcMain.on('online-status-changed', (event, status) => {
-  console.log(status);
+  console.log(status)
-});
+})
 ```
 
 _online-status.html_
@@ -71,15 +65,15 @@ _online-status.html_
 <html>
 <body>
 <script>
-  const {ipcRenderer} = require('electron');
+  const {ipcRenderer} = require('electron')
   const updateOnlineStatus = () => {
-    ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline');
+    ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline')
-  };
+  }
 
-  window.addEventListener('online',  updateOnlineStatus);
+  window.addEventListener('online',  updateOnlineStatus)
-  window.addEventListener('offline',  updateOnlineStatus);
+  window.addEventListener('offline',  updateOnlineStatus)
 
-  updateOnlineStatus();
+  updateOnlineStatus()
 </script>
 </body>
 </html>

docs/tutorial/quick-start.md

@@ -80,56 +80,52 @@ The `main.js` should create windows and handle system events, a typical
 example being:
 
 ```javascript
-const electron = require('electron');
+const {app, BrowserWindow} = require('electron')
-// Module to control application life.
-const {app} = electron;
-// Module to create native browser window.
-const {BrowserWindow} = electron;
 
 // Keep a global reference of the window object, if you don't, the window will
 // be closed automatically when the JavaScript object is garbage collected.
-let win;
+let win
 
-function createWindow() {
+function createWindow () {
   // Create the browser window.
-  win = new BrowserWindow({width: 800, height: 600});
+  win = new BrowserWindow({width: 800, height: 600})
 
   // and load the index.html of the app.
-  win.loadURL(`file://${__dirname}/index.html`);
+  win.loadURL(`file://${__dirname}/index.html`)
 
   // Open the DevTools.
-  win.webContents.openDevTools();
+  win.webContents.openDevTools()
 
   // Emitted when the window is closed.
   win.on('closed', () => {
     // Dereference the window object, usually you would store windows
     // in an array if your app supports multi windows, this is the time
     // when you should delete the corresponding element.
-    win = null;
+    win = null
-  });
+  })
 }
 
 // This method will be called when Electron has finished
 // initialization and is ready to create browser windows.
 // Some APIs can only be used after this event occurs.
-app.on('ready', createWindow);
+app.on('ready', createWindow)
 
 // Quit when all windows are closed.
 app.on('window-all-closed', () => {
   // On macOS it is common for applications and their menu bar
   // to stay active until the user quits explicitly with Cmd + Q
   if (process.platform !== 'darwin') {
-    app.quit();
+    app.quit()
   }
-});
+})
 
 app.on('activate', () => {
   // On macOS it's common to re-create a window in the app when the
   // dock icon is clicked and there are no other windows open.
   if (win === null) {
-    createWindow();
+    createWindow()
   }
-});
+})
 
 // In this file you can include the rest of your app's specific main process
 // code. You can also put them in separate files and require them here.

docs/tutorial/using-pepper-flash-plugin.md

@@ -20,6 +20,9 @@ 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) {
@@ -39,7 +42,7 @@ app.commandLine.appendSwitch('ppapi-flash-path', path.join(__dirname, pluginName
 app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169')
 
 app.on('ready', () => {
-  win = new BrowserWindow({
+  let win = new BrowserWindow({
     width: 800,
     height: 600,
     webPreferences: {
@@ -48,7 +51,7 @@ app.on('ready', () => {
   })
   win.loadURL(`file://${__dirname}/index.html`)
   // Something else
-});
+})
 ```
 
 You can also try loading the system wide Pepper Flash plugin instead of shipping

docs/tutorial/using-selenium-and-webdriver.md

@@ -79,7 +79,7 @@ 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 webdriver = require('selenium-webdriver')
 
 const driver = new webdriver.Builder()
   // The "9515" is the port opened by chrome driver.
@@ -87,22 +87,22 @@ const driver = new webdriver.Builder()
   .withCapabilities({
     chromeOptions: {
       // Here is the path to your Electron binary.
-      binary: '/Path-to-Your-App.app/Contents/MacOS/Electron',
+      binary: '/Path-to-Your-App.app/Contents/MacOS/Electron'
     }
   })
   .forBrowser('electron')
-  .build();
+  .build()
 
-driver.get('http://www.google.com');
+driver.get('http://www.google.com')
-driver.findElement(webdriver.By.name('q')).sendKeys('webdriver');
+driver.findElement(webdriver.By.name('q')).sendKeys('webdriver')
-driver.findElement(webdriver.By.name('btnG')).click();
+driver.findElement(webdriver.By.name('btnG')).click()
 driver.wait(() => {
   return driver.getTitle().then((title) => {
-   return title === 'webdriver - Google Search';
+    return title === 'webdriver - Google Search'
- });
+  })
-}, 1000);
+}, 1000)
 
-driver.quit();
+driver.quit()
 ```
 
 ## Setting up with WebdriverIO
@@ -132,7 +132,7 @@ $ npm install webdriverio
 ### 3. Connect to chrome driver
 
 ```javascript
-const webdriverio = require('webdriverio');
+const webdriverio = require('webdriverio')
 const options = {
   host: 'localhost', // Use localhost as chrome driver server
   port: 9515,        // "9515" is the port opened by chrome driver.
@@ -143,9 +143,9 @@ const options = {
       args: [/* cli arguments */]           // Optional, perhaps 'app=' + /path/to/your/app/
     }
   }
-};
+}
 
-let client = webdriverio.remote(options);
+let client = webdriverio.remote(options)
 
 client
   .init()
@@ -153,9 +153,9 @@ client
   .setValue('#q', 'webdriverio')
   .click('#btnG')
   .getTitle().then((title) => {
-    console.log('Title was: ' + title);
+    console.log('Title was: ' + title)
   })
-  .end();
+  .end()
 ```
 
 ## Workflow

docs/tutorial/using-widevine-cdm-plugin.md

@@ -51,23 +51,26 @@ 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');
+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');
+app.commandLine.appendSwitch('widevine-cdm-version', '1.4.8.866')
 
-let win = null;
+let win = null
 app.on('ready', () => {
   win = new BrowserWindow({
     webPreferences: {
       // The `plugins` have to be enabled.
       plugins: true
     }
-  });
+  })
-});
+  win.show()
+})
 ```
 
 ## Verifying the plugin