Bump v14.0.0-beta.7

Co-authored-by: Samuel Attard <samuel.r.attard@gmail.com>

.circleci/config.yml

@@ -499,6 +499,7 @@ step-gn-check: &step-gn-check
       gn check out/Default //electron/shell/common/api:mojo
       # Check the hunspell filenames
       node electron/script/gen-hunspell-filenames.js --check
+      node electron/script/gen-libc++-filenames.js --check
 
 step-electron-build: &step-electron-build
   run:
@@ -524,6 +525,7 @@ step-electron-build: &step-electron-build
         ninja -C out/Default electron:electron_mksnapshot_zip -j $NUMBER_OF_NINJA_PROCESSES
         ninja -C out/Default tools/v8_context_snapshot -j $NUMBER_OF_NINJA_PROCESSES
         gn desc out/Default v8:run_mksnapshot_default args > out/Default/mksnapshot_args
+        (cd out/Default; zip mksnapshot.zip mksnapshot_args clang_x64_v8_arm64/gen/v8/embedded.S)
         rm -rf out/Default/clang_x64_v8_arm64/gen
         rm -rf out/Default/clang_x64_v8_arm64/obj
         rm -rf out/Default/clang_x64/obj
@@ -662,6 +664,11 @@ step-persist-data-for-tests: &step-persist-data-for-tests
       - src/third_party/electron_node
       - src/third_party/nan
       - src/cross-arch-snapshots
+      - src/third_party/llvm-build
+      - src/build/linux
+      - src/buildtools/third_party/libc++
+      - src/buildtools/third_party/libc++abi
+      - src/out/Default/obj/buildtools/third_party
 
 step-electron-dist-unzip: &step-electron-dist-unzip
   run:
@@ -797,6 +804,17 @@ step-hunspell-build: &step-hunspell-build
         ninja -C out/Default electron:hunspell_dictionaries_zip -j $NUMBER_OF_NINJA_PROCESSES
       fi
 
+step-maybe-generate-libcxx: &step-maybe-generate-libcxx
+  run:
+    name: maybe generate libcxx
+    command: |
+      cd src
+      if [ "`uname`" == "Linux" ]; then
+        ninja -C out/Default electron:libcxx_headers_zip -j $NUMBER_OF_NINJA_PROCESSES
+        ninja -C out/Default electron:libcxxabi_headers_zip -j $NUMBER_OF_NINJA_PROCESSES
+        ninja -C out/Default electron:libcxx_objects_zip -j $NUMBER_OF_NINJA_PROCESSES
+      fi
+
 step-maybe-generate-breakpad-symbols: &step-maybe-generate-breakpad-symbols
   run:
     name: Generate breakpad symbols
@@ -1411,6 +1429,8 @@ commands:
           steps:
             - attach_workspace:
                 at: .
+            - *step-maybe-early-exit-doc-only-change
+            - run: rm -rf src/electron
       - *step-restore-brew-cache
       - *step-install-gnutar-on-mac
       - *step-save-brew-cache
@@ -1587,6 +1607,9 @@ commands:
           condition: << parameters.checkout >>
           steps:
             - *step-checkout-electron
+            - *step-touch-sync-done
+            - *step-maybe-restore-git-cache
+            - *step-set-git-cache-path
             - *step-gclient-sync
             - *step-delete-git-directories
             - *step-minimize-workspace-size-from-checkout
@@ -1620,6 +1643,9 @@ commands:
       # hunspell
       - *step-hunspell-build
 
+      # libcxx
+      - *step-maybe-generate-libcxx
+
       # typescript defs
       - *step-maybe-generate-typescript-defs
 
@@ -1648,19 +1674,6 @@ jobs:
     <<: *steps-electron-ts-compile-for-doc-change
 
   # Layer 1: Checkout.
-  linux-checkout:
-    executor: linux-docker
-    environment:
-      <<: *env-linux-2xlarge
-      GCLIENT_EXTRA_ARGS: '--custom-var=checkout_arm=True --custom-var=checkout_arm64=True'
-    steps:
-      - electron-build:
-          persist: false
-          build: false
-          checkout: true
-          persist-checkout: true
-          restore-src-cache: false
-
   linux-checkout-for-workspace:
     executor: linux-docker
     environment:
@@ -1986,7 +1999,7 @@ jobs:
           persist: true
           checkout: false
           checkout-and-assume-cache: true
-          attach: false
+          attach: true
 
   osx-testing-x64-gn-check:
     executor:
@@ -2062,7 +2075,7 @@ jobs:
           persist: true
           checkout: false
           checkout-and-assume-cache: true
-          attach: false
+          attach: true
 
   mas-testing-x64:
     executor: macos
@@ -2078,7 +2091,7 @@ jobs:
           persist: true
           checkout: false
           checkout-and-assume-cache: true
-          attach: false
+          attach: true
 
   mas-testing-x64-gn-check:
     executor:
@@ -2156,7 +2169,7 @@ jobs:
           persist: true
           checkout: false
           checkout-and-assume-cache: true
-          attach: false
+          attach: true
 
   # Layer 3: Tests.
   linux-x64-unittests:

BUILD.gn

@@ -1,6 +1,7 @@
 import("//build/config/locales.gni")
 import("//build/config/ui.gni")
 import("//build/config/win/manifest.gni")
+import("//components/os_crypt/features.gni")
 import("//components/spellcheck/spellcheck_build_features.gni")
 import("//content/public/app/mac_helpers.gni")
 import("//extensions/buildflags/buildflags.gni")
@@ -25,6 +26,8 @@ import("electron_paks.gni")
 import("filenames.auto.gni")
 import("filenames.gni")
 import("filenames.hunspell.gni")
+import("filenames.libcxx.gni")
+import("filenames.libcxxabi.gni")
 
 if (is_mac) {
   import("//build/config/mac/rules.gni")
@@ -294,7 +297,7 @@ templated_file("electron_version_header") {
 action("electron_fuses") {
   script = "build/fuses/build.py"
 
-  inputs = [ "build/fuses/fuses.json" ]
+  inputs = [ "build/fuses/fuses.json5" ]
 
   outputs = [
     "$target_gen_dir/fuses.h",
@@ -333,8 +336,10 @@ source_set("electron_lib") {
     "//components/network_hints/common:mojo_bindings",
     "//components/network_hints/renderer",
     "//components/network_session_configurator/common",
+    "//components/os_crypt",
     "//components/pref_registry",
     "//components/prefs",
+    "//components/security_state/content",
     "//components/upload_list",
     "//components/user_prefs",
     "//components/viz/host",
@@ -619,6 +624,8 @@ source_set("electron_lib") {
     sources += [
       "shell/browser/printing/print_preview_message_handler.cc",
       "shell/browser/printing/print_preview_message_handler.h",
+      "shell/browser/printing/print_view_manager_electron.cc",
+      "shell/browser/printing/print_view_manager_electron.h",
       "shell/renderer/printing/print_render_frame_helper_delegate.cc",
       "shell/renderer/printing/print_render_frame_helper_delegate.h",
     ]
@@ -679,6 +686,10 @@ source_set("electron_lib") {
     ]
     libs += [ "uxtheme.lib" ]
   }
+
+  if (allow_runtime_configurable_key_storage) {
+    defines += [ "ALLOW_RUNTIME_CONFIGURABLE_KEY_STORAGE" ]
+  }
 }
 
 electron_paks("packed_resources") {
@@ -1290,13 +1301,18 @@ template("dist_zip") {
                              "testonly",
                            ])
     flatten = false
+    flatten_relative_to = false
     if (defined(invoker.flatten)) {
       flatten = invoker.flatten
+      if (defined(invoker.flatten_relative_to)) {
+        flatten_relative_to = invoker.flatten_relative_to
+      }
     }
     args = rebase_path(outputs + [ _runtime_deps_file ], root_build_dir) + [
              target_cpu,
              target_os,
              "$flatten",
+             "$flatten_relative_to",
            ]
   }
 }
@@ -1387,6 +1403,43 @@ dist_zip("hunspell_dictionaries_zip") {
   outputs = [ "$root_build_dir/hunspell_dictionaries.zip" ]
 }
 
+copy("libcxx_headers") {
+  sources = libcxx_headers + libcxx_licenses
+  outputs = [ "$target_gen_dir/electron_libcxx_include/{{source_root_relative_dir}}/{{source_file_part}}" ]
+}
+
+dist_zip("libcxx_headers_zip") {
+  data_deps = [ ":libcxx_headers" ]
+  flatten = true
+  flatten_relative_to = rebase_path(
+          "$target_gen_dir/electron_libcxx_include/buildtools/third_party/libc++/trunk",
+          "$root_out_dir")
+
+  outputs = [ "$root_build_dir/libcxx_headers.zip" ]
+}
+
+copy("libcxxabi_headers") {
+  sources = libcxxabi_headers + libcxxabi_licenses
+  outputs = [ "$target_gen_dir/electron_libcxxabi_include/{{source_root_relative_dir}}/{{source_file_part}}" ]
+}
+
+dist_zip("libcxxabi_headers_zip") {
+  data_deps = [ ":libcxxabi_headers" ]
+  flatten = true
+  flatten_relative_to = rebase_path(
+          "$target_gen_dir/electron_libcxxabi_include/buildtools/third_party/libc++abi/trunk",
+          "$root_out_dir")
+
+  outputs = [ "$root_build_dir/libcxxabi_headers.zip" ]
+}
+
+action("libcxx_objects_zip") {
+  deps = [ "//buildtools/third_party/libc++" ]
+  script = "build/zip_libcxx.py"
+  outputs = [ "$root_build_dir/libcxx_objects.zip" ]
+  args = rebase_path(outputs)
+}
+
 group("electron") {
   public_deps = [ ":electron_app" ]
 }

DEPS

@@ -14,11 +14,14 @@ gclient_gn_args = [
 
 vars = {
   'chromium_version':
-    '92.0.4505.0',
+    '93.0.4536.0',
   'node_version':
-    'v14.16.1',
+    'v14.17.0',
   'nan_version':
-    'v2.14.2',
+    # The following commit hash of NAN is v2.14.2 with *only* changes to the
+    # test suite. This should be updated to a specific tag when one becomes
+    # available.
+    '65b32af46e9d7fab2e4ff657751205b3865f4920',
   'squirrel.mac_version':
     'cdc0729c8bf8576bfef18629186e1e9ecf1b0d9f',
 

ELECTRON_VERSION

@@ -1 +1 @@
-14.0.0-nightly.20210518
+14.0.0-beta.7

build/args/all.gn

@@ -29,4 +29,7 @@ enable_pseudolocales = false
 
 is_cfi = false
 
-enable_pak_file_integrity_checks = false
+# Make application name configurable at runtime for cookie crypto
+allow_runtime_configurable_key_storage = true
+
+enable_cet_shadow_stack = false

build/fuses/build.py

@@ -1,5 +1,6 @@
 #!/usr/bin/env python3
 
+from collections import OrderedDict
 import json
 import os
 import sys
@@ -49,8 +50,8 @@ const volatile char kFuseWire[] = { /* sentinel */ {sentinel}, /* fuse_version *
 }
 """
 
-with open(os.path.join(dir_path, "fuses.json"), 'r') as f:
-  fuse_defaults = json.load(f)
+with open(os.path.join(dir_path, "fuses.json5"), 'r') as f:
+  fuse_defaults = json.loads(''.join(line for line in f.readlines() if not line.strip()[0] == "/"), object_pairs_hook=OrderedDict)
 
 fuse_version = fuse_defaults['_version']
 del fuse_defaults['_version']

build/fuses/fuses.json5

@@ -2,5 +2,6 @@
   "_comment": "Modifying the fuse schema in any breaking way should result in the _version prop being incremented.  NEVER remove a fuse or change its meaning, instead mark it as removed with 'r'",
   "_schema": "0 == off, 1 == on, r == removed fuse",
   "_version": 1,
-  "run_as_node": "1"
+  "run_as_node": "1",
+  "cookie_encryption": "0"
 }

build/zip.py

@@ -72,7 +72,7 @@ def execute(argv):
     raise e
 
 def main(argv):
-  dist_zip, runtime_deps, target_cpu, _, flatten_val = argv
+  dist_zip, runtime_deps, target_cpu, _, flatten_val, flatten_relative_to = argv
   should_flatten = flatten_val == "true"
   dist_files = set()
   with open(runtime_deps) as f:
@@ -99,11 +99,18 @@ def main(argv):
             if basename == 'chrome_sandbox'
             else dep
           )
+          name_to_write = arcname
+          if should_flatten:
+            if flatten_relative_to:
+              if name_to_write.startswith(flatten_relative_to):
+                name_to_write = name_to_write[len(flatten_relative_to):]
+              else:
+                name_to_write = os.path.basename(arcname)
+            else:
+              name_to_write = os.path.basename(arcname)
           z.write(
             dep,
-            os.path.basename(arcname)
-            if should_flatten
-            else arcname,
+            name_to_write,
           )
 
 if __name__ == '__main__':

build/zip_libcxx.py

@@ -0,0 +1,47 @@
+#!/usr/bin/env python
+from __future__ import print_function
+import os
+import subprocess
+import sys
+import zipfile
+
+def execute(argv):
+  try:
+    output = subprocess.check_output(argv, stderr=subprocess.STDOUT)
+    return output
+  except subprocess.CalledProcessError as e:
+    print(e.output)
+    raise e
+
+def get_object_files(base_path, archive_name):
+  archive_file = os.path.join(base_path, archive_name)
+  output = execute(['nm', '-g', archive_file]).decode('ascii')
+  object_files = set()
+  lines = output.split("\n")
+  for line in lines:
+    if line.startswith(base_path):
+      object_file = line.split(":")[0]
+      object_files.add(object_file)
+    if line.startswith('nm: '):
+      object_file = line.split(":")[1].lstrip()
+      object_files.add(object_file)
+  return list(object_files) + [archive_file]
+
+def main(argv):
+  dist_zip, = argv
+  out_dir = os.path.dirname(dist_zip)
+  base_path_libcxx = os.path.join(out_dir, 'obj/buildtools/third_party/libc++')
+  base_path_libcxxabi = os.path.join(out_dir, 'obj/buildtools/third_party/libc++abi')
+  object_files_libcxx = get_object_files(base_path_libcxx, 'libc++.a')
+  object_files_libcxxabi = get_object_files(base_path_libcxxabi, 'libc++abi.a')
+  with zipfile.ZipFile(
+      dist_zip, 'w', zipfile.ZIP_DEFLATED, allowZip64=True
+    ) as z:
+      object_files_libcxx.sort()
+      for object_file in object_files_libcxx:
+        z.write(object_file, os.path.relpath(object_file, base_path_libcxx))
+      for object_file in object_files_libcxxabi:
+        z.write(object_file, os.path.relpath(object_file, base_path_libcxxabi))
+
+if __name__ == '__main__':
+  sys.exit(main(sys.argv[1:]))

chromium_src/BUILD.gn

@@ -43,8 +43,6 @@ static_library("chrome") {
     "//chrome/browser/predictors/proxy_lookup_client_impl.h",
     "//chrome/browser/predictors/resolve_host_client_impl.cc",
     "//chrome/browser/predictors/resolve_host_client_impl.h",
-    "//chrome/browser/ssl/security_state_tab_helper.cc",
-    "//chrome/browser/ssl/security_state_tab_helper.h",
     "//chrome/browser/ui/views/autofill/autofill_popup_view_utils.cc",
     "//chrome/browser/ui/views/autofill/autofill_popup_view_utils.h",
     "//extensions/browser/app_window/size_constraints.cc",
@@ -80,7 +78,6 @@ static_library("chrome") {
     "//components/keyed_service/content",
     "//components/paint_preview/buildflags",
     "//components/proxy_config",
-    "//components/security_state/content",
     "//content/public/browser",
     "//services/strings",
   ]
@@ -219,8 +216,6 @@ static_library("chrome") {
       "//chrome/browser/printing/print_job_worker.h",
       "//chrome/browser/printing/print_view_manager_base.cc",
       "//chrome/browser/printing/print_view_manager_base.h",
-      "//chrome/browser/printing/print_view_manager_basic.cc",
-      "//chrome/browser/printing/print_view_manager_basic.h",
       "//chrome/browser/printing/printer_query.cc",
       "//chrome/browser/printing/printer_query.h",
       "//chrome/browser/printing/printing_service.cc",

docs/README.md

@@ -18,20 +18,14 @@ an issue:
 
 ## Guides and Tutorials
 
-### Quickstart
+### Getting started
 
-* [Quick Start Guide](tutorial/quick-start.md)
-  * [Prerequisites](tutorial/quick-start.md#prerequisites)
-  * [Create a basic application](tutorial/quick-start.md#create-a-basic-application)
-  * [Run your application](tutorial/quick-start.md#run-your-application)
-  * [Package and distribute the application](tutorial/quick-start.md#package-and-distribute-the-application)
+* [Introduction](tutorial/introduction.md)
+* [Quick Start](tutorial/quick-start.md)
+* [Process Model](tutorial/process-model.md)
 
 ### Learning the basics
 
-* [Electron's Process Model](tutorial/quick-start.md#application-architecture)
-  * [Main and Renderer Processes](tutorial/quick-start.md#main-and-renderer-processes)
-  * [Electron API](tutorial/quick-start.md#electron-api)
-  * [Node.js API](tutorial/quick-start.md#nodejs-api)
 * Adding Features to Your App
   * [Notifications](tutorial/notifications.md)
   * [Recent Documents](tutorial/recent-documents.md)

docs/api/accelerator.md

@@ -35,7 +35,7 @@ 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
+The `Super` (or `Meta`) key is mapped to the `Windows` key on Windows and Linux and
 `Cmd` on macOS.
 
 ## Available modifiers
@@ -48,6 +48,7 @@ The `Super` key is mapped to the `Windows` key on Windows and Linux and
 * `AltGr`
 * `Shift`
 * `Super`
+* `Meta`
 
 ## Available key codes
 

docs/api/client-request.md

@@ -71,7 +71,7 @@ const request = net.request({
 
 Returns:
 
-* `response` IncomingMessage - An object representing the HTTP response message.
+* `response` [IncomingMessage](incoming-message.md) - An object representing the HTTP response message.
 
 #### Event: 'login'
 

docs/api/dialog.md

@@ -154,7 +154,7 @@ dialog.showOpenDialog(mainWindow, {
 
 * `browserWindow` [BrowserWindow](browser-window.md) (optional)
 * `options` Object
-  * `title` String (optional)
+  * `title` String (optional) - The dialog title. Cannot be displayed on some _Linux_ desktop environments.
   * `defaultPath` String (optional) - Absolute directory path, absolute file
     path, or file name to use by default.
   * `buttonLabel` String (optional) - Custom label for the confirmation button, when
@@ -185,7 +185,7 @@ The `filters` specifies an array of file types that can be displayed, see
 
 * `browserWindow` [BrowserWindow](browser-window.md) (optional)
 * `options` Object
-  * `title` String (optional)
+  * `title` String (optional) - The dialog title. Cannot be displayed on some _Linux_ desktop environments.
   * `defaultPath` String (optional) - Absolute directory path, absolute file
     path, or file name to use by default.
   * `buttonLabel` String (optional) - Custom label for the confirmation button, when

docs/api/synopsis.md

@@ -13,7 +13,7 @@ either process type.
 
 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-and-renderer-processes)
+the concept of main process vs. renderer process
 scripts to be able to use those modules.
 
 The main process script is like a normal Node.js script:
@@ -43,8 +43,6 @@ extra ability to use node modules if `nodeIntegration` is enabled:
 </html>
 ```
 
-To run your app, read [Run your app](../tutorial/quick-start.md#run-your-application).
-
 ## Destructuring assignment
 
 As of 0.37, you can use

docs/api/window-open.md

@@ -85,15 +85,18 @@ const mainWindow = new BrowserWindow()
 mainWindow.webContents.setWindowOpenHandler(({ url }) => {
   if (url === 'about:blank') {
     return {
-      frame: false,
-      fullscreenable: false,
-      backgroundColor: 'black',
-      webPreferences: {
-        preload: 'my-child-window-preload-script.js'
+      action: 'allow',
+      overrideBrowserWindowOptions: {
+        frame: false,
+        fullscreenable: false,
+        backgroundColor: 'black',
+        webPreferences: {
+          preload: 'my-child-window-preload-script.js'
+        }
       }
     }
   }
-  return false
+  return { action: 'deny' }
 })
 ```
 

docs/development/clang-tidy.md

@@ -10,12 +10,12 @@ files, you need to have built Electron so that it knows which compiler flags
 were used. There is one required option for the script `--output-dir`, which
 tells the script which build directory to pull the compilation information
 from. A typical usage would be:
-`npm run lint:clang-tiy --out-dir ../out/Testing`
+`npm run lint:clang-tidy --out-dir ../out/Testing`
 
 With no filenames provided, all C/C++/Objective-C files will be checked.
 You can provide a list of files to be checked by passing the filenames after
 the options:
-`npm run lint:clang-tiy --out-dir ../out/Testing shell/browser/api/electron_api_app.cc`
+`npm run lint:clang-tidy --out-dir ../out/Testing shell/browser/api/electron_api_app.cc`
 
 While `clang-tidy` has a
 [long list](https://clang.llvm.org/extra/clang-tidy/checks/list.html)

docs/development/coding-style.md

@@ -25,7 +25,7 @@ You can run `npm run lint` to show any style issues detected by `cpplint` and
 ## C++ and Python
 
 For C++ and Python, we follow Chromium's [Coding
-Style](https://www.chromium.org/developers/coding-style). You can use
+Style](https://chromium.googlesource.com/chromium/src/+/refs/heads/main/styleguide/styleguide.md). 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.
 

docs/fiddles/features/drag-and-drop/index.html

@@ -7,12 +7,9 @@
 </head>
 <body>
     <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
-    <a href="#" id="drag">Drag me</a>
+    <p>Drag the boxes below to somewhere in your OS (Finder/Explorer, Desktop, etc.) to copy an example markdown file.</p>
+    <div style="border:2px solid black;border-radius:3px;padding:5px;display:inline-block" draggable="true" id="drag1">Drag me - File 1</div>
+    <div style="border:2px solid black;border-radius:3px;padding:5px;display:inline-block" draggable="true" id="drag2">Drag me - File 2</div>
     <script src="renderer.js"></script>
 </body>
 </html>

docs/fiddles/features/drag-and-drop/main.js

@@ -1,21 +1,28 @@
 const { app, BrowserWindow, ipcMain, nativeImage, NativeImage } = require('electron')
-const fs = require('fs');
-const http = require('http');
+const path = require('path')
+const fs = require('fs')
+const https = require('https')
 
-function createWindow () {
+function createWindow() {
   const win = new BrowserWindow({
     width: 800,
     height: 600,
     webPreferences: {
-      nodeIntegration: true
+      preload: path.join(__dirname, 'preload.js')
     }
   })
 
   win.loadFile('index.html')
 }
-const iconName = 'iconForDragAndDrop.png';
-const icon = fs.createWriteStream(`${process.cwd()}/${iconName}`);
-http.get('http://img.icons8.com/ios/452/drag-and-drop.png', (response) => {
+
+const iconName = path.join(__dirname, 'iconForDragAndDrop.png');
+const icon = fs.createWriteStream(iconName);
+
+// Create a new file to copy - you can also copy existing files.
+fs.writeFileSync(path.join(__dirname, 'drag-and-drop-1.md'), '# First file to test drag and drop')
+fs.writeFileSync(path.join(__dirname, 'drag-and-drop-2.md'), '# Second file to test drag and drop')
+
+https.get('https://img.icons8.com/ios/452/drag-and-drop.png', (response) => {
   response.pipe(icon);
 });
 
@@ -23,8 +30,8 @@ app.whenReady().then(createWindow)
 
 ipcMain.on('ondragstart', (event, filePath) => {
   event.sender.startDrag({
-    file: filePath,
-    icon: `${process.cwd()}/${iconName}`
+    file: path.join(__dirname, filePath),
+    icon: iconName,
   })
 })
 

docs/fiddles/features/drag-and-drop/preload.js

@@ -0,0 +1,8 @@
+const { contextBridge, ipcRenderer } = require('electron')
+const path = require('path')
+
+contextBridge.exposeInMainWorld('electron', {
+  startDrag: (fileName) => {
+    ipcRenderer.send('ondragstart', fileName)
+  }
+})

docs/fiddles/features/drag-and-drop/renderer.js

@@ -1,9 +1,9 @@
-const { ipcRenderer } = require('electron')
-const fs = require('fs')
-
-document.getElementById('drag').ondragstart = (event) => {
-  const fileName = 'drag-and-drop.md'
-  fs.writeFileSync(fileName, '# Test drag and drop');
+document.getElementById('drag1').ondragstart = (event) => {
   event.preventDefault()
-  ipcRenderer.send('ondragstart', process.cwd() + `/${fileName}`)
+  window.electron.startDrag('drag-and-drop-1.md')
+}
+
+document.getElementById('drag2').ondragstart = (event) => {
+  event.preventDefault()
+  window.electron.startDrag('drag-and-drop-2.md')
 }

docs/fiddles/features/keyboard-shortcuts/global/index.html

@@ -7,10 +7,6 @@
 </head>
 <body>
     <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
+    <p>Hit Alt+Ctrl+I on Windows or Opt+Cmd+I on Mac to see a message printed to the console.</p>
 </body>
 </html>

docs/fiddles/features/keyboard-shortcuts/global/main.js

@@ -4,9 +4,6 @@ function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600,
-    webPreferences: {
-      nodeIntegration: true
-    }
   })
 
   win.loadFile('index.html')

docs/fiddles/features/keyboard-shortcuts/interception-from-main/index.html

@@ -7,8 +7,6 @@
 </head>
 <body>
     <h1>Hello World!</h1>
-    We are using node <script>document.write(process.versions.node)</script>,
-    Chrome <script>document.write(process.versions.chrome)</script>,
-    and Electron <script>document.write(process.versions.electron)</script>.
+    <p>Hit Ctrl+I to see a message printed to the console.</p>
 </body>
 </html>

docs/fiddles/features/keyboard-shortcuts/interception-from-main/main.js

@@ -1,7 +1,7 @@
 const { app, BrowserWindow } = require('electron')
 
 app.whenReady().then(() => {
-  const win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: true } })
+  const win = new BrowserWindow({ width: 800, height: 600 })
 
   win.loadFile('index.html')
   win.webContents.on('before-input-event', (event, input) => {

docs/fiddles/features/keyboard-shortcuts/local/index.html

@@ -7,10 +7,6 @@
 </head>
 <body>
     <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
+    <p>Hit Alt+Shift+I on Windows, or Opt+Cmd+I on mac to see a message printed to the console.</p>
 </body>
 </html>

docs/fiddles/features/keyboard-shortcuts/local/main.js

@@ -4,9 +4,6 @@ function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600,
-    webPreferences: {
-      nodeIntegration: true
-    }
   })
 
   win.loadFile('index.html')

docs/fiddles/features/keyboard-shortcuts/web-apis/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
+    <meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">
+    <title>Hello World!</title>
+  </head>
+  <body>
+    <h1>Hello World!</h1>
+    
+    <p>Hit any key with this window focused to see it captured here.</p>
+    <div><span>Last Key Pressed: </span><span id="last-keypress"></span></div>
+    <script src="./renderer.js"></script>
+  </body>
+</html>

docs/fiddles/features/keyboard-shortcuts/web-apis/main.js

@@ -0,0 +1,35 @@
+// Modules to control application life and create native browser window
+const {app, BrowserWindow} = require('electron')
+const path = require('path')
+
+function createWindow () {
+  // Create the browser window.
+  const mainWindow = new BrowserWindow({
+    width: 800,
+    height: 600,
+  })
+
+  // and load the index.html of the app.
+  mainWindow.loadFile('index.html')
+
+}
+
+// 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.whenReady().then(() => {
+  createWindow()
+  
+  app.on('activate', function () {
+    // 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 (BrowserWindow.getAllWindows().length === 0) createWindow()
+  })
+})
+
+// Quit when all windows are closed, except on macOS. There, it's common
+// for applications and their menu bar to stay active until the user quits
+// explicitly with Cmd + Q.
+app.on('window-all-closed', function () {
+  if (process.platform !== 'darwin') app.quit()
+})

docs/fiddles/features/keyboard-shortcuts/web-apis/renderer.js

@@ -0,0 +1,7 @@
+function handleKeyPress (event) {
+  // You can put code here to handle the keypress.
+  document.getElementById("last-keypress").innerText = event.key
+  console.log(`You pressed ${event.key}`)
+}
+
+window.addEventListener('keyup', handleKeyPress, true)

docs/fiddles/features/macos-dark-mode/main.js

@@ -1,11 +1,12 @@
 const { app, BrowserWindow, ipcMain, nativeTheme } = require('electron')
+const path = require('path')
 
 function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600,
     webPreferences: {
-      nodeIntegration: true
+      preload: path.join(__dirname, 'preload.js')
     }
   })
 
@@ -21,20 +22,22 @@ function createWindow () {
   })
 
   ipcMain.handle('dark-mode:system', () => {
-    nativeTheme.themeSouce = 'system'
+    nativeTheme.themeSource = 'system'
   })
 }
 
-app.whenReady().then(createWindow)
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', () => {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow()
+    }
+  })
+})
 
 app.on('window-all-closed', () => {
   if (process.platform !== 'darwin') {
     app.quit()
   }
 })
-
-app.on('activate', () => {
-  if (BrowserWindow.getAllWindows().length === 0) {
-    createWindow()
-  }
-})

docs/fiddles/features/macos-dark-mode/preload.js

@@ -0,0 +1,6 @@
+const { contextBridge, ipcRenderer } = require('electron')
+
+contextBridge.exposeInMainWorld('darkMode', {
+  toggle: () => ipcRenderer.invoke('dark-mode:toggle'),
+  system: () => ipcRenderer.invoke('dark-mode:system')
+})

docs/fiddles/features/macos-dark-mode/renderer.js

@@ -1,11 +1,9 @@
-const { ipcRenderer } = require('electron')
-
 document.getElementById('toggle-dark-mode').addEventListener('click', async () => {
-  const isDarkMode = await ipcRenderer.invoke('dark-mode:toggle')
+  const isDarkMode = await window.darkMode.toggle()
   document.getElementById('theme-source').innerHTML = isDarkMode ? 'Dark' : 'Light'
 })
 
 document.getElementById('reset-to-system').addEventListener('click', async () => {
-  await ipcRenderer.invoke('dark-mode:system')
+  await window.darkMode.system()
   document.getElementById('theme-source').innerHTML = 'System'
 })

docs/fiddles/features/macos-dock-menu/index.html

@@ -7,10 +7,6 @@
 </head>
 <body>
     <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
+    <p>Right click the dock icon to see the custom menu options.</p>
 </body>
 </html>

docs/fiddles/features/macos-dock-menu/main.js

@@ -4,9 +4,6 @@ function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600,
-    webPreferences: {
-      nodeIntegration: true
-    }
   })
 
   win.loadFile('index.html')
@@ -27,7 +24,9 @@ const dockMenu = Menu.buildFromTemplate([
 ])
 
 app.whenReady().then(() => {
-  app.dock.setMenu(dockMenu)
+  if (process.platform === 'darwin') {
+    app.dock.setMenu(dockMenu)
+  }
 }).then(createWindow)
 
 app.on('window-all-closed', () => {

docs/fiddles/features/notifications/main/index.html

@@ -7,10 +7,6 @@
 </head>
 <body>
     <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
+    <p>After launching this application, you should see the system notification.</p>
 </body>
 </html>

docs/fiddles/features/notifications/main/main.js

@@ -3,21 +3,17 @@ const { app, BrowserWindow, Notification } = require('electron')
 function createWindow () {
   const win = new BrowserWindow({
     width: 800,
-    height: 600,
-    webPreferences: {
-      nodeIntegration: true
-    }
+    height: 600
   })
 
   win.loadFile('index.html')
 }
 
+const NOTIFICATION_TITLE = 'Basic Notification'
+const NOTIFICATION_BODY = 'Notification from the Main process'
+
 function showNotification () {
-  const notification = {
-    title: 'Basic Notification',
-    body: 'Notification from the Main process'
-  }
-  new Notification(notification).show()
+  new Notification({ title: NOTIFICATION_TITLE, body: NOTIFICATION_BODY }).show()
 }
 
 app.whenReady().then(createWindow).then(showNotification)

docs/fiddles/features/notifications/renderer/index.html

@@ -7,11 +7,9 @@
 </head>
 <body>
     <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
+    <p>After launching this application, you should see the system notification.</p>
+    <p id="output">Click it to see the effect in this interface.</p>
+
     <script src="renderer.js"></script>
 </body>
 </html>

docs/fiddles/features/notifications/renderer/main.js

@@ -3,10 +3,7 @@ const { app, BrowserWindow } = require('electron')
 function createWindow () {
   const win = new BrowserWindow({
     width: 800,
-    height: 600,
-    webPreferences: {
-      nodeIntegration: true
-    }
+    height: 600
   })
 
   win.loadFile('index.html')

docs/fiddles/features/notifications/renderer/renderer.js

@@ -1,7 +1,6 @@
-const myNotification = new Notification('Title', {
-  body: 'Notification from the Renderer process'
-})
+const NOTIFICATION_TITLE = 'Title'
+const NOTIFICATION_BODY = 'Notification from the Renderer process. Click to log to console.'
+const CLICK_MESSAGE = 'Notification clicked!'
 
-myNotification.onclick = () => {
-  console.log('Notification clicked')
-}
+new Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY })
+  .onclick = () => document.getElementById("output").innerText = CLICK_MESSAGE

docs/fiddles/features/offscreen-rendering/index.html

@@ -1,15 +0,0 @@
-<html>
-<head>
-    <meta charset="UTF-8">
-    <title>Hello World!</title>
-    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
-</head>
-<body>
-    <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
-</body>
-</html>

docs/fiddles/features/offscreen-rendering/main.js

@@ -1,5 +1,6 @@
 const { app, BrowserWindow } = require('electron')
 const fs = require('fs')
+const path = require('path')
 
 app.disableHardwareAcceleration()
 
@@ -12,7 +13,7 @@ app.whenReady().then(() => {
     fs.writeFileSync('ex.png', image.toPNG())
   })
   win.webContents.setFrameRate(60)
-  console.log(`The screenshot has been successfully saved to ${process.cwd()}/ex.png`)
+  console.log(`The screenshot has been successfully saved to ${path.join(process.cwd(), 'ex.png')}`)
 })
 
 app.on('window-all-closed', () => {

docs/fiddles/features/online-detection/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>Hello World!</title>
+    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
+</head>
+<body>
+    <h1>Connection status: <strong id='status'></strong></h1>
+    
+    <script src="renderer.js"></script>
+</body>
+</html>

docs/fiddles/features/online-detection/main.js

@@ -0,0 +1,26 @@
+const { app, BrowserWindow } = require('electron')
+
+function createWindow () {
+  const onlineStatusWindow = new BrowserWindow({
+    width: 300,
+    height: 200
+  })
+
+  onlineStatusWindow.loadFile('index.html')
+}
+
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', () => {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow()
+    }
+  })
+})
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})

docs/fiddles/features/online-detection/main/index.html

@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="UTF-8">
-    <title>Hello World!</title>
-    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
-</head>
-<body>
-    <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
-    <script src="renderer.js"></script>
-</body>
-</html>

docs/fiddles/features/online-detection/main/main.js

@@ -1,24 +0,0 @@
-const { app, BrowserWindow, ipcMain } = require('electron')
-
-let onlineStatusWindow
-
-app.whenReady().then(() => {
-  onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false, webPreferences: { nodeIntegration: true } })
-  onlineStatusWindow.loadURL(`file://${__dirname}/index.html`)
-})
-
-ipcMain.on('online-status-changed', (event, status) => {
-  console.log(status)
-})
-
-app.on('window-all-closed', () => {
-  if (process.platform !== 'darwin') {
-    app.quit()
-  }
-})
-
-app.on('activate', () => {
-  if (BrowserWindow.getAllWindows().length === 0) {
-    createWindow()
-  }
-})

docs/fiddles/features/online-detection/main/renderer.js

@@ -1,7 +0,0 @@
-const { ipcRenderer } = require('electron')
-const updateOnlineStatus = () => { ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline') }
-
-window.addEventListener('online', updateOnlineStatus)
-window.addEventListener('offline', updateOnlineStatus)
-
-updateOnlineStatus()

docs/fiddles/features/online-detection/renderer.js

@@ -0,0 +1,8 @@
+function onlineStatusIndicator () {
+  document.getElementById('status').innerHTML = navigator.onLine ? 'online' : 'offline'
+}
+
+window.addEventListener('online', onlineStatusIndicator)
+window.addEventListener('offline', onlineStatusIndicator)
+
+onlineStatusIndicator()

docs/fiddles/features/online-detection/renderer/index.html

@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="UTF-8">
-    <title>Hello World!</title>
-    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
-</head>
-<body>
-    <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
-    <script src="renderer.js"></script>
-</body>
-</html>

docs/fiddles/features/online-detection/renderer/main.js

@@ -1,20 +0,0 @@
-const { app, BrowserWindow } = require('electron')
-
-let onlineStatusWindow
-
-app.whenReady().then(() => {
-  onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
-  onlineStatusWindow.loadURL(`file://${__dirname}/index.html`)
-})
-
-app.on('window-all-closed', () => {
-  if (process.platform !== 'darwin') {
-    app.quit()
-  }
-})
-
-app.on('activate', () => {
-  if (BrowserWindow.getAllWindows().length === 0) {
-    createWindow()
-  }
-})

docs/fiddles/features/online-detection/renderer/renderer.js

@@ -1,6 +0,0 @@
-const alertOnlineStatus = () => { window.alert(navigator.onLine ? 'online' : 'offline') }
-
-window.addEventListener('online', alertOnlineStatus)
-window.addEventListener('offline', alertOnlineStatus)
-
-alertOnlineStatus()

docs/fiddles/features/progress-bar/index.html

@@ -7,10 +7,9 @@
 </head>
 <body>
     <h1>Hello World!</h1>
-    <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
-    </p>
+    <p>Keep an eye on the dock (Mac) or taskbar (Windows, Unity) for this application!</p>
+    <p>It should indicate a progress that advances from 0 to 100%.</p>
+    <p>It should then show indeterminate (Windows) or pin at 100% (other operating systems)
+      briefly and then loop.</p>
 </body>
 </html>

docs/fiddles/features/progress-bar/main.js

@@ -1,21 +1,39 @@
 const { app, BrowserWindow } = require('electron')
 
+let progressInterval
+
 function createWindow () {
   const win = new BrowserWindow({
     width: 800,
-    height: 600,
-    webPreferences: {
-      nodeIntegration: true
-    }
+    height: 600
   })
 
   win.loadFile('index.html')
-  win.setProgressBar(0.5)
-}
 
+  const INCREMENT = 0.03
+  const INTERVAL_DELAY = 100 // ms
+
+  let c = 0
+  progressInterval = setInterval(() => {
+    // update progress bar to next value
+    // values between 0 and 1 will show progress, >1 will show indeterminate or stick at 100%
+    win.setProgressBar(c)
+
+    // increment or reset progress bar
+    if (c < 2) {
+      c += INCREMENT
+    } else {
+      c = (-INCREMENT * 5) // reset to a bit less than 0 to show reset state
+    }
+  }, INTERVAL_DELAY)
+}
 
 app.whenReady().then(createWindow)
 
+// before the app is terminated, clear both timers
+app.on('before-quit', () => {
+  clearInterval(progressInterval)
+})
 
 app.on('window-all-closed', () => {
   if (process.platform !== 'darwin') {

docs/fiddles/features/recent-documents/index.html

@@ -2,15 +2,14 @@
 <html>
 <head>
     <meta charset="UTF-8">
-    <title>Hello World!</title>
+    <title>Recent Documents</title>
     <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
 </head>
 <body>
-    <h1>Hello World!</h1>
+    <h1>Recent Documents</h1>
     <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
+        Right click on the app icon to see recent documents.
+        You should see `recently-used.md` added to the list of recent files
     </p>
 </body>
 </html>

docs/fiddles/features/recent-documents/main.js

@@ -5,17 +5,15 @@ const path = require('path')
 function createWindow () {
   const win = new BrowserWindow({
     width: 800,
-    height: 600,
-    webPreferences: {
-      nodeIntegration: true
-    }
+    height: 600
   })
 
   win.loadFile('index.html')
 }
+
 const fileName = 'recently-used.md'
 fs.writeFile(fileName, 'Lorem Ipsum', () => {
-  app.addRecentDocument(path.join(process.cwd(), `${fileName}`))
+  app.addRecentDocument(path.join(__dirname, fileName))
 })
 
 app.whenReady().then(createWindow)

docs/fiddles/features/represented-file/index.html

@@ -4,13 +4,14 @@
     <meta charset="UTF-8">
     <title>Hello World!</title>
     <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
+    <link rel="stylesheet" type="text/css" href="./styles.css">
 </head>
 <body>
     <h1>Hello World!</h1>
     <p>
-        We are using node <script>document.write(process.versions.node)</script>,
-        Chrome <script>document.write(process.versions.chrome)</script>,
-        and Electron <script>document.write(process.versions.electron)</script>.
+      Click on the title with the <pre>Command</pre> or <pre>Control</pre> key pressed.
+      You should see a popup with the represented file at the top.
     </p>
+  </body>
 </body>
 </html>

docs/fiddles/features/represented-file/main.js

@@ -4,10 +4,7 @@ const os = require('os');
 function createWindow () {
   const win = new BrowserWindow({
     width: 800,
-    height: 600,
-    webPreferences: {
-      nodeIntegration: true
-    }
+    height: 600
   })
 
   win.loadFile('index.html')

docs/styleguide.md

@@ -2,15 +2,14 @@
 
 These are the guidelines for writing Electron documentation.
 
-## Titles
+## Headings
 
 * Each page must have a single `#`-level title at the top.
-* Chapters in the same page must have `##`-level titles.
-* Sub-chapters need to increase the number of `#` in the title according to
+* Chapters in the same page must have `##`-level headings.
+* Sub-chapters need to increase the number of `#` in the heading according to
   their nesting depth.
-* All words in the page's title must be capitalized, except for conjunctions
-  like "of" and "and" .
-* Only the first word of a chapter title must be capitalized.
+* The page's title must follow [APA title case][title-case].
+* All chapters must follow [APA sentence case][sentence-case].
 
 Using `Quick Start` as example:
 
@@ -44,12 +43,20 @@ For API references, there are exceptions to this rule.
 
 ## Markdown rules
 
+This repository uses the [`markdownlint`][markdownlint] package to enforce consistent
+Markdown styling. For the exact rules, see the `.markdownlint.json` file in the root
+folder.
+
+There are a few style guidelines that aren't covered by the linter rules:
+
+<!--TODO(erickzhao): make sure this matches with the lint:markdownlint task-->
 * Use `sh` instead of `cmd` in code blocks (due to the syntax highlighter).
-* Lines should be wrapped at 80 columns.
+* Keep line lengths between 80 and 100 characters if possible for readability
+  purposes.
 * No nesting lists more than 2 levels (due to the markdown renderer).
 * All `js` and `javascript` code blocks are linted with
 [standard-markdown](https://www.npmjs.com/package/standard-markdown).
-* For unordered lists, use asterisks instead of dashes
+* For unordered lists, use asterisks instead of dashes.
 
 ## Picking words
 
@@ -60,14 +67,15 @@ For API references, there are exceptions to this rule.
 
 The following rules only apply to the documentation of APIs.
 
-### Page title
+### Title and description
 
-Each page must use the actual object name returned by `require('electron')`
-as the title, such as `BrowserWindow`, `autoUpdater`, and `session`.
+Each module's API doc must use the actual object name returned by `require('electron')`
+as its title (such as `BrowserWindow`, `autoUpdater`, and `session`).
 
-Under the page title must be a one-line description starting with `>`.
+Directly under the page title, add a one-line description of the module
+as a markdown quote (beginning with `>`).
 
-Using `session` as example:
+Using the `session` module as an example:
 
 ```markdown
 # session
@@ -99,14 +107,19 @@ Using `autoUpdater` as an example:
 * API classes or classes that are part of modules must be listed under a
   `## Class: TheClassName` chapter.
 * One page can have multiple classes.
-* Constructors must be listed with `###`-level titles.
-* [Static Methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static) must be listed under a `### Static Methods` chapter.
-* [Instance Methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes#Prototype_methods) must be listed under an `### Instance Methods` chapter.
-* All methods that have a return value must start their description with "Returns `[TYPE]` - Return description"
-  * If the method returns an `Object`, its structure can be specified using a colon followed by a newline then an unordered list of properties in the same style as function parameters.
+* Constructors must be listed with `###`-level headings.
+* [Static Methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static)
+  must be listed under a `### Static Methods` chapter.
+* [Instance Methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes#Prototype_methods)
+  must be listed under an `### Instance Methods` chapter.
+* All methods that have a return value must start their description with
+  "Returns `[TYPE]` - [Return description]"
+  * If the method returns an `Object`, its structure can be specified using a colon
+    followed by a newline then an unordered list of properties in the same style as
+    function parameters.
 * Instance Events must be listed under an `### Instance Events` chapter.
 * Instance Properties must be listed under an `### Instance Properties` chapter.
-  * Instance properties must start with "A [Property Type] ..."
+  * Instance Properties must start with "A [Property Type] ..."
 
 Using the `Session` and `Cookies` classes as an example:
 
@@ -142,7 +155,7 @@ Using the `Session` and `Cookies` classes as an example:
 #### `cookies.get(filter, callback)`
 ```
 
-### Methods
+### Methods and their arguments
 
 The methods chapter must be in the following form:
 
@@ -155,8 +168,12 @@ The methods chapter must be in the following form:
 ...
 ```
 
-The title can be `###` or `####`-levels depending on whether it is a method of
-a module or a class.
+#### Heading level
+
+The heading can be `###` or `####`-levels depending on whether the method
+belongs to a module or a class.
+
+#### Function signature
 
 For modules, the `objectName` is the module's name. For classes, it must be the
 name of the instance of the class, and must not be the same as the module's
@@ -165,23 +182,33 @@ name.
 For example, the methods of the `Session` class under the `session` module must
 use `ses` as the `objectName`.
 
-The optional arguments are notated by square brackets `[]` surrounding the optional argument
-as well as the comma required if this optional argument follows another
+Optional arguments are notated by square brackets `[]` surrounding the optional
+argument as well as the comma required if this optional argument follows another
 argument:
 
-```sh
+```markdown
 required[, optional]
 ```
 
-Below the method is more detailed information on each of the arguments. The type
-of argument is notated by either the common types:
+#### Argument descriptions
 
-* [`String`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
-* [`Number`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number)
-* [`Object`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)
-* [`Array`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
-* [`Boolean`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)
-* Or a custom type like Electron's [`WebContent`](api/web-contents.md)
+More detailed information on each of the arguments is noted in an unordered list
+below the method. The type of argument is notated by either JavaScript primitives
+(e.g. `String`, `Promise`, or `Object`), a custom API structure like Electron's
+[`Cookie`](api/structures/cookie.md), or the wildcard `any`.
+
+If the argument is of type `Array`, use `[]` shorthand with the type of value
+inside the array (for example,`any[]` or `String[]`).
+
+If the argument is of type `Promise`, parametrize the type with what the promise
+resolves to (for example, `Promise<void>` or `Promise<String>`).
+
+If an argument can be of multiple types, separate the types with `|`.
+
+The description for `Function` type arguments should make it clear how it may be
+called and list the types of the parameters that will be passed to it.
+
+#### Platform-specific functionality
 
 If an argument or a method is unique to certain platforms, those platforms are
 denoted using a space-delimited italicized list following the datatype. Values
@@ -191,12 +218,6 @@ can be `macOS`, `Windows` or `Linux`.
 * `animate` Boolean (optional) _macOS_ _Windows_ - Animate the thing.
 ```
 
-`Array` type arguments must specify what elements the array may include in
-the description below.
-
-The description for `Function` type arguments should make it clear how it may be
-called and list the types of the parameters that will be passed to it.
-
 ### Events
 
 The events chapter must be in following form:
@@ -211,8 +232,8 @@ Returns:
 ...
 ```
 
-The title can be `###` or `####`-levels depending on whether it is an event of
-a module or a class.
+The heading can be `###` or `####`-levels depending on whether the event
+belongs to a module or a class.
 
 The arguments of an event follow the same rules as methods.
 
@@ -226,9 +247,13 @@ The properties chapter must be in following form:
 ...
 ```
 
-The title can be `###` or `####`-levels depending on whether it is a property of
-a module or a class.
+The heading can be `###` or `####`-levels depending on whether the property
+belongs to a module or a class.
 
-## Documentation Translations
+## Documentation translations
 
 See [electron/i18n](https://github.com/electron/i18n#readme)
+
+[title-case]: https://apastyle.apa.org/style-grammar-guidelines/capitalization/title-case
+[sentence-case]: https://apastyle.apa.org/style-grammar-guidelines/capitalization/sentence-case
+[markdownlint]: https://github.com/DavidAnson/markdownlint

docs/tutorial/application-distribution.md

@@ -18,7 +18,7 @@ distributable Electron application, such as bundling your application,
 rebranding the executable, and setting the right icons.
 
 You can check the example of how to package your app with `electron-forge` in
-our [Quick Start Guide](quick-start.md#package-and-distribute-the-application).
+the [Quick Start guide](quick-start.md#package-and-distribute-your-application).
 
 ## Manual distribution
 

docs/tutorial/dark-mode.md

@@ -47,18 +47,18 @@ of this theming, due to the use of the macOS 10.14 SDK.
 
 ## Example
 
-We'll start with a working application from the
-[Quick Start Guide](quick-start.md) and add functionality gradually.
+This example demonstrates an Electron application that derives its theme colors from the
+`nativeTheme`. Additionally, it provides theme toggle and reset controls using IPC channels.
 
-First, let's edit our interface so users can toggle between light and dark
-modes.  This basic UI contains buttons to change the `nativeTheme.themeSource`
-setting and a text element indicating which `themeSource` value is selected.
-By default, Electron follows the system's dark mode preference, so we
-will hardcode the theme source as "System".
+```javascript fiddle='docs/fiddles/features/macos-dark-mode'
 
-Add the following lines to the `index.html` file:
+```
 
-```html
+### How does this work?
+
+Starting with the `index.html` file:
+
+```html title='index.html'
 <!DOCTYPE html>
 <html>
 <head>
@@ -80,65 +80,70 @@ Add the following lines to the `index.html` file:
 </html>
 ```
 
-Next, add [event listeners](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)
-that listen for `click` events on the toggle buttons. Because the `nativeTheme`
-module only exposed in the Main process, you need to set up each listener's
-callback to use IPC to send messages to and handle responses from the Main
-process:
+And the `style.css` file:
 
-* when the "Toggle Dark Mode" button is clicked, we send the
-`dark-mode:toggle` message (event) to tell the Main process to trigger a theme
-change, and update the "Current Theme Source" label in the UI based on the
-response from the Main process.
-* when the "Reset to System Theme" button is clicked, we send the
-`dark-mode:system` message (event) to tell the Main process to use the system
-color scheme, and update the "Current Theme Source" label to `System`.
+```css title='style.css'
+@media (prefers-color-scheme: dark) {
+  body { background: #333; color: white; }
+}
 
-To add listeners and handlers, add the following lines to the `renderer.js` file:
+@media (prefers-color-scheme: light) {
+  body { background: #ddd; color: black; }
+}
+```
 
-```javascript
-const { ipcRenderer } = require('electron')
+The example renders an HTML page with a couple elements. The `<strong id="theme-source">`
+ element shows which theme is currently selected, and the two `<button>` elements are the
+ controls. The CSS file uses the [`prefers-color-scheme`][prefers-color-scheme] media query
+ to set the `<body>` element background and text colors.
 
+The `preload.js` script adds a new API to the `window` object called `darkMode`. This API
+ exposes two IPC channels to the renderer process, `'dark-mode:toggle'` and `'dark-mode:system'`.
+ It also assigns two methods, `toggle` and `system`, which pass messages from the renderer to the
+ main process.
+
+```js title='preload.js'
+const { contextBridge, ipcRenderer } = require('electron')
+
+contextBridge.exposeInMainWorld('darkMode', {
+  toggle: () => ipcRenderer.invoke('dark-mode:toggle'),
+  system: () => ipcRenderer.invoke('dark-mode:system')
+})
+```
+
+Now the renderer process can communicate with the main process securely and perform the necessary
+ mutations to the `nativeTheme` object.
+
+The `renderer.js` file is responsible for controlling the `<button>` functionality.
+
+```js title='renderer.js'
 document.getElementById('toggle-dark-mode').addEventListener('click', async () => {
-  const isDarkMode = await ipcRenderer.invoke('dark-mode:toggle')
+  const isDarkMode = await window.darkMode.toggle()
   document.getElementById('theme-source').innerHTML = isDarkMode ? 'Dark' : 'Light'
 })
 
 document.getElementById('reset-to-system').addEventListener('click', async () => {
-  await ipcRenderer.invoke('dark-mode:system')
+  await window.darkMode.system()
   document.getElementById('theme-source').innerHTML = 'System'
 })
 ```
 
-If you run your code at this point, you'll see that your buttons don't do
-anything just yet, and your Main process will output an error like this when
-you click on your buttons:
-`Error occurred in handler for 'dark-mode:toggle': No handler registered for 'dark-mode:toggle'`
-This is expected — we haven't actually touched any `nativeTheme` code yet.
+Using `addEventListener`, the `renderer.js` file adds `'click'` [event listeners][event-listeners]
+ to each button element. Each event listener handler makes calls to the respective `window.darkMode`
+ API methods.
 
-Now that we're done wiring the IPC from the Renderer's side, the next step
-is to update the `main.js` file to handle events from the Renderer process.
+Finally, the `main.js` file represents the main process and contains the actual `nativeTheme` API.
 
-Depending on the received event, we update the
-[`nativeTheme.themeSource`](../api/native-theme.md#nativethemethemesource)
-property to apply the desired theme on the system's native UI elements
-(e.g. context menus) and propagate the preferred color scheme to the Renderer
-process:
-
-* Upon receiving `dark-mode:toggle`, we check if the dark theme is currently
-active using the `nativeTheme.shouldUseDarkColors` property, and set the
-`themeSource` to the opposite theme.
-* Upon receiving `dark-mode:system`, we reset the `themeSource` to `system`.
-
-```javascript
+```js
 const { app, BrowserWindow, ipcMain, nativeTheme } = require('electron')
+const path = require('path')
 
 function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600,
     webPreferences: {
-      nodeIntegration: true
+      preload: path.join(__dirname, 'preload.js')
     }
   })
 
@@ -158,40 +163,37 @@ function createWindow () {
   })
 }
 
-app.whenReady().then(createWindow)
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', () => {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow()
+    }
+  })
+})
 
 app.on('window-all-closed', () => {
   if (process.platform !== 'darwin') {
     app.quit()
   }
 })
-
-app.on('activate', () => {
-  if (BrowserWindow.getAllWindows().length === 0) {
-    createWindow()
-  }
-})
 ```
 
-The final step is to add a bit of styling to enable dark mode for the web parts
-of the UI by leveraging the [`prefers-color-scheme`][prefer-color-scheme] CSS
-attribute. The value of `prefers-color-scheme` will follow your
-`nativeTheme.themeSource` setting.
+The `ipcMain.handle` methods are how the main process responds to the click events from the buttons
+ on the HTML page.
 
-Create a `styles.css` file and add the following lines:
+The `'dark-mode:toggle'` IPC channel handler method checks the `shouldUseDarkColors` boolean property,
+ sets the corresponding `themeSource`, and then returns the current `shouldUseDarkColors` property.
+ Looking back on the renderer process event listener for this IPC channel, the return value from this
+ handler is utilized to assign the correct text to the `<strong id='theme-source'>` element.
 
-```css fiddle='docs/fiddles/features/macos-dark-mode'
-@media (prefers-color-scheme: dark) {
-  body { background:  #333; color: white; }
-}
+The `'dark-mode:system'` IPC channel handler method assigns the string `'system'` to the `themeSource`
+ and returns nothing. This also corresponds with the relative renderer process event listener as the
+ method is awaited with no return value expected.
 
-@media (prefers-color-scheme: light) {
-  body { background:  #ddd; color: black; }
-}
-```
-
-After launching the Electron application, you can change modes or reset the
-theme to system default by clicking corresponding buttons:
+Run the example using Electron Fiddle and then click the "Toggle Dark Mode" button; the app should
+ start alternating between a light and dark background color.
 
 ![Dark Mode](../images/dark_mode.gif)
 
@@ -199,4 +201,5 @@ theme to system default by clicking corresponding buttons:
 [electron-forge]: https://www.electronforge.io/
 [electron-packager]: https://github.com/electron/electron-packager
 [packager-darwindarkmode-api]: https://electron.github.io/electron-packager/master/interfaces/electronpackager.options.html#darwindarkmodesupport
-[prefer-color-scheme]: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme
+[prefers-color-scheme]: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme
+[event-listeners]: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

docs/tutorial/electron-timelines.md

@@ -19,4 +19,5 @@
 | 10.0.0 | 2020-05-21 | 2020-08-25 | M85 | v12.16 |
 | 11.0.0 | 2020-08-27 | 2020-11-17 | M87 | v12.18 |
 | 12.0.0 | 2020-11-19 | 2021-03-02 | M89 | v14.16 |
-| 13.0.0 | 2021-03-04 | 2021-05-25 | M91 | v14.x |
+| 13.0.0 | 2021-03-04 | 2021-05-25 | M91 | v14.16 |
+| 14.0.0 | 2021-05-27 | 2021-08-31 | M93 | TBD |

docs/tutorial/fuses.md

@@ -51,4 +51,4 @@ Somewhere in the Electron binary there will be a sequence of bytes that look lik
 
 To flip a fuse you find its position in the fuse wire and change it to "0" or "1" depending on the state you'd like.
 
-You can view the current schema [here](https://github.com/electron/electron/blob/master/build/fuses/fuses.json).
+You can view the current schema [here](https://github.com/electron/electron/blob/master/build/fuses/fuses.json5).

docs/tutorial/introduction.md

@@ -0,0 +1,59 @@
+# Introduction
+
+Welcome to the Electron documentation! If this is your first time developing
+an Electron app, read through this Getting Started section to get familiar with the
+basics. Otherwise, feel free to explore our guides and API documentation!
+
+## What is Electron?
+
+Electron is a framework for building desktop applications using JavaScript,
+HTML, and CSS. By embedding [Chromium][chromium] and [Node.js][node] into its
+binary, Electron allows you to maintain one JavaScript codebase and create
+cross-platform apps that work on Windows, macOS, and Linux — no native development
+experience required.
+
+## Prerequisites
+
+These docs operate under the assumption that the reader is familiar with both
+Node.js and general web development. If you need to get more comfortable with
+either of these areas, we recommend the following resources:
+
+* [Getting started with the Web (MDN)][mdn-guide]
+* [Introduction to Node.js][node-guide]
+
+Moreover, you'll have a better time understanding how Electron works if you get
+acquainted with Chromium's process model. You can get a brief overview of
+Chrome architecture with the [Chrome comic][comic], which was released alongside
+Chrome's launch back in 2008. Although it's been over a decade since then, the
+core principles introduced in the comic remain helpful to understand Electron.
+
+## Running examples with Electron Fiddle
+
+[Electron Fiddle][fiddle] is a sandbox app written with Electron and supported by
+Electron's maintainers. We highly recommend installing it as a learning tool to
+experiment with Electron's APIs or to prototype features during development.
+
+Fiddle also integrates nicely with our documentation. When browsing through examples
+in our tutorials, you'll frequently see an "Open in Electron Fiddle" button underneath
+a code block. If you have Fiddle installed, this button will open a
+`fiddle.electronjs.org` link that will automatically load the example into Fiddle,
+no copy-pasting required.
+
+## Getting help
+
+Are you getting stuck anywhere? Here are a few links to places to look:
+
+* If you need help with developing your app, our [community Discord server][discord]
+is a great place to get advice from other Electron app developers.
+* If you suspect you're running into a bug with the `electron` package, please check
+the [GitHub issue tracker][issue-tracker] to see if any existing issues match your
+problem. If not, feel free to fill out our bug report template and submit a new issue.
+
+[chromium]: https://www.chromium.org/
+[node]: https://nodejs.org/
+[mdn-guide]: https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web
+[node-guide]: https://nodejs.dev/learn
+[comic]: https://www.google.com/googlebooks/chrome/
+[fiddle]: https://electronjs.org/fiddle
+[issue-tracker]: https://github.com/electron/electron/issues
+[discord]: https://discord.gg/electron

docs/tutorial/keyboard-shortcuts.md

@@ -81,11 +81,17 @@ If you want to handle keyboard shortcuts within a [BrowserWindow], you can
 listen for the `keyup` and `keydown` [DOM events][dom-events] inside the
 renderer process using the [addEventListener() API][addEventListener-api].
 
-```js
-window.addEventListener('keyup', doSomething, true)
+```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/web-apis|focus=renderer.js'
+function handleKeyPress(event) {
+  // You can put code here to handle the keypress.
+  document.getElementById("last-keypress").innerText = event.key;
+  console.log(`You pressed ${event.key}`);
+}
+
+window.addEventListener('keyup', handleKeyPress, true);
 ```
 
-Note the third parameter `true` indicates that the listener will always receive
+> Note:  the third parameter `true` indicates that the listener will always receive
 key presses before other listeners so they can't have `stopPropagation()`
 called on them.
 
@@ -95,8 +101,6 @@ The [`before-input-event`](../api/web-contents.md#event-before-input-event) even
 is emitted before dispatching `keydown` and `keyup` events in the page. It can
 be used to catch and handle custom shortcuts that are not visible in the menu.
 
-##### Example
-
 Starting with a working application from the
 [Quick Start Guide](quick-start.md), update the `main.js` file with the
 following lines:
@@ -105,7 +109,7 @@ following lines:
 const { app, BrowserWindow } = require('electron')
 
 app.whenReady().then(() => {
-  const win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: true } })
+  const win = new BrowserWindow({ width: 800, height: 600 })
 
   win.loadFile('index.html')
   win.webContents.on('before-input-event', (event, input) => {

docs/tutorial/macos-dock.md

@@ -1,6 +1,4 @@
-# macOS Dock
-
-## Overview
+# Configuring the macOS Dock
 
 Electron has APIs to configure the app's icon in the macOS Dock. A macOS-only
 API exists to create a custom dock menu, but Electron also uses the app dock
@@ -25,7 +23,16 @@ Starting with a working application from the
  following lines:
 
 ```javascript fiddle='docs/fiddles/features/macos-dock-menu'
-const { app, Menu } = require('electron')
+const { app, BrowserWindow, Menu } = require('electron')
+
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600,
+  })
+
+  win.loadFile('index.html')
+}
 
 const dockMenu = Menu.buildFromTemplate([
   {
@@ -42,8 +49,23 @@ const dockMenu = Menu.buildFromTemplate([
 ])
 
 app.whenReady().then(() => {
-  app.dock.setMenu(dockMenu)
+  if (process.platform === 'darwin') {
+    app.dock.setMenu(dockMenu)
+  }
+}).then(createWindow)
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
 })
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow()
+  }
+})
+
 ```
 
 After launching the Electron application, right click the application icon.

docs/tutorial/native-file-drag-drop.md

@@ -14,30 +14,46 @@ API in response to the `ondragstart` event.
 
 ## Example
 
-Starting with a working application from the
-[Quick Start Guide](quick-start.md), add the following lines to the
-`index.html` file:
+An example demonstrating how you can create a file on the fly to be dragged out of the window.
+
+### Preload.js
+
+In `preload.js` use the [`contextBridge`] to inject a method `window.electron.startDrag(...)` that will send an IPC message to the main process.
+
+```js
+const { contextBridge, ipcRenderer } = require('electron')
+const path = require('path')
+
+contextBridge.exposeInMainWorld('electron', {
+  startDrag: (fileName) => {
+    ipcRenderer.send('ondragstart', path.join(process.cwd(), fileName))
+  }
+})
+```
+
+### Index.html
+
+Add a draggable element to `index.html`, and reference your renderer script:
 
 ```html
-<a href="#" id="drag">Drag me</a>
+<div style="border:2px solid black;border-radius:3px;padding:5px;display:inline-block" draggable="true" id="drag">Drag me</div>
 <script src="renderer.js"></script>
 ```
 
-and add the following lines to the `renderer.js` file:
+### Renderer.js
+
+In `renderer.js` set up the renderer process to handle drag events by calling the method you added via the [`contextBridge`] above.
 
 ```javascript
-const { ipcRenderer } = require('electron')
-
 document.getElementById('drag').ondragstart = (event) => {
   event.preventDefault()
-  ipcRenderer.send('ondragstart', '/absolute/path/to/the/item')
+  window.electron.startDrag('drag-and-drop.md')
 }
 ```
 
-The code above instructs the Renderer process to handle the `ondragstart` event
-and forward the information to the Main process.
+### Main.js
 
-In the Main process(`main.js` file), expand the received event with a path to the file that is
+In the Main process (`main.js` file), expand the received event with a path to the file that is
 being dragged and an icon:
 
 ```javascript fiddle='docs/fiddles/features/drag-and-drop'
@@ -56,3 +72,5 @@ the item from the BrowserWindow onto your desktop. In this guide,
 the item is a Markdown file located in the root of the project:
 
 ![Drag and drop](../images/drag-and-drop.gif)
+
+[`contextBridge`]: ../api/context-bridge.md

docs/tutorial/notifications.md

@@ -18,7 +18,7 @@ To show notifications in the Main process, you need to use the
 
 ### Show notifications in the Renderer process
 
-Assuming you have a working Electron application from the
+Starting with a working application from the
 [Quick Start Guide](quick-start.md), add the following line to the
 `index.html` file before the closing `</body>` tag:
 
@@ -26,26 +26,22 @@ Assuming you have a working Electron application from the
 <script src="renderer.js"></script>
 ```
 
-and add the `renderer.js` file:
+...and add the `renderer.js` file:
 
 ```javascript fiddle='docs/fiddles/features/notifications/renderer'
-const myNotification = new Notification('Title', {
-  body: 'Notification from the Renderer process'
-})
+const NOTIFICATION_TITLE = 'Title'
+const NOTIFICATION_BODY = 'Notification from the Renderer process. Click to log to console.'
+const CLICK_MESSAGE = 'Notification clicked'
 
-myNotification.onclick = () => {
-  console.log('Notification clicked')
-}
+new Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY })
+  .onclick = () => console.log(CLICK_MESSAGE)
 ```
 
 After launching the Electron application, you should see the notification:
 
 ![Notification in the Renderer process](../images/notification-renderer.png)
 
-If you open the Console and then click the notification, you will see the
-message that was generated after triggering the `onclick` event:
-
-![Onclick message for the notification](../images/message-notification-renderer.png)
+Additionally, if you click on the notification, the DOM will update to show "Notification clicked!".
 
 ### Show notifications in the Main process
 
@@ -55,18 +51,17 @@ Starting with a working application from the
 ```javascript fiddle='docs/fiddles/features/notifications/main'
 const { Notification } = require('electron')
 
+const NOTIFICATION_TITLE = 'Basic Notification'
+const NOTIFICATION_BODY = 'Notification from the Main process'
+
 function showNotification () {
-  const notification = {
-    title: 'Basic Notification',
-    body: 'Notification from the Main process'
-  }
-  new Notification(notification).show()
+  new Notification({ title: NOTIFICATION_TITLE, body: NOTIFICATION_BODY }).show()
 }
 
 app.whenReady().then(createWindow).then(showNotification)
 ```
 
-After launching the Electron application, you should see the notification:
+After launching the Electron application, you should see the system notification:
 
 ![Notification in the Main process](../images/notification-main.png)
 

docs/tutorial/offscreen-rendering.md

@@ -39,10 +39,6 @@ To enable this mode, GPU acceleration has to be disabled by calling the
 
 ## Example
 
-Starting with a working application from the
-[Quick Start Guide](quick-start.md), add the following lines to the
-`main.js` file:
-
 ```javascript fiddle='docs/fiddles/features/offscreen-rendering'
 const { app, BrowserWindow } = require('electron')
 const fs = require('fs')
@@ -63,5 +59,5 @@ app.whenReady().then(() => {
 ```
 
 After launching the Electron application, navigate to your application's
-working folder.
+working folder, where you'll find the rendered image.
 [disablehardwareacceleration]: ../api/app.md#appdisablehardwareacceleration

docs/tutorial/online-offline-events.md

@@ -21,83 +21,29 @@ status of Electron, you should develop additional means for this check.
 
 ## Example
 
-### Event detection in the Renderer process
+Starting with an HTML file `index.html`, this example will demonstrate how the `navigator.onLine` API can be used to build a connection status indicator.
 
-Starting with a working application from the
-[Quick Start Guide](quick-start.md), update the `main.js` file
-with the following lines:
-
-```javascript
-const { app, BrowserWindow } = require('electron')
-
-let onlineStatusWindow
-
-app.whenReady().then(() => {
-  onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
-  onlineStatusWindow.loadURL(`file://${__dirname}/index.html`)
-})
+```html title="index.html"
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>Hello World!</title>
+    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
+</head>
+<body>
+    <h1>Connection status: <strong id='status'></strong></h1>
+    <script src="renderer.js"></script>
+</body>
+</html>
 ```
 
-in the `index.html` file, add the following line before the
-closing `</body>` tag:
+In order to mutate the DOM, create a `renderer.js` file that adds event listeners to the `'online'` and `'offline'` `window` events. The event handler sets the content of the `<strong id='status'>` element depending on the result of `navigator.onLine`.
 
-```html
-<script src="renderer.js"></script>
-```
-
-and add the `renderer.js` file:
-
-```javascript fiddle='docs/fiddles/features/online-detection/renderer'
-const alertOnlineStatus = () => { window.alert(navigator.onLine ? 'online' : 'offline') }
-
-window.addEventListener('online', alertOnlineStatus)
-window.addEventListener('offline', alertOnlineStatus)
-
-alertOnlineStatus()
-```
-
-After launching the Electron application, you should see the notification:
-
-![Online-offline-event detection](../images/online-event-detection.png)
-
-### Event detection in the Main process
-
-There may be situations when you want to respond to online/offline events in
-the Main process as well. The Main process, however, does not have a
-`navigator` object and cannot detect these events directly. In this case, you
-need to forward the events to the Main process using Electron's inter-process
-communication (IPC) utilities.
-
-Starting with a working application from the
-[Quick Start Guide](quick-start.md), update the `main.js` file
-with the following lines:
-
-```javascript
-const { app, BrowserWindow, ipcMain } = require('electron')
-let onlineStatusWindow
-
-app.whenReady().then(() => {
-  onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false, webPreferences: { nodeIntegration: true } })
-  onlineStatusWindow.loadURL(`file://${__dirname}/index.html`)
-})
-
-ipcMain.on('online-status-changed', (event, status) => {
-  console.log(status)
-})
-```
-
-in the `index.html` file, add the following line before the
-closing `</body>` tag:
-
-```html
-<script src="renderer.js"></script>
-```
-
-and add the `renderer.js` file:
-
-```javascript fiddle='docs/fiddles/features/online-detection/main'
-const { ipcRenderer } = require('electron')
-const updateOnlineStatus = () => { ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline') }
+```js title='renderer.js'
+function updateOnlineStatus () {
+  document.getElementById('status').innerHTML = navigator.onLine ? 'online' : 'offline'
+}
 
 window.addEventListener('online', updateOnlineStatus)
 window.addEventListener('offline', updateOnlineStatus)
@@ -105,14 +51,39 @@ window.addEventListener('offline', updateOnlineStatus)
 updateOnlineStatus()
 ```
 
-After launching the Electron application, you should see the notification in the
-Console:
+Finally, create a `main.js` file for main process that creates the window.
 
-```sh
-npm start
+```js title='main.js'
+const { app, BrowserWindow } = require('electron')
 
-> electron@1.0.0 start /electron
-> electron .
+function createWindow () {
+  const onlineStatusWindow = new BrowserWindow({
+    width: 400,
+    height: 100
+  })
 
-online
+  onlineStatusWindow.loadFile('index.html')
+}
+
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', () => {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow()
+    }
+  })
+})
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})
 ```
+
+After launching the Electron application, you should see the notification:
+
+![Connection status](../images/connection-status.png)
+
+> Note: If you need to communicate the connection status to the main process, use the [IPC renderer](../api/ipc-renderer.md) API.

docs/tutorial/performance.md

@@ -120,9 +120,9 @@ file in the directory you executed it in. Both files can be analyzed using
 the Chrome Developer Tools, using the `Performance` and `Memory` tabs
 respectively.
 
-![performance-cpu-prof]
+![Performance CPU Profile][performance-cpu-prof]
 
-![performance-heap-prof]
+![Performance Heap Memory Profile][performance-heap-prof]
 
 In this example, on the author's machine, we saw that loading `request` took
 almost half a second, whereas `node-fetch` took dramatically less memory

docs/tutorial/process-model.md

@@ -0,0 +1,206 @@
+# Process Model
+
+Electron inherits its multi-process architecture from Chromium, which makes the framework
+architecturally very similar to a modern web browser. In this guide, we'll expound on
+the conceptual knowledge of Electron that we applied in the minimal [quick start app][].
+
+[quick start app]: ./quick-start.md
+
+## Why not a single process?
+
+Web browsers are incredibly complicated applications. Aside from their primary ability
+to display web content, they have many secondary responsibilities,
+such as managing multiple windows (or tabs) and loading third-party extensions.
+
+In the earlier days, browsers usually used a single process for all of this
+functionality. Although this pattern meant less overhead for each tab you had open,
+it also meant that one website crashing or hanging would affect the entire browser.
+
+## The multi-process model
+
+To solve this problem, the Chrome team decided that each tab would render in its own
+process, limiting the harm that buggy or malicious code on a web page could cause to
+the app as a whole. A single browser process then controls these processes, as well
+as the application lifecycle as a whole. This diagram below from the [Chrome Comic]
+visualizes this model:
+
+![Chrome's multi-process architecture](../images/chrome-processes.png)
+
+Electron applications are structured very similarly. As an app developer, you control
+two types of processes: main and renderer. These are analogous to Chrome's own browser
+and renderer processes outlined above.
+
+[Chrome Comic]: https://www.google.com/googlebooks/chrome/
+
+## The main process
+
+Each Electron app has a single main process, which acts as the application's entry
+point. The main process runs in a Node.js environment, meaning it has the ability
+to `require` modules and use all of Node.js APIs.
+
+### Window management
+
+The main process' primary purpose is to create and manage application windows with the
+[`BrowserWindow`][browser-window] module.
+
+Each instance of the `BrowserWindow` class creates an application window that loads
+a web page in a separate renderer process. You can interact with this web content
+from the main process using the window's [`webContents`][web-contents] object.
+
+```js title='main.js'
+const { BrowserWindow } = require('electron')
+
+const win = new BrowserWindow({ width: 800, height: 1500 })
+win.loadURL('https://github.com')
+
+const contents = win.webContents
+console.log(contents)
+```
+
+> Note: A renderer process is also created for [web embeds][web-embed] such as the
+> `BrowserView` module. The `webContents` object is also accessible for embedded
+> web content.
+
+Because the `BrowserWindow` module is an [`EventEmitter`][event-emitter], you can also
+add handlers for various user events (for example, minimizing or maximizing your window).
+
+When a `BrowserWindow` instance is destroyed, its corresponding renderer process gets
+terminated as well.
+
+[browser-window]: ../api/browser-window.md
+[web-embed]: ./web-embeds.md
+[web-contents]: ../api/web-contents.md
+[event-emitter]: https://nodejs.org/api/events.html#events_class_eventemitter
+
+### Application lifecycle
+
+The main process also controls your application's lifecycle through Electron's
+[`app`][app] module. This module provides a large set of events and methods
+that you can use to add custom application behaviour (for instance, programatically
+quitting your application, modifying the application dock, or showing an About panel).
+
+As a practical example, the app shown in the [quick start guide][quick-start-lifecycle]
+uses `app` APIs to create a more native application window experience.
+
+```js title='main.js'
+// quitting the app when no windows are open on macOS
+app.on('window-all-closed', function () {
+  if (process.platform !== 'darwin') app.quit()
+})
+```
+
+[app]: ../api/app.md
+[quick-start-lifecycle]: ./quick-start.md#manage-your-windows-lifecycle
+
+### Native APIs
+
+To extend Electron's features beyond being a Chromium wrapper for web contents, the
+main process also adds custom APIs to interact with the user's operating system.
+Electron exposes various modules that control native desktop functionality, such
+as menus, dialogs, and tray icons.
+
+For a full list of Electron's main process modules, check out our API documentation.
+
+## The renderer process
+
+Each Electron app spawns a separate renderer process for each open `BrowserWindow`
+(and each web embed). As its name implies, a renderer is responsible for
+*rendering* web content. For all intents and purposes, code ran in renderer processes
+should behave according to web standards (insofar as Chromium does, at least).
+
+Therefore, all user interfaces and app functionality within a single browser
+window should be written with the same tools and paradigms that you use on the
+web.
+
+Although explaining every web spec is out of scope for this guide, the bare minimum
+to understand is:
+
+* An HTML file is your entry point for the renderer process.
+* UI styling is added through Cascading Style Sheets (CSS).
+* Executable JavaScript code can be added through `<script>` elements.
+
+Moreover, this also means that the renderer has no direct access to `require`
+or other Node.js APIs. In order to directly include NPM modules in the renderer,
+you must use the same bundler toolchains (for example, `webpack` or `parcel`) that you
+use on the web.
+
+> Note: Renderer processes can be spawned with a full Node.js environment for ease of
+> development. Historically, this used to be the default, but this feature was disabled
+> for security reasons.
+
+At this point, you might be wondering how your renderer process user interfaces
+can interact with Node.js and Electron's native desktop functionality if these
+features are only accessible from the main process. In fact, there is no direct
+way to import Electron's content scripts.
+
+## Preload scripts
+
+<!-- Note: This guide doesn't take sandboxing into account, which might fundamentally 
+change the statements here. -->
+Preload scripts contain code that executes in a renderer process before its web content
+begins loading. These scripts run within the renderer context, but are granted more
+privileges by having access to Node.js APIs.
+
+A preload script can be attached to the main process in the `BrowserWindow` constructor's
+`webPreferences` option.
+
+```js title='main.js'
+const { BrowserWindow } = require('electron')
+//...
+const win = new BrowserWindow({
+  preload: 'path/to/preload.js'
+})
+//...
+```
+
+Because the preload script shares a global [`Window`][window-mdn] interface with the
+renderers and can access Node.js APIs, it serves to enhance your renderer by exposing
+arbitrary APIs in the `window` global that your web contents can then consume.
+
+Although preload scripts share a `window` global with the renderer they're attached to,
+you cannot directly attach any variables from the preload script to `window` because of
+the [`contextIsolation`][context-isolation] default.
+
+```js title='preload.js'
+window.myAPI = {
+  desktop: true
+}
+```
+
+```js title='renderer.js'
+console.log(window.myAPI)
+// => undefined
+```
+
+Context Isolation means that preload scripts are isolated from the renderer's main world
+to avoid leaking any privileged APIs into your web content's code.
+
+Instead, use the [`contextBridge`][context-bridge] module to accomplish this
+securely:
+
+```js title='preload.js'
+const { contextBridge } = require('electron')
+
+contextBridge.exposeInMainWorld('myAPI', {
+  desktop: true
+})
+```
+
+```js title='renderer.js'
+console.log(window.myAPI)
+// => { desktop: true }
+```
+
+This feature is incredibly useful for two main purposes:
+
+* By exposing [`ipcRenderer`][ipcRenderer] helpers to the renderer, you can use
+  inter-process communication (IPC) to trigger main process tasks from the
+  renderer (and vice-versa).
+* If you're developing an Electron wrapper for an existing web app hosted on a remote
+  URL, you can add custom properties onto the renderer's `window` global that can
+  be used for desktop-only logic on the web client's side.
+
+[window-mdn]: https://developer.mozilla.org/en-US/docs/Web/API/Window
+[context-isolation]: ./context-isolation.md
+[context-bridge]: ../api/context-bridge.md
+[ipcRenderer]: ../api/ipc-renderer.md

docs/tutorial/progress-bar.md

@@ -31,30 +31,70 @@ currently at 63% towards completion, you would call it as
 `setProgressBar(0.63)`.
 
 Setting the parameter to negative values (e.g. `-1`) will remove the progress
-bar, whereas setting it to values greater than `1` (e.g. `2`) will switch the
-progress bar to indeterminate mode (Windows-only -- it will clamp to 100%
-otherwise). In this mode, a progress bar remains active but does not show an
-actual percentage. Use this mode for situations when you do not know how long
-an operation will take to complete.
+bar. Setting it to a value greater than `1` will indicate an indeterminate progress bar
+in Windows or clamp to 100% in other operating systems. An indeterminate progress bar
+remains active but does not show an actual percentage, and is used for situations when
+you do not know how long an operation will take to complete.
 
 See the [API documentation for more options and modes][setprogressbar].
 
 ## Example
 
-Starting with a working application from the
-[Quick Start Guide](quick-start.md), add the following lines to the
-`main.js` file:
+In this example, we add a progress bar to the main window that increments over time
+using Node.js timers.
 
 ```javascript fiddle='docs/fiddles/features/progress-bar'
-const { BrowserWindow } = require('electron')
-const win = new BrowserWindow()
+const { app, BrowserWindow } = require('electron')
 
-win.setProgressBar(0.5)
+let progressInterval
+
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600
+  })
+
+  win.loadFile('index.html')
+
+  const INCREMENT = 0.03
+  const INTERVAL_DELAY = 100 // ms
+
+  let c = 0
+  progressInterval = setInterval(() => {
+    // update progress bar to next value
+    // values between 0 and 1 will show progress, >1 will show indeterminate or stick at 100%
+    win.setProgressBar(c)
+
+    // increment or reset progress bar
+    if (c < 2) c += INCREMENT
+    else c = 0
+  }, INTERVAL_DELAY)
+}
+
+app.whenReady().then(createWindow)
+
+// before the app is terminated, clear both timers
+app.on('before-quit', () => {
+  clearInterval(progressInterval)
+})
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow()
+  }
+})
 ```
 
-After launching the Electron application, you should see the bar in
-the dock (macOS) or taskbar (Windows, Unity), indicating the progress
-percentage you just defined.
+After launching the Electron application, the dock (macOS) or taskbar (Windows, Unity)
+should show a progress bar that starts at zero and progresses through 100% to completion.
+It should then show indeterminate (Windows) or pin to 100% (other operating systems)
+briefly and then loop.
 
 ![macOS dock progress bar](../images/dock-progress-bar.png)
 

docs/tutorial/quick-start.md

@@ -1,20 +1,23 @@
-# Quick Start Guide
+# Quick Start
 
-## Quickstart
+This guide will step you through the process of creating a barebones Hello World app in
+Electron, similar to [`electron/electron-quick-start`][quick-start].
 
-Electron is a framework that enables you to create desktop applications with JavaScript, HTML, and CSS. These applications can then be packaged to run directly on macOS, Windows, or Linux, or distributed via the Mac App Store or the Microsoft Store.
+By the end of this tutorial, your app will open a browser window that displays a web page
+with information about which Chromium, Node.js, and Electron versions are running.
 
-Typically, you create a desktop application for an operating system (OS) using each operating system's specific native application frameworks. Electron makes it possible to write your application once using technologies that you already know.
+[quick-start]: https://github.com/electron/electron-quick-start
 
-### Prerequisites
+## Prerequisites
 
-Before proceeding with Electron you need to install [Node.js][node-download].
-We recommend that you install either the latest `LTS` or `Current` version available.
+To use Electron, you need to install [Node.js][node-download]. We recommend that you
+use the latest `LTS` version available.
 
 > Please install Node.js using pre-built installers for your platform.
 > You may encounter incompatibility issues with different development tools otherwise.
 
-To check that Node.js was installed correctly, type the following commands in your terminal client:
+To check that Node.js was installed correctly, type the following commands in your
+terminal client:
 
 ```sh
 node -v
@@ -22,42 +25,276 @@ npm -v
 ```
 
 The commands should print the versions of Node.js and npm accordingly.
-If both commands succeeded, you are ready to install Electron.
 
-### Create a basic application
+**Note:** Since Electron embeds Node.js into its binary, the version of Node.js running
+your code is unrelated to the version running on your system.
 
-From a development perspective, an Electron application is essentially a Node.js application. This means that the starting point of your Electron application will be a `package.json` file like in any other Node.js application. A minimal Electron application has the following structure:
+[node-download]: https://nodejs.org/en/download/
 
-```plaintext
-my-electron-app/
-├── package.json
-├── main.js
-├── preload.js
-└── index.html
-```
+## Create your application
 
-Let's create a basic application based on the structure above.
+### Scaffold the project
 
-#### Install Electron
+Electron apps follow the same general structure as other Node.js projects.
+Start by creating a folder and initializing an npm package.
 
-Create a folder for your project and install Electron there:
-
-```sh
+```sh npm2yarn
 mkdir my-electron-app && cd my-electron-app
-npm init -y
-npm i --save-dev electron
+npm init
 ```
 
-#### Create the main script file
+The interactive `init` command will prompt you to set some fields in your config.
+There are a few rules to follow for the purposes of this tutorial:
 
-The main script specifies the entry point of your Electron application (in our case, the `main.js` file) that will run the Main process. Typically, the script that runs in the Main process controls the lifecycle of the application, displays the graphical user interface and its elements, performs native operating system interactions, and creates Renderer processes within web pages. An Electron application can have only one Main process.
+* `entry point` should be `main.js`.
+* `author` and `description` can be any value, but are necessary for
+[app packaging](#package-and-distribute-your-application).
 
-The main script may look as follows:
+Your `package.json` file should look something like this:
 
-```javascript fiddle='docs/fiddles/quick-start'
+```json
+{
+  "name": "my-electron-app",
+  "version": "1.0.0",
+  "description": "Hello World!",
+  "main": "main.js",
+  "author": "Jane Doe",
+  "license": "MIT"
+}
+```
+
+Then, install the `electron` package into your app's `devDependencies`.
+
+```sh npm2yarn
+$ npm install --save-dev electron
+```
+
+> Note: If you're encountering any issues with installing Electron, please
+> refer to the [Advanced Installation][advanced-installation] guide.
+
+Finally, you want to be able to execute Electron. In the [`scripts`][package-scripts]
+field of your `package.json` config, add a `start` command like so:
+
+```json
+{
+  "scripts": {
+    "start": "electron ."
+  }
+}
+```
+
+This `start` command will let you open your app in development mode.
+
+```sh npm2yarn
+npm start
+```
+
+> Note: This script tells Electron to run on your project's root folder. At this stage,
+> your app will immediately throw an error telling you that it cannot find an app to run.
+
+[advanced-installation]: ./installation.md
+[package-scripts]: https://docs.npmjs.com/cli/v7/using-npm/scripts
+
+### Run the main process
+
+The entry point of any Electron application is its `main` script. This script controls the
+**main process**, which runs in a full Node.js environment and is responsible for
+controlling your app's lifecycle, displaying native interfaces, performing privileged
+operations, and managing renderer processes (more on that later).
+
+During execution, Electron will look for this script in the [`main`][package-json-main]
+field of the app's `package.json` config, which you should have configured during the
+[app scaffolding](#scaffold-the-project) step.
+
+To initialize the `main` script, create an empty file named `main.js` in the root folder
+of your project.
+
+> Note: If you run the `start` script again at this point, your app will no longer throw
+> any errors! However, it won't do anything yet because we haven't added any code into
+> `main.js`.
+
+[package-json-main]: https://docs.npmjs.com/cli/v7/configuring-npm/package-json#main
+
+### Create a web page
+
+Before we can create a window for our application, we need to create the content that
+will be loaded into it. In Electron, each window displays web contents that can be loaded
+from either from a local HTML file or a remote URL.
+
+For this tutorial, you will be doing the former. Create an `index.html` file in the root
+folder of your project:
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
+    <meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">
+    <title>Hello World!</title>
+  </head>
+  <body>
+    <h1>Hello World!</h1>
+    We are using Node.js <span id="node-version"></span>,
+    Chromium <span id="chrome-version"></span>,
+    and Electron <span id="electron-version"></span>.
+  </body>
+</html>
+```
+
+> Note: Looking at this HTML document, you can observe that the version numbers are
+> missing from the body text. We'll manually insert them later using JavaScript.
+
+### Opening your web page in a browser window
+
+Now that you have a web page, load it into an application window. To do so, you'll
+need two Electron modules:
+
+* The [`app`][app] module, which controls your application's event lifecycle.
+* The [`BrowserWindow`][browser-window] module, which creates and manages application
+  windows.
+
+Because the main process runs Node.js, you can import these as [CommonJS][commonjs]
+modules at the top of your file:
+
+```js
 const { app, BrowserWindow } = require('electron')
+```
+
+Then, add a `createWindow()` function that loads `index.html` into a new `BrowserWindow`
+instance.
+
+```js
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600
+  })
+
+  win.loadFile('index.html')
+}
+```
+
+Next, call this `createWindow()` function to open your window.
+
+In Electron, browser windows can only be created after the `app` module's
+[`ready`][app-ready] event is fired. You can wait for this event by using the
+[`app.whenReady()`][app-when-ready] API. Call `createWindow()` after `whenReady()`
+resolves its Promise.
+
+```js
+app.whenReady().then(() => {
+  createWindow()
+})
+```
+
+> Note: At this point, your Electron application should successfully
+> open a window that displays your web page!
+
+[app]: ../api/app.md
+[browser-window]: ../api/browser-window.md
+[commonjs]: https://nodejs.org/docs/latest/api/modules.html#modules_modules_commonjs_modules
+[app-ready]: ../api/app.md#event-ready
+[app-when-ready]: ../api/app.md#appwhenready
+
+### Manage your window's lifecycle
+
+Although you can now open a browser window, you'll need some additional boilerplate code
+to make it feel more native to each platform. Application windows behave differently on
+each OS, and Electron puts the responsibility on developers to implement these
+conventions in their app.
+
+In general, you can use the `process` global's [`platform`][node-platform] attribute
+to run code specifically for certain operating systems.
+
+#### Quit the app when all windows are closed (Windows & Linux)
+
+On Windows and Linux, exiting all windows generally quits an application entirely.
+
+To implement this, listen for the `app` module's [`'window-all-closed'`][window-all-closed]
+event, and call [`app.quit()`][app-quit] if the user is not on macOS (`darwin`).
+
+```js
+app.on('window-all-closed', function () {
+  if (process.platform !== 'darwin') app.quit()
+})
+```
+
+[node-platform]: https://nodejs.org/api/process.html#process_process_platform
+[window-all-closed]: ../api/app.md#event-window-all-closed
+[window-all-closed]: ../api/app.md#appquit
+
+#### Open a window if none are open (macOS)
+
+Whereas Linux and Windows apps quit when they have no windows open, macOS apps generally
+continue running even without any windows open, and activating the app when no windows
+are available should open a new one.
+
+To implement this feature, listen for the `app` module's [`activate`][activate]
+event, and call your existing `createWindow()` method if no browser windows are open.
+
+Because windows cannot be created before the `ready` event, you should only listen for
+`activate` events after your app is initialized. Do this by attaching your event listener
+from within your existing `whenReady()` callback.
+
+[activate]: ../api/app.md#event-activate-macos
+
+```js
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', function () {
+    if (BrowserWindow.getAllWindows().length === 0) createWindow()
+  })
+})
+```
+
+> Note: At this point, your window controls should be fully functional!
+
+### Access Node.js from the renderer with a preload script
+
+Now, the last thing to do is print out the version numbers for Electron and its
+dependencies onto your web page.
+
+Accessing this information is trivial to do in the main process through Node's
+global `process` object. However, you can't just edit the DOM from the main
+process because it has no access to the renderer's `document` context.
+They're in entirely different processes!
+
+> Note: If you need a more in-depth look at Electron processes, see the
+> [Process Model][] document.
+
+This is where attaching a **preload** script to your renderer comes in handy.
+A preload script runs before the renderer process is loaded, and has access to both
+renderer globals (e.g. `window` and `document`) and a Node.js environment.
+
+Create a new script named `preload.js` as such:
+
+```js
+window.addEventListener('DOMContentLoaded', () => {
+  const replaceText = (selector, text) => {
+    const element = document.getElementById(selector)
+    if (element) element.innerText = text
+  }
+
+  for (const dependency of ['chrome', 'node', 'electron']) {
+    replaceText(`${dependency}-version`, process.versions[dependency])
+  }
+})
+```
+
+The above code accesses the Node.js `process.versions` object and runs a basic `replaceText`
+helper function to insert the version numbers into the HTML document.
+
+To attach this script to your renderer process, pass in the path to your preload script
+to the `webPreferences.preload` option in your existing `BrowserWindow` constructor.
+
+```js
+// include the Node.js 'path' module at the top of your file
 const path = require('path')
 
+// modify your existing createWindow() function
 function createWindow () {
   const win = new BrowserWindow({
     width: 800,
@@ -69,133 +306,164 @@ function createWindow () {
 
   win.loadFile('index.html')
 }
+// ...
+```
 
+There are two Node.js concepts that are used here:
+
+* The [`__dirname`][dirname] string points to the path of the currently executing script
+  (in this case, your project's root folder).
+* The [`path.join`][path-join] API joins multiple path segments together, creating a
+  combined path string that works across all platforms.
+
+We use a path relative to the currently executing JavaScript file so that your relative
+path will work in both development and packaged mode.
+
+[Process Model]: ./process-model.md
+[dirname]: https://nodejs.org/api/modules.html#modules_dirname
+[path-join]: https://nodejs.org/api/path.html#path_path_join_paths
+
+### Bonus: Add functionality to your web contents
+
+At this point, you might be wondering how to add more functionality to your application.
+
+For any interactions with your web contents, you want to add scripts to your
+renderer process. Because the renderer runs in a normal web environment, you can add a
+`<script>` tag right before your `index.html` file's closing `</body>` tag to include
+any arbitrary scripts you want:
+
+```html
+<script src="./renderer.js"></script>
+```
+
+The code contained in `renderer.js` can then use the same JavaScript APIs and tooling
+you use for typical front-end development, such as using [`webpack`][webpack] to bundle
+and minify your code or [React][react] to manage your user interfaces.
+
+[webpack]: https://webpack.js.org
+[react]: https://reactjs.org
+
+### Recap
+
+After following the above steps, you should have a fully functional
+Electron application that looks like this:
+
+![Simplest Electron app](../images/simplest-electron-app.png)
+
+<!--TODO(erickzhao): Remove the individual code blocks for static website -->
+The full code is available below:
+
+```js
+// main.js
+
+// Modules to control application life and create native browser window
+const { app, BrowserWindow } = require('electron')
+const path = require('path')
+
+function createWindow () {
+  // Create the browser window.
+  const mainWindow = new BrowserWindow({
+    width: 800,
+    height: 600,
+    webPreferences: {
+      preload: path.join(__dirname, 'preload.js')
+    }
+  })
+
+  // and load the index.html of the app.
+  mainWindow.loadFile('index.html')
+
+  // Open the DevTools.
+  // mainWindow.webContents.openDevTools()
+}
+
+// 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.whenReady().then(() => {
   createWindow()
 
-  app.on('activate', () => {
-    if (BrowserWindow.getAllWindows().length === 0) {
-      createWindow()
-    }
+  app.on('activate', function () {
+    // 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 (BrowserWindow.getAllWindows().length === 0) createWindow()
   })
 })
 
-app.on('window-all-closed', () => {
-  if (process.platform !== 'darwin') {
-    app.quit()
-  }
+// Quit when all windows are closed, except on macOS. There, it's common
+// for applications and their menu bar to stay active until the user quits
+// explicitly with Cmd + Q.
+app.on('window-all-closed', function () {
+  if (process.platform !== 'darwin') app.quit()
 })
+
+// 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.
 ```
 
-##### What is going on above?
+```js
+// preload.js
 
-1. Line 1: First, you import the `app` and `BrowserWindow` modules of the `electron` package to be able to manage your application's lifecycle events, as well as create and control browser windows.
-2. Line 2: Second, you import the `path` package which provides utility functions for file paths.
-3. Line 4: After that, you define a function that creates a [new browser window](../api/browser-window.md#new-browserwindowoptions) with a preload script, loads `index.html` file into this window (line 13, we will discuss the file later).
-4. Line 16: You create a new browser window by invoking the `createWindow` function once the Electron application [is initialized](../api/app.md#appwhenready).
-5. Line 18: You add a new listener that creates a new browser window only if when the application has no visible windows after being activated. For example, after launching the application for the first time, or re-launching the already running application.
-6. Line 25: You add a new listener that tries to quit the application when it no longer has any open windows. This listener is a no-op on macOS due to the operating system's [window management behavior](https://support.apple.com/en-ca/guide/mac-help/mchlp2469/mac).
-
-#### Create a web page
-
-This is the web page you want to display once the application is initialized. This web page represents the Renderer process. You can create multiple browser windows, where each window uses its own independent Renderer. You can optionally grant access to additional Node.js APIs by exposing them from your preload script.
-
-The `index.html` page looks as follows:
-
-```html fiddle='docs/fiddles/quick-start'
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="UTF-8">
-    <title>Hello World!</title>
-    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
-</head>
-<body style="background: white;">
-    <h1>Hello World!</h1>
-    <p>
-        We are using Node.js <span id="node-version"></span>,
-        Chromium <span id="chrome-version"></span>,
-        and Electron <span id="electron-version"></span>.
-    </p>
-</body>
-</html>
-```
-
-#### Define a preload script
-
-Your preload script (in our case, the `preload.js` file) acts as a bridge between Node.js and your web page. It allows you to expose specific APIs and behaviors to your web page rather than insecurely exposing the entire Node.js API. In this example we will use the preload script to read version information from the `process` object and update the web page with that info.
-
-```javascript fiddle='docs/fiddles/quick-start'
+// All of the Node.js APIs are available in the preload process.
+// It has the same sandbox as a Chrome extension.
 window.addEventListener('DOMContentLoaded', () => {
   const replaceText = (selector, text) => {
     const element = document.getElementById(selector)
     if (element) element.innerText = text
   }
 
-  for (const type of ['chrome', 'node', 'electron']) {
-    replaceText(`${type}-version`, process.versions[type])
+  for (const dependency of ['chrome', 'node', 'electron']) {
+    replaceText(`${dependency}-version`, process.versions[dependency])
   }
 })
 ```
 
-##### What's going on above?
+```html
+<!--index.html-->
 
-1. On line 1: First you define an event listener that tells you when the web page has loaded
-2. On line 2: Second you define a utility function used to set the text of the placeholders in the `index.html`
-3. On line 7: Next you loop through the list of components whose version you want to display
-4. On line 8: Finally, you call `replaceText` to look up the version placeholders in `index.html` and set their text value to the values from `process.versions`
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
+    <meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">
+    <title>Hello World!</title>
+  </head>
+  <body>
+    <h1>Hello World!</h1>
+    We are using Node.js <span id="node-version"></span>,
+    Chromium <span id="chrome-version"></span>,
+    and Electron <span id="electron-version"></span>.
 
-#### Modify your package.json file
-
-Your Electron application uses the `package.json` file as the main entry point (as any other Node.js application). The main script of your application is `main.js`, so modify the `package.json` file accordingly:
-
-```json
-{
-    "name": "my-electron-app",
-    "version": "0.1.0",
-    "author": "your name",
-    "description": "My Electron app",
-    "main": "main.js"
-}
+    <!-- You can also require other files to run in this process -->
+    <script src="./renderer.js"></script>
+  </body>
+</html>
 ```
 
-> NOTE: If the `main` field is omitted, Electron will attempt to load an `index.js` file from the directory containing `package.json`.
-
-> NOTE: The `author` and `description` fields are required for packaging, otherwise error will occur when running `npm run make`.
-
-By default, the `npm start` command will run the main script with Node.js. To run the script with Electron, you need to change it as such:
-
-```json
-{
-    "name": "my-electron-app",
-    "version": "0.1.0",
-    "author": "your name",
-    "description": "My Electron app",
-    "main": "main.js",
-    "scripts": {
-        "start": "electron ."
-    }
-}
+```fiddle docs/fiddles/quick-start
 ```
 
-#### Run your application
+To summarize all the steps we've done:
 
-```sh
-npm start
-```
+* We bootstrapped a Node.js application and added Electron as a dependency.
+* We created a `main.js` script that runs our main process, which controls our app
+  and runs in a Node.js environment. In this script, we used Electron's `app` and
+  `BrowserWindow` modules to create a browser window that displays web content
+  in a separate process (the renderer).
+* In order to access certain Node.js functionality in the renderer, we attached
+  a preload script to our `BrowserWindow` constructor.
 
-Your running Electron app should look as follows:
+## Package and distribute your application
 
-![Simplest Electron app](../images/simplest-electron-app.png)
-
-### Package and distribute the application
-
-The simplest and the fastest way to distribute your newly created app is using
+The fastest way to distribute your newly created app is using
 [Electron Forge](https://www.electronforge.io).
 
-1. Import Electron Forge to your app folder:
+1. Add Electron Forge as a development dependency of your app, and use its `import` command to set up
+Forge's scaffolding:
 
-    ```sh
+    ```sh npm2yarn
     npm install --save-dev @electron-forge/cli
     npx electron-forge import
 
@@ -211,12 +479,12 @@ The simplest and the fastest way to distribute your newly created app is using
     Thanks for using "electron-forge"!!!
     ```
 
-1. Create a distributable:
+1. Create a distributable using Forge's `make` command:
 
-    ```sh
+    ```sh npm2yarn
     npm run make
 
-    > my-gsod-electron-app@1.0.0 make /my-electron-app
+    > my-electron-app@1.0.0 make /my-electron-app
     > electron-forge make
 
     ✔ Checking your system
@@ -229,109 +497,12 @@ The simplest and the fastest way to distribute your newly created app is using
     ✔ Making for target: zip - On platform: darwin - For arch: x64
     ```
 
-    Electron-forge creates the `out` folder where your package will be located:
+    Electron Forge creates the `out` folder where your package will be located:
 
     ```plain
-    // Example for MacOS
+    // Example for macOS
     out/
     ├── out/make/zip/darwin/x64/my-electron-app-darwin-x64-1.0.0.zip
     ├── ...
     └── out/my-electron-app-darwin-x64/my-electron-app.app/Contents/MacOS/my-electron-app
     ```
-
-[node-download]: https://nodejs.org/en/download/
-
-## Learning the basics
-
-This section guides you through the basics of how Electron works under the hood. It aims at strengthening knowledge about Electron and the application created earlier in the Quickstart section.
-
-### Application architecture
-
-Electron consists of three main pillars:
-
-* **Chromium** for displaying web content.
-* **Node.js** for working with the local filesystem and the operating system.
-* **Custom APIs** for working with often-needed OS native functions.
-
-Developing an application with Electron is like building a Node.js app with a web interface or building web pages with seamless Node.js integration.
-
-#### Main and Renderer Processes
-
-As it was mentioned before, Electron has two types of processes: Main and Renderer.
-
-* The Main process **creates** web pages by creating `BrowserWindow` instances. Each `BrowserWindow` instance runs the web page in its Renderer process. When a `BrowserWindow` instance is destroyed, the corresponding Renderer process gets terminated as well.
-* The Main process **manages** all web pages and their corresponding Renderer processes.
-
-----
-
-* The Renderer process **manages** only the corresponding web page. A crash in one Renderer process does not affect other Renderer processes.
-* The Renderer process **communicates** with the Main process via IPC to perform GUI operations in a web page. Calling native GUI-related APIs from the Renderer process directly is restricted due to security concerns and potential resource leakage.
-
-----
-
-The communication between processes is possible via Inter-Process Communication (IPC) modules: [`ipcMain`](../api/ipc-main.md) and [`ipcRenderer`](../api/ipc-renderer.md).
-
-#### APIs
-
-##### Electron API
-
-Electron APIs are assigned based on the process type, meaning that some modules can be used from either the Main or Renderer process, and some from both. Electron's API documentation indicates which process each module can be used from.
-
-For example, to access the Electron API in both processes, require its included module:
-
-```js
-const electron = require('electron')
-```
-
-To create a window, call the `BrowserWindow` class, which is only available in the Main process:
-
-```js
-const { BrowserWindow } = require('electron')
-const win = new BrowserWindow()
-```
-
-To call the Main process from the Renderer, use the IPC module:
-
-```js
-// In the Main process
-const { ipcMain } = require('electron')
-
-ipcMain.handle('perform-action', (event, ...args) => {
-  // ... do actions on behalf of the Renderer
-})
-```
-
-```js
-// In the Renderer process
-const { ipcRenderer } = require('electron')
-
-ipcRenderer.invoke('perform-action', ...args)
-```
-
-> NOTE: Because Renderer processes may run untrusted code (especially from third parties), it is important to carefully validate the requests that come to the Main process.
-
-##### Node.js API
-
-> NOTE: To access the Node.js API from the Renderer process, you need to set the `nodeIntegration` preference to `true` and the `contextIsolation` preference to `false`.  Please note that access to the Node.js API in any renderer that loads remote content is not recommended for [security reasons](../tutorial/security.md#2-do-not-enable-nodejs-integration-for-remote-content).
-
-Electron exposes full access to Node.js API and its modules both in the Main and the Renderer processes. For example, you can read all the files from the root directory:
-
-```js
-const fs = require('fs')
-
-const root = fs.readdirSync('/')
-
-console.log(root)
-```
-
-To use a Node.js module, you first need to install it as a dependency:
-
-```sh
-npm install --save aws-sdk
-```
-
-Then, in your Electron application, require the module:
-
-```js
-const S3 = require('aws-sdk/clients/s3')
-```

docs/tutorial/recent-documents.md

@@ -13,39 +13,62 @@ __Application dock menu:__
 
 ![macOS Dock Menu][dock-menu-image]
 
-To add a file to recent documents, you need to use the
-[app.addRecentDocument][addrecentdocument] API.
-
 ## Example
 
-### Add an item to recent documents
-
-Starting with a working application from the
-[Quick Start Guide](quick-start.md), add the following lines to the
-`main.js` file:
+### Managing recent documents
 
 ```javascript fiddle='docs/fiddles/features/recent-documents'
-const { app } = require('electron')
+const { app, BrowserWindow } = require('electron')
+const fs = require('fs')
+const path = require('path')
 
-app.addRecentDocument('/Users/USERNAME/Desktop/work.type')
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600
+  })
+
+  win.loadFile('index.html')
+}
+
+const fileName = 'recently-used.md'
+fs.writeFile(fileName, 'Lorem Ipsum', () => {
+  app.addRecentDocument(path.join(__dirname, fileName))
+})
+
+app.whenReady().then(createWindow)
+
+app.on('window-all-closed', () => {
+  app.clearRecentDocuments()
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow()
+  }
+})
 ```
 
+#### Adding a recent document
+
+To add a file to recent documents, use the
+[app.addRecentDocument][addrecentdocument] API.
+
 After launching the Electron application, right click the application icon.
-You should see the item you just added. In this guide, the item is a Markdown
-file located in the root of the project:
+In this guide, the item is a Markdown file located in the root of the project.
+You should see `recently-used.md` added to the list of recent files:
 
 ![Recent document](../images/recent-documents.png)
 
-### Clear the list of recent documents
+#### Clearing the list of recent documents
 
-To clear the list of recent documents, you need to use
-[app.clearRecentDocuments][clearrecentdocuments] API in the `main.js` file:
-
-```javascript
-const { app } = require('electron')
-
-app.clearRecentDocuments()
-```
+To clear the list of recent documents, use the
+[app.clearRecentDocuments][clearrecentdocuments] API.
+In this guide, the list of documents is cleared once all windows have been
+closed.
 
 ## Additional information
 

docs/tutorial/represented-file.md

@@ -20,23 +20,40 @@ To set the represented file of window, you can use the
 
 ## Example
 
-Starting with a working application from the
-[Quick Start Guide](quick-start.md), add the following lines to the
-`main.js` file:
-
 ```javascript fiddle='docs/fiddles/features/represented-file'
 const { app, BrowserWindow } = require('electron')
+const os = require('os');
+
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600
+  })
+}
 
 app.whenReady().then(() => {
   const win = new BrowserWindow()
 
-  win.setRepresentedFilename('/etc/passwd')
+  win.setRepresentedFilename(os.homedir())
   win.setDocumentEdited(true)
 })
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow()
+  }
+})
 ```
 
 After launching the Electron application, click on the title with `Command` or
-`Control` key pressed. You should see a popup with the file you just defined:
+`Control` key pressed. You should see a popup with the represented file at the top.
+In this guide, this is the current user's home directory:
 
 ![Represented file](../images/represented-file.png)
 

docs/tutorial/support.md

@@ -16,7 +16,6 @@ you can interact with the community in these locations:
   * Sharing ideas with other Electron app developers
   * And more!
 * [`electron`](https://discuss.atom.io/c/electron) category on the Atom forums
-* `#atom-shell` channel on Freenode
 * `#electron` channel on [Atom's Slack](https://discuss.atom.io/t/join-us-on-slack/16638?source_topic_id=25406)
 * [`electron-ru`](https://telegram.me/electron_ru) *(Russian)*
 * [`electron-br`](https://electron-br.slack.com) *(Brazilian Portuguese)*
@@ -64,9 +63,9 @@ until the maintainers feel the maintenance burden is too high to continue doing
 
 ### Currently supported versions
 
+* 13.x.y
 * 12.x.y
 * 11.x.y
-* 10.x.y
 
 ### End-of-life
 

filenames.libcxx.gni

@@ -0,0 +1,194 @@
+libcxx_headers = [
+  "//buildtools/third_party/libc++/trunk/include/CMakeLists.txt",
+  "//buildtools/third_party/libc++/trunk/include/__availability",
+  "//buildtools/third_party/libc++/trunk/include/__bit_reference",
+  "//buildtools/third_party/libc++/trunk/include/__bits",
+  "//buildtools/third_party/libc++/trunk/include/__bsd_locale_defaults.h",
+  "//buildtools/third_party/libc++/trunk/include/__bsd_locale_fallbacks.h",
+  "//buildtools/third_party/libc++/trunk/include/__config",
+  "//buildtools/third_party/libc++/trunk/include/__config_site.in",
+  "//buildtools/third_party/libc++/trunk/include/__debug",
+  "//buildtools/third_party/libc++/trunk/include/__errc",
+  "//buildtools/third_party/libc++/trunk/include/__functional_03",
+  "//buildtools/third_party/libc++/trunk/include/__functional_base",
+  "//buildtools/third_party/libc++/trunk/include/__functional_base_03",
+  "//buildtools/third_party/libc++/trunk/include/__hash_table",
+  "//buildtools/third_party/libc++/trunk/include/__libcpp_version",
+  "//buildtools/third_party/libc++/trunk/include/__locale",
+  "//buildtools/third_party/libc++/trunk/include/__memory/allocator_traits.h",
+  "//buildtools/third_party/libc++/trunk/include/__memory/base.h",
+  "//buildtools/third_party/libc++/trunk/include/__memory/pointer_traits.h",
+  "//buildtools/third_party/libc++/trunk/include/__memory/utilities.h",
+  "//buildtools/third_party/libc++/trunk/include/__mutex_base",
+  "//buildtools/third_party/libc++/trunk/include/__node_handle",
+  "//buildtools/third_party/libc++/trunk/include/__nullptr",
+  "//buildtools/third_party/libc++/trunk/include/__split_buffer",
+  "//buildtools/third_party/libc++/trunk/include/__sso_allocator",
+  "//buildtools/third_party/libc++/trunk/include/__std_stream",
+  "//buildtools/third_party/libc++/trunk/include/__string",
+  "//buildtools/third_party/libc++/trunk/include/__support/android/locale_bionic.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/fuchsia/xlocale.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/ibm/limits.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/ibm/locale_mgmt_aix.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/ibm/nanosleep.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/ibm/support.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/ibm/xlocale.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/musl/xlocale.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/newlib/xlocale.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/nuttx/xlocale.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/openbsd/xlocale.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/solaris/floatingpoint.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/solaris/wchar.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/solaris/xlocale.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/win32/limits_msvc_win32.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/win32/locale_win32.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/xlocale/__nop_locale_mgmt.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/xlocale/__posix_l_fallback.h",
+  "//buildtools/third_party/libc++/trunk/include/__support/xlocale/__strtonum_fallback.h",
+  "//buildtools/third_party/libc++/trunk/include/__threading_support",
+  "//buildtools/third_party/libc++/trunk/include/__tree",
+  "//buildtools/third_party/libc++/trunk/include/__tuple",
+  "//buildtools/third_party/libc++/trunk/include/__undef_macros",
+  "//buildtools/third_party/libc++/trunk/include/algorithm",
+  "//buildtools/third_party/libc++/trunk/include/any",
+  "//buildtools/third_party/libc++/trunk/include/array",
+  "//buildtools/third_party/libc++/trunk/include/atomic",
+  "//buildtools/third_party/libc++/trunk/include/barrier",
+  "//buildtools/third_party/libc++/trunk/include/bit",
+  "//buildtools/third_party/libc++/trunk/include/bitset",
+  "//buildtools/third_party/libc++/trunk/include/cassert",
+  "//buildtools/third_party/libc++/trunk/include/ccomplex",
+  "//buildtools/third_party/libc++/trunk/include/cctype",
+  "//buildtools/third_party/libc++/trunk/include/cerrno",
+  "//buildtools/third_party/libc++/trunk/include/cfenv",
+  "//buildtools/third_party/libc++/trunk/include/cfloat",
+  "//buildtools/third_party/libc++/trunk/include/charconv",
+  "//buildtools/third_party/libc++/trunk/include/chrono",
+  "//buildtools/third_party/libc++/trunk/include/cinttypes",
+  "//buildtools/third_party/libc++/trunk/include/ciso646",
+  "//buildtools/third_party/libc++/trunk/include/climits",
+  "//buildtools/third_party/libc++/trunk/include/clocale",
+  "//buildtools/third_party/libc++/trunk/include/cmath",
+  "//buildtools/third_party/libc++/trunk/include/codecvt",
+  "//buildtools/third_party/libc++/trunk/include/compare",
+  "//buildtools/third_party/libc++/trunk/include/complex",
+  "//buildtools/third_party/libc++/trunk/include/complex.h",
+  "//buildtools/third_party/libc++/trunk/include/concepts",
+  "//buildtools/third_party/libc++/trunk/include/condition_variable",
+  "//buildtools/third_party/libc++/trunk/include/csetjmp",
+  "//buildtools/third_party/libc++/trunk/include/csignal",
+  "//buildtools/third_party/libc++/trunk/include/cstdarg",
+  "//buildtools/third_party/libc++/trunk/include/cstdbool",
+  "//buildtools/third_party/libc++/trunk/include/cstddef",
+  "//buildtools/third_party/libc++/trunk/include/cstdint",
+  "//buildtools/third_party/libc++/trunk/include/cstdio",
+  "//buildtools/third_party/libc++/trunk/include/cstdlib",
+  "//buildtools/third_party/libc++/trunk/include/cstring",
+  "//buildtools/third_party/libc++/trunk/include/ctgmath",
+  "//buildtools/third_party/libc++/trunk/include/ctime",
+  "//buildtools/third_party/libc++/trunk/include/ctype.h",
+  "//buildtools/third_party/libc++/trunk/include/cwchar",
+  "//buildtools/third_party/libc++/trunk/include/cwctype",
+  "//buildtools/third_party/libc++/trunk/include/deque",
+  "//buildtools/third_party/libc++/trunk/include/errno.h",
+  "//buildtools/third_party/libc++/trunk/include/exception",
+  "//buildtools/third_party/libc++/trunk/include/execution",
+  "//buildtools/third_party/libc++/trunk/include/experimental/__config",
+  "//buildtools/third_party/libc++/trunk/include/experimental/__memory",
+  "//buildtools/third_party/libc++/trunk/include/experimental/algorithm",
+  "//buildtools/third_party/libc++/trunk/include/experimental/coroutine",
+  "//buildtools/third_party/libc++/trunk/include/experimental/deque",
+  "//buildtools/third_party/libc++/trunk/include/experimental/filesystem",
+  "//buildtools/third_party/libc++/trunk/include/experimental/forward_list",
+  "//buildtools/third_party/libc++/trunk/include/experimental/functional",
+  "//buildtools/third_party/libc++/trunk/include/experimental/iterator",
+  "//buildtools/third_party/libc++/trunk/include/experimental/list",
+  "//buildtools/third_party/libc++/trunk/include/experimental/map",
+  "//buildtools/third_party/libc++/trunk/include/experimental/memory_resource",
+  "//buildtools/third_party/libc++/trunk/include/experimental/propagate_const",
+  "//buildtools/third_party/libc++/trunk/include/experimental/regex",
+  "//buildtools/third_party/libc++/trunk/include/experimental/set",
+  "//buildtools/third_party/libc++/trunk/include/experimental/simd",
+  "//buildtools/third_party/libc++/trunk/include/experimental/string",
+  "//buildtools/third_party/libc++/trunk/include/experimental/type_traits",
+  "//buildtools/third_party/libc++/trunk/include/experimental/unordered_map",
+  "//buildtools/third_party/libc++/trunk/include/experimental/unordered_set",
+  "//buildtools/third_party/libc++/trunk/include/experimental/utility",
+  "//buildtools/third_party/libc++/trunk/include/experimental/vector",
+  "//buildtools/third_party/libc++/trunk/include/ext/__hash",
+  "//buildtools/third_party/libc++/trunk/include/ext/hash_map",
+  "//buildtools/third_party/libc++/trunk/include/ext/hash_set",
+  "//buildtools/third_party/libc++/trunk/include/fenv.h",
+  "//buildtools/third_party/libc++/trunk/include/filesystem",
+  "//buildtools/third_party/libc++/trunk/include/float.h",
+  "//buildtools/third_party/libc++/trunk/include/format",
+  "//buildtools/third_party/libc++/trunk/include/forward_list",
+  "//buildtools/third_party/libc++/trunk/include/fstream",
+  "//buildtools/third_party/libc++/trunk/include/functional",
+  "//buildtools/third_party/libc++/trunk/include/future",
+  "//buildtools/third_party/libc++/trunk/include/initializer_list",
+  "//buildtools/third_party/libc++/trunk/include/inttypes.h",
+  "//buildtools/third_party/libc++/trunk/include/iomanip",
+  "//buildtools/third_party/libc++/trunk/include/ios",
+  "//buildtools/third_party/libc++/trunk/include/iosfwd",
+  "//buildtools/third_party/libc++/trunk/include/iostream",
+  "//buildtools/third_party/libc++/trunk/include/istream",
+  "//buildtools/third_party/libc++/trunk/include/iterator",
+  "//buildtools/third_party/libc++/trunk/include/latch",
+  "//buildtools/third_party/libc++/trunk/include/limits",
+  "//buildtools/third_party/libc++/trunk/include/limits.h",
+  "//buildtools/third_party/libc++/trunk/include/list",
+  "//buildtools/third_party/libc++/trunk/include/locale",
+  "//buildtools/third_party/libc++/trunk/include/locale.h",
+  "//buildtools/third_party/libc++/trunk/include/map",
+  "//buildtools/third_party/libc++/trunk/include/math.h",
+  "//buildtools/third_party/libc++/trunk/include/memory",
+  "//buildtools/third_party/libc++/trunk/include/module.modulemap",
+  "//buildtools/third_party/libc++/trunk/include/mutex",
+  "//buildtools/third_party/libc++/trunk/include/new",
+  "//buildtools/third_party/libc++/trunk/include/numbers",
+  "//buildtools/third_party/libc++/trunk/include/numeric",
+  "//buildtools/third_party/libc++/trunk/include/optional",
+  "//buildtools/third_party/libc++/trunk/include/ostream",
+  "//buildtools/third_party/libc++/trunk/include/queue",
+  "//buildtools/third_party/libc++/trunk/include/random",
+  "//buildtools/third_party/libc++/trunk/include/ratio",
+  "//buildtools/third_party/libc++/trunk/include/regex",
+  "//buildtools/third_party/libc++/trunk/include/scoped_allocator",
+  "//buildtools/third_party/libc++/trunk/include/semaphore",
+  "//buildtools/third_party/libc++/trunk/include/set",
+  "//buildtools/third_party/libc++/trunk/include/setjmp.h",
+  "//buildtools/third_party/libc++/trunk/include/shared_mutex",
+  "//buildtools/third_party/libc++/trunk/include/span",
+  "//buildtools/third_party/libc++/trunk/include/sstream",
+  "//buildtools/third_party/libc++/trunk/include/stack",
+  "//buildtools/third_party/libc++/trunk/include/stdbool.h",
+  "//buildtools/third_party/libc++/trunk/include/stddef.h",
+  "//buildtools/third_party/libc++/trunk/include/stdexcept",
+  "//buildtools/third_party/libc++/trunk/include/stdint.h",
+  "//buildtools/third_party/libc++/trunk/include/stdio.h",
+  "//buildtools/third_party/libc++/trunk/include/stdlib.h",
+  "//buildtools/third_party/libc++/trunk/include/streambuf",
+  "//buildtools/third_party/libc++/trunk/include/string",
+  "//buildtools/third_party/libc++/trunk/include/string.h",
+  "//buildtools/third_party/libc++/trunk/include/string_view",
+  "//buildtools/third_party/libc++/trunk/include/strstream",
+  "//buildtools/third_party/libc++/trunk/include/system_error",
+  "//buildtools/third_party/libc++/trunk/include/tgmath.h",
+  "//buildtools/third_party/libc++/trunk/include/thread",
+  "//buildtools/third_party/libc++/trunk/include/tuple",
+  "//buildtools/third_party/libc++/trunk/include/type_traits",
+  "//buildtools/third_party/libc++/trunk/include/typeindex",
+  "//buildtools/third_party/libc++/trunk/include/typeinfo",
+  "//buildtools/third_party/libc++/trunk/include/unordered_map",
+  "//buildtools/third_party/libc++/trunk/include/unordered_set",
+  "//buildtools/third_party/libc++/trunk/include/utility",
+  "//buildtools/third_party/libc++/trunk/include/valarray",
+  "//buildtools/third_party/libc++/trunk/include/variant",
+  "//buildtools/third_party/libc++/trunk/include/vector",
+  "//buildtools/third_party/libc++/trunk/include/version",
+  "//buildtools/third_party/libc++/trunk/include/wchar.h",
+  "//buildtools/third_party/libc++/trunk/include/wctype.h",
+]
+
+libcxx_licenses = [ "//buildtools/third_party/libc++/trunk/LICENSE.TXT" ]

filenames.libcxxabi.gni

@@ -0,0 +1,6 @@
+libcxxabi_headers = [
+  "//buildtools/third_party/libc++abi/trunk/include/__cxxabi_config.h",
+  "//buildtools/third_party/libc++abi/trunk/include/cxxabi.h",
+]
+
+libcxxabi_licenses = [ "//buildtools/third_party/libc++abi/trunk/LICENSE.TXT" ]

lib/asar/fs-wrapper.ts

@@ -490,63 +490,83 @@ export const wrapFsWithAsar = (fs: Record<string, any>) => {
     }
   };
 
+  function fsReadFileAsar (pathArgument: string, options: any, callback: any) {
+    const pathInfo = splitPath(pathArgument);
+    if (pathInfo.isAsar) {
+      const { asarPath, filePath } = pathInfo;
+
+      if (typeof options === 'function') {
+        callback = options;
+        options = { encoding: null };
+      } else if (typeof options === 'string') {
+        options = { encoding: options };
+      } else if (options === null || options === undefined) {
+        options = { encoding: null };
+      } else if (typeof options !== 'object') {
+        throw new TypeError('Bad arguments');
+      }
+
+      const { encoding } = options;
+      const archive = getOrCreateArchive(asarPath);
+      if (!archive) {
+        const error = createError(AsarError.INVALID_ARCHIVE, { asarPath });
+        nextTick(callback, [error]);
+        return;
+      }
+
+      const info = archive.getFileInfo(filePath);
+      if (!info) {
+        const error = createError(AsarError.NOT_FOUND, { asarPath, filePath });
+        nextTick(callback, [error]);
+        return;
+      }
+
+      if (info.size === 0) {
+        nextTick(callback, [null, encoding ? '' : Buffer.alloc(0)]);
+        return;
+      }
+
+      if (info.unpacked) {
+        const realPath = archive.copyFileOut(filePath);
+        return fs.readFile(realPath, options, callback);
+      }
+
+      const buffer = Buffer.alloc(info.size);
+      const fd = archive.getFd();
+      if (!(fd >= 0)) {
+        const error = createError(AsarError.NOT_FOUND, { asarPath, filePath });
+        nextTick(callback, [error]);
+        return;
+      }
+
+      logASARAccess(asarPath, filePath, info.offset);
+      fs.read(fd, buffer, 0, info.size, info.offset, (error: Error) => {
+        callback(error, encoding ? buffer.toString(encoding) : buffer);
+      });
+    }
+  }
+
   const { readFile } = fs;
   fs.readFile = function (pathArgument: string, options: any, callback: any) {
     const pathInfo = splitPath(pathArgument);
-    if (!pathInfo.isAsar) return readFile.apply(this, arguments);
-    const { asarPath, filePath } = pathInfo;
-
-    if (typeof options === 'function') {
-      callback = options;
-      options = { encoding: null };
-    } else if (typeof options === 'string') {
-      options = { encoding: options };
-    } else if (options === null || options === undefined) {
-      options = { encoding: null };
-    } else if (typeof options !== 'object') {
-      throw new TypeError('Bad arguments');
+    if (!pathInfo.isAsar) {
+      return readFile.apply(this, arguments);
     }
 
-    const { encoding } = options;
-    const archive = getOrCreateArchive(asarPath);
-    if (!archive) {
-      const error = createError(AsarError.INVALID_ARCHIVE, { asarPath });
-      nextTick(callback, [error]);
-      return;
-    }
-
-    const info = archive.getFileInfo(filePath);
-    if (!info) {
-      const error = createError(AsarError.NOT_FOUND, { asarPath, filePath });
-      nextTick(callback, [error]);
-      return;
-    }
-
-    if (info.size === 0) {
-      nextTick(callback, [null, encoding ? '' : Buffer.alloc(0)]);
-      return;
-    }
-
-    if (info.unpacked) {
-      const realPath = archive.copyFileOut(filePath);
-      return fs.readFile(realPath, options, callback);
-    }
-
-    const buffer = Buffer.alloc(info.size);
-    const fd = archive.getFd();
-    if (!(fd >= 0)) {
-      const error = createError(AsarError.NOT_FOUND, { asarPath, filePath });
-      nextTick(callback, [error]);
-      return;
-    }
-
-    logASARAccess(asarPath, filePath, info.offset);
-    fs.read(fd, buffer, 0, info.size, info.offset, (error: Error) => {
-      callback(error, encoding ? buffer.toString(encoding) : buffer);
-    });
+    return fsReadFileAsar(pathArgument, options, callback);
   };
 
-  fs.promises.readFile = util.promisify(fs.readFile);
+  const { readFile: readFilePromise } = fs.promises;
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  fs.promises.readFile = function (pathArgument: string, options: any) {
+    const pathInfo = splitPath(pathArgument);
+    if (!pathInfo.isAsar) {
+      return readFilePromise.apply(this, arguments);
+    }
+
+    const p = util.promisify(fsReadFileAsar);
+    return p(pathArgument, options);
+  };
 
   const { readFileSync } = fs;
   fs.readFileSync = function (pathArgument: string, options: any) {

lib/browser/api/browser-window.ts

@@ -20,20 +20,6 @@ BrowserWindow.prototype._init = function (this: BWT) {
     nativeSetBounds.call(this, bounds, ...opts);
   };
 
-  // Sometimes the webContents doesn't get focus when window is shown, so we
-  // have to force focusing on webContents in this case. The safest way is to
-  // focus it when we first start to load URL, if we do it earlier it won't
-  // have effect, if we do it later we might move focus in the page.
-  //
-  // Though this hack is only needed on macOS when the app is launched from
-  // Finder, we still do it on all platforms in case of other bugs we don't
-  // know.
-  if (this.webContents._initiallyShown) {
-    this.webContents.once('load-url' as any, function (this: WebContents) {
-      this.focus();
-    });
-  }
-
   // Redirect focus/blur event to app instance too.
   this.on('blur', (event: Event) => {
     app.emit('browser-window-blur', event, this);

lib/browser/devtools.ts

@@ -54,7 +54,7 @@ const isChromeDevTools = function (pageURL: string) {
 };
 
 const assertChromeDevTools = function (contents: Electron.WebContents, api: string) {
-  const pageURL = contents._getURL();
+  const pageURL = contents.getURL();
   if (!isChromeDevTools(pageURL)) {
     console.error(`Blocked ${pageURL} from calling ${api}`);
     throw new Error(`Blocked ${api}`);

lib/renderer/init.ts

@@ -45,10 +45,6 @@ require('@electron/internal/common/init');
 // The global variable will be used by ipc for event dispatching
 const v8Util = process._linkedBinding('electron_common_v8_util');
 
-// Expose process.contextId
-const contextId = v8Util.getHiddenValue<string>(global, 'contextId');
-Object.defineProperty(process, 'contextId', { enumerable: true, value: contextId });
-
 const { ipcRendererInternal } = require('@electron/internal/renderer/ipc-renderer-internal') as typeof ipcRendererInternalModule;
 const ipcRenderer = require('@electron/internal/renderer/api/ipc-renderer').default;
 

lib/sandboxed_renderer/init.ts

@@ -96,10 +96,6 @@ Object.defineProperty(preloadProcess, 'noDeprecation', {
   }
 });
 
-// Expose process.contextId
-const contextId = v8Util.getHiddenValue<string>(global, 'contextId');
-Object.defineProperty(preloadProcess, 'contextId', { enumerable: true, value: contextId });
-
 process.on('loaded', () => (preloadProcess as events.EventEmitter).emit('loaded'));
 process.on('exit', () => (preloadProcess as events.EventEmitter).emit('exit'));
 (process as events.EventEmitter).on('document-start', () => (preloadProcess as events.EventEmitter).emit('document-start'));

package.json

@@ -1,6 +1,6 @@
 {
   "name": "electron",
-  "version": "14.0.0-nightly.20210518",
+  "version": "14.0.0-beta.7",
   "repository": "https://github.com/electron/electron",
   "description": "Build cross platform desktop apps with JavaScript, HTML, and CSS",
   "devDependencies": {

patches/chromium/.patches

@@ -3,13 +3,11 @@ dcheck.patch
 accelerator.patch
 blink_file_path.patch
 blink_local_frame.patch
-blink_world_context.patch
 can_create_window.patch
 disable_hidden.patch
 dom_storage_limits.patch
 render_widget_host_view_base.patch
 render_widget_host_view_mac.patch
-thread_capabilities.patch
 webview_cross_drag.patch
 gin_enable_disable_v8_platform.patch
 disable-redraw-lock.patch
@@ -17,23 +15,24 @@ enable_reset_aspect_ratio.patch
 v8_context_snapshot_generator.patch
 boringssl_build_gn.patch
 pepper_plugin_support.patch
-no_cache_storage_check.patch
-blink_fix_prototype_assert.patch
 gtk_visibility.patch
 sysroot.patch
-mas_blink_no_private_api.patch
-mas_no_private_api.patch
 resource_file_conflict.patch
 scroll_bounce_flag.patch
+mas_blink_no_private_api.patch
+mas_no_private_api.patch
 mas-cfisobjc.patch
 mas-cgdisplayusesforcetogray.patch
 mas-audiodeviceduck.patch
 mas_disable_remote_layer.patch
 mas_disable_remote_accessibility.patch
 mas_disable_custom_window_frame.patch
+mas_avoid_usage_of_abort_report_np.patch
+mas_avoid_usage_of_pthread_fchdir_np.patch
+mas_avoid_usage_of_setapplicationisdaemon_and.patch
+mas_use_public_apis_to_determine_if_a_font_is_a_system_font.patch
 chrome_key_systems.patch
 add_didinstallconditionalfeatures.patch
-ssl_security_state_tab_helper.patch
 desktop_media_list.patch
 proxy_config_monitor.patch
 gritsettings_resource_ids.patch
@@ -43,15 +42,11 @@ dump_syms.patch
 command-ismediakey.patch
 printing.patch
 support_mixed_sandbox_with_zygote.patch
-fix_disable_usage_of_abort_report_np_in_mas_builds.patch
-fix_disable_usage_of_pthread_fchdir_np_and_pthread_chdir_np_in_mas.patch
-fix_disable_usage_of_setapplicationisdaemon_and.patch
 unsandboxed_ppapi_processes_skip_zygote.patch
 build_add_electron_tracing_category.patch
 worker_context_will_destroy.patch
 frame_host_manager.patch
 crashpad_pid_check.patch
-preconnect_feature.patch
 network_service_allow_remote_certificate_verification_logic.patch
 put_back_deleted_colors_for_autofill.patch
 disable_color_correct_rendering.patch
@@ -66,8 +61,7 @@ revert_remove_contentrendererclient_shouldfork.patch
 ignore_rc_check.patch
 remove_usage_of_incognito_apis_in_the_spellchecker.patch
 chore_use_electron_resources_not_chrome_for_spellchecker.patch
-feat_allow_disabling_blink_scheduler_throttling_per_renderview.patch
-accessible_pane_view.patch
+allow_disabling_blink_scheduler_throttling_per_renderview.patch
 hack_plugin_response_interceptor_to_point_to_electron.patch
 feat_add_support_for_overriding_the_base_spellchecker_download_url.patch
 feat_enable_offscreen_rendering_with_viz_compositor.patch
@@ -86,7 +80,6 @@ crash_allow_disabling_compression_on_linux.patch
 allow_setting_secondary_label_via_simplemenumodel.patch
 feat_add_streaming-protocol_registry_to_multibuffer_data_source.patch
 fix_patch_out_profile_refs_in_accessibility_ui.patch
-fix_check_issecureeventinputenabled_in_constructor_before_setting.patch
 skip_atk_toolchain_check.patch
 worker_feat_add_hook_to_notify_script_ready.patch
 chore_provide_iswebcontentscreationoverridden_with_full_params.patch
@@ -94,7 +87,6 @@ fix_properly_honor_printing_page_ranges.patch
 fix_use_electron_generated_resources.patch
 chore_expose_v8_initialization_isolate_callbacks.patch
 export_gin_v8platform_pageallocator_for_usage_outside_of_the_gin.patch
-use_public_apis_to_determine_if_a_font_is_a_system_font_in_mas_build.patch
 fix_export_zlib_symbols.patch
 don_t_use_potentially_null_getwebframe_-_view_when_get_blink.patch
 web_contents.patch
@@ -103,5 +95,7 @@ fix_add_check_for_sandbox_then_result.patch
 extend_apply_webpreferences.patch
 fix_expose_decrementcapturercount_in_web_contents_impl.patch
 add_setter_for_browsermainloop_result_code.patch
-chore_allow_overriding_of_enable_pak_file_integrity_checks.patch
 make_include_of_stack_trace_h_unconditional.patch
+build_libc_as_static_library.patch
+build_do_not_depend_on_packed_resource_integrity.patch
+build_read_idl_files_as_utf8_to_fix_python3_character_encodding.patch

patches/chromium/accelerator.patch

@@ -1,16 +1,16 @@
 From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
 From: Cheng Zhao <zcbenz@gmail.com>
 Date: Thu, 4 Oct 2018 14:57:02 -0700
-Subject: accelerator.patch
+Subject: fix: improve shortcut text of Accelerator
 
 This patch makes three changes to Accelerator::GetShortcutText to improve shortcut display text in menus:
 
 1. Ctrl-Alt-<Key> accelerators show as Ctrl-Alt-<Key> instead of as Ctrl-<Key>
 2. F2-F24 accelerators show up as such
-3. Ctrl-Shift-= should show as Ctrl-+
+3. Ctrl-Shift-= and Ctrl-Plus show up as such
 
 diff --git a/ui/base/accelerators/accelerator.cc b/ui/base/accelerators/accelerator.cc
-index d6913b15149f773cad28b5e2278b0f80df3d2896..15f944c4bb2fde7241b643f6a979a81ebce844b1 100644
+index d6913b15149f773cad28b5e2278b0f80df3d2896..25342f62acdc28806a0e6ae0bd129c59083ccf06 100644
 --- a/ui/base/accelerators/accelerator.cc
 +++ b/ui/base/accelerators/accelerator.cc
 @@ -11,6 +11,7 @@
@@ -21,61 +21,39 @@ index d6913b15149f773cad28b5e2278b0f80df3d2896..15f944c4bb2fde7241b643f6a979a81e
  #include "base/strings/utf_string_conversions.h"
  #include "build/build_config.h"
  #include "build/chromeos_buildflags.h"
-@@ -27,9 +28,7 @@
- #include <windows.h>
+@@ -234,6 +235,11 @@ std::u16string Accelerator::GetShortcutText() const {
  #endif
  
--#if !defined(OS_WIN) && (defined(USE_AURA) || defined(OS_MAC))
- #include "ui/events/keycodes/keyboard_code_conversion.h"
--#endif
- 
- #if defined(OS_CHROMEOS)
- #include "ui/base/ui_base_features.h"
-@@ -233,7 +232,15 @@ std::u16string Accelerator::GetShortcutText() const {
-   shortcut = KeyCodeToName();
- #endif
- 
-+  unsigned int flags = 0;
    if (shortcut.empty()) {
-+    const uint16_t c = DomCodeToUsLayoutCharacter(
-+        UsLayoutKeyboardCodeToDomCode(key_code_), flags);
-+    if (c != 0) {
-+      shortcut =
-+          static_cast<std::u16string::value_type>(
-+              base::ToUpperASCII(static_cast<char16_t>(c)));
-+    }
++    // When a shifted char is explicitly specified, for example Ctrl+Plus,
++    // use the shifted char directly.
++    if (shifted_char) {
++      shortcut += *shifted_char;
++    } else {
  #if defined(OS_WIN)
      // Our fallback is to try translate the key code to a regular character
      // unless it is one of digits (VK_0 to VK_9). Some keyboard
-@@ -242,21 +249,14 @@ std::u16string Accelerator::GetShortcutText() const {
-     // accent' for '0'). For display in the menu (e.g. Ctrl-0 for the
-     // default zoom level), we leave VK_[0-9] alone without translation.
-     wchar_t key;
--    if (base::IsAsciiDigit(key_code_))
-+    if (base::IsAsciiDigit(key_code_)) {
-       key = static_cast<wchar_t>(key_code_);
--    else
--      key = LOWORD(::MapVirtualKeyW(key_code_, MAPVK_VK_TO_CHAR));
--    // If there is no translation for the given |key_code_| (e.g.
--    // VKEY_UNKNOWN), |::MapVirtualKeyW| returns 0.
--    if (key != 0)
--      shortcut += key;
--#elif defined(USE_AURA) || defined(OS_MAC) || defined(OS_ANDROID)
--    const uint16_t c = DomCodeToUsLayoutCharacter(
--        UsLayoutKeyboardCodeToDomCode(key_code_), false);
--    if (c != 0)
--      shortcut +=
--          static_cast<std::u16string::value_type>(base::ToUpperASCII(c));
-+      shortcut = key;
-+    }
+@@ -257,6 +263,10 @@ std::u16string Accelerator::GetShortcutText() const {
+       shortcut +=
+           static_cast<std::u16string::value_type>(base::ToUpperASCII(c));
  #endif
++    }
 +    if (key_code_ > VKEY_F1 && key_code_ <= VKEY_F24)
 +      shortcut = base::UTF8ToUTF16(
 +          base::StringPrintf("F%d", key_code_ - VKEY_F1 + 1));
    }
  
  #if defined(OS_MAC)
-@@ -452,7 +452,7 @@ std::u16string Accelerator::ApplyLongFormModifiers(
+@@ -444,7 +454,7 @@ std::u16string Accelerator::ApplyLongFormModifiers(
+     const std::u16string& shortcut) const {
+   std::u16string result = shortcut;
+ 
+-  if (IsShiftDown())
++  if (!shifted_char && IsShiftDown())
+     result = ApplyModifierToAcceleratorString(result, IDS_APP_SHIFT_KEY);
+ 
+   // Note that we use 'else-if' in order to avoid using Ctrl+Alt as a shortcut.
+@@ -452,7 +462,7 @@ std::u16string Accelerator::ApplyLongFormModifiers(
    // more information.
    if (IsCtrlDown())
      result = ApplyModifierToAcceleratorString(result, IDS_APP_CTRL_KEY);
@@ -84,3 +62,24 @@ index d6913b15149f773cad28b5e2278b0f80df3d2896..15f944c4bb2fde7241b643f6a979a81e
      result = ApplyModifierToAcceleratorString(result, IDS_APP_ALT_KEY);
  
    if (IsCmdDown()) {
+diff --git a/ui/base/accelerators/accelerator.h b/ui/base/accelerators/accelerator.h
+index 780a45f9ca2dd60e0deac27cc6e8f69e72cd8435..b1b46f18e9c600820fdd2d26631eac38da672811 100644
+--- a/ui/base/accelerators/accelerator.h
++++ b/ui/base/accelerators/accelerator.h
+@@ -16,6 +16,7 @@
+ #include <utility>
+ 
+ #include "base/component_export.h"
++#include "third_party/abseil-cpp/absl/types/optional.h"
+ #include "base/time/time.h"
+ #include "build/build_config.h"
+ #include "ui/events/event_constants.h"
+@@ -129,6 +130,8 @@ class COMPONENT_EXPORT(UI_BASE) Accelerator {
+     return interrupted_by_mouse_event_;
+   }
+ 
++  absl::optional<char16_t> shifted_char;
++
+  private:
+   std::u16string ApplyLongFormModifiers(const std::u16string& shortcut) const;
+   std::u16string ApplyShortFormModifiers(const std::u16string& shortcut) const;

patches/chromium/accessible_pane_view.patch

@@ -1,32 +0,0 @@
-From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
-From: Cheng Zhao <zcbenz@gmail.com>
-Date: Thu, 4 Oct 2018 14:57:02 -0700
-Subject: fix: add back virtual methods in AccessiblePaneView
-
-Mark SetPaneFocus and RemovePaneFocus as virtual in AccessiblePaneView, as we
-need to override them in MenuBar.
-
-Pending upstream patch: https://crrev.com/c/1959189
-
-diff --git a/ui/views/accessible_pane_view.h b/ui/views/accessible_pane_view.h
-index 813fd13860a863cd1e6e5bfec38d15f798418673..990c905e8f19dd015a625010ea30adfcb6f51ea6 100644
---- a/ui/views/accessible_pane_view.h
-+++ b/ui/views/accessible_pane_view.h
-@@ -35,7 +35,7 @@ class VIEWS_EXPORT AccessiblePaneView : public View,
-   // If |initial_focus| is not NULL, that control will get
-   // the initial focus, if it's enabled and focusable. Returns true if
-   // the pane was able to receive focus.
--  bool SetPaneFocus(View* initial_focus);
-+  virtual bool SetPaneFocus(View* initial_focus);
- 
-   bool pane_has_focus() const { return pane_has_focus_; }
- 
-@@ -83,7 +83,7 @@ class VIEWS_EXPORT AccessiblePaneView : public View,
-   bool ContainsForFocusSearch(View* root, const View* v);
- 
-   // Remove pane focus.
--  void RemovePaneFocus();
-+  virtual void RemovePaneFocus();
- 
-   View* GetFirstFocusableChild();
-   View* GetLastFocusableChild();

patches/chromium/add_contentgpuclient_precreatemessageloop_callback.patch

@@ -10,7 +10,7 @@ Allows Electron to restore WER when ELECTRON_DEFAULT_ERROR_MODE is set.
 This should be upstreamed.
 
 diff --git a/content/gpu/gpu_main.cc b/content/gpu/gpu_main.cc
-index 7d9019b87c8a016a1393c29d2ecf9966aa8f575c..160522d6bebfd47400733267ff3d60b37fff7f17 100644
+index d5bb3412094125492ecf9b5d2c34ce5df16a7c6f..cce3fb48264b0585fa4672d6249c11510e4e5d9d 100644
 --- a/content/gpu/gpu_main.cc
 +++ b/content/gpu/gpu_main.cc
 @@ -237,6 +237,10 @@ int GpuMain(const MainFunctionParams& parameters) {

patches/chromium/add_didinstallconditionalfeatures.patch

@@ -10,7 +10,7 @@ DidCreateScriptContext is called, not all JS APIs are available in the
 context, which can cause some preload scripts to trip.
 
 diff --git a/content/public/renderer/render_frame_observer.h b/content/public/renderer/render_frame_observer.h
-index fa860cddc22da75967796674e9b467f8c726a368..730c7ddd2838eb50f6f5f0676f0f16f7e1d09ad1 100644
+index 3d985164eee3d7d8ef9e7ff2215ec9a17ec157a5..9c1c4fd8528fbb088f1836c8503c5875727f5d62 100644
 --- a/content/public/renderer/render_frame_observer.h
 +++ b/content/public/renderer/render_frame_observer.h
 @@ -127,6 +127,8 @@ class CONTENT_EXPORT RenderFrameObserver : public IPC::Listener,
@@ -23,10 +23,10 @@ index fa860cddc22da75967796674e9b467f8c726a368..730c7ddd2838eb50f6f5f0676f0f16f7
                                          int32_t world_id) {}
    virtual void DidClearWindowObject() {}
 diff --git a/content/renderer/render_frame_impl.cc b/content/renderer/render_frame_impl.cc
-index 93c52c64173085b28e2391b59b089edb1f67777b..c2b9b96589183d1a4fae8593e7994a10baa5e29b 100644
+index d2a0ef47f32fd0eed6854d4d3c6c6c02a37c3e88..768301dae0e1c8ad0bc8e3f1762670fb636c36d4 100644
 --- a/content/renderer/render_frame_impl.cc
 +++ b/content/renderer/render_frame_impl.cc
-@@ -4130,6 +4130,12 @@ void RenderFrameImpl::DidCreateScriptContext(v8::Local<v8::Context> context,
+@@ -4263,6 +4263,12 @@ void RenderFrameImpl::DidCreateScriptContext(v8::Local<v8::Context> context,
      observer.DidCreateScriptContext(context, world_id);
  }
  
@@ -40,10 +40,10 @@ index 93c52c64173085b28e2391b59b089edb1f67777b..c2b9b96589183d1a4fae8593e7994a10
                                                 int world_id) {
    for (auto& observer : observers_)
 diff --git a/content/renderer/render_frame_impl.h b/content/renderer/render_frame_impl.h
-index 45dce82bb83995978092e78e1abb4a7d7a681a2a..308cc3f5b233efcade9eec86f5414e914c4ef9f7 100644
+index 53299308d20eaaf5e26b8a5dc34d1c66d7b0fdf8..fa63808238ede5bebc3589901e318acc882b766a 100644
 --- a/content/renderer/render_frame_impl.h
 +++ b/content/renderer/render_frame_impl.h
-@@ -575,6 +575,8 @@ class CONTENT_EXPORT RenderFrameImpl
+@@ -583,6 +583,8 @@ class CONTENT_EXPORT RenderFrameImpl
        blink::WebLocalFrameClient::LazyLoadBehavior lazy_load_behavior) override;
    void DidCreateScriptContext(v8::Local<v8::Context> context,
                                int world_id) override;
@@ -53,10 +53,10 @@ index 45dce82bb83995978092e78e1abb4a7d7a681a2a..308cc3f5b233efcade9eec86f5414e91
                                  int world_id) override;
    void DidChangeScrollOffset() override;
 diff --git a/third_party/blink/public/web/web_local_frame_client.h b/third_party/blink/public/web/web_local_frame_client.h
-index 1ee5bd6211dba9a59d349be233c8fb05c83e2d84..b734962ff402176c59babb70a31dced0ef52521c 100644
+index 493358dade0f6a1359f95bc3f8b3adc4303b8bcc..c0a53b380d5d3d2430e353d581dab6f183fa48b7 100644
 --- a/third_party/blink/public/web/web_local_frame_client.h
 +++ b/third_party/blink/public/web/web_local_frame_client.h
-@@ -566,6 +566,9 @@ class BLINK_EXPORT WebLocalFrameClient {
+@@ -583,6 +583,9 @@ class BLINK_EXPORT WebLocalFrameClient {
    virtual void DidCreateScriptContext(v8::Local<v8::Context>,
                                        int32_t world_id) {}
  
@@ -79,10 +79,10 @@ index 83b81f4c1fd4232ee5c2b7b1b7b85424164f3acc..bdd4a0031af6f9c2b701979dd469867c
    if (World().IsMainWorld()) {
      GetFrame()->Loader().DispatchDidClearWindowObjectInMainWorld();
 diff --git a/third_party/blink/renderer/core/frame/local_frame_client.h b/third_party/blink/renderer/core/frame/local_frame_client.h
-index 04bf36d07aa6417d01fb2c50ebb7da3e5832059a..c79a715ce209e04b2036d59224722a06a12c887a 100644
+index 0ca3b35db57056a86828e0aa80451abb4142eef3..0508e786747eef3d9b7061c42153d166e72d270e 100644
 --- a/third_party/blink/renderer/core/frame/local_frame_client.h
 +++ b/third_party/blink/renderer/core/frame/local_frame_client.h
-@@ -291,6 +291,8 @@ class CORE_EXPORT LocalFrameClient : public FrameClient {
+@@ -298,6 +298,8 @@ class CORE_EXPORT LocalFrameClient : public FrameClient {
  
    virtual void DidCreateScriptContext(v8::Local<v8::Context>,
                                        int32_t world_id) = 0;
@@ -92,7 +92,7 @@ index 04bf36d07aa6417d01fb2c50ebb7da3e5832059a..c79a715ce209e04b2036d59224722a06
                                          int32_t world_id) = 0;
    virtual bool AllowScriptExtensions() = 0;
 diff --git a/third_party/blink/renderer/core/frame/local_frame_client_impl.cc b/third_party/blink/renderer/core/frame/local_frame_client_impl.cc
-index da23faf79a419abe2501402b906b448924b64198..c8aabdf4d0c0c8e621473c585793259db5d2a707 100644
+index a3f1507a39bfea1f336a42e1f2575e3c1f684603..7aca23d4228680a1419c2e8ed8fa8a44a18c1d80 100644
 --- a/third_party/blink/renderer/core/frame/local_frame_client_impl.cc
 +++ b/third_party/blink/renderer/core/frame/local_frame_client_impl.cc
 @@ -272,6 +272,13 @@ void LocalFrameClientImpl::DidCreateScriptContext(
@@ -110,7 +110,7 @@ index da23faf79a419abe2501402b906b448924b64198..c8aabdf4d0c0c8e621473c585793259d
      v8::Local<v8::Context> context,
      int32_t world_id) {
 diff --git a/third_party/blink/renderer/core/frame/local_frame_client_impl.h b/third_party/blink/renderer/core/frame/local_frame_client_impl.h
-index 577a27be65807a23ac8a4f082999614122449281..1d39f184cec039486355f4e08854aa16e15e7cb5 100644
+index a853d0dd0ecfd676b6ada622f38a6546e526be92..d39a81547c3335d6b2ff3219ddcf5f3b2daa1c9c 100644
 --- a/third_party/blink/renderer/core/frame/local_frame_client_impl.h
 +++ b/third_party/blink/renderer/core/frame/local_frame_client_impl.h
 @@ -77,6 +77,8 @@ class CORE_EXPORT LocalFrameClientImpl final : public LocalFrameClient {
@@ -123,10 +123,10 @@ index 577a27be65807a23ac8a4f082999614122449281..1d39f184cec039486355f4e08854aa16
                                  int32_t world_id) override;
  
 diff --git a/third_party/blink/renderer/core/loader/empty_clients.h b/third_party/blink/renderer/core/loader/empty_clients.h
-index 4ff7af209929a8297b276ddfd2ebaa0b0200cf22..b60f9a5d78a486a7f5b69b98ff2e7d4ca07c98f1 100644
+index f4e37cb5be1a84b9610d2d33f126e040d5ff4822..8cc53215effecb53ee383c33469a27f1e267daf6 100644
 --- a/third_party/blink/renderer/core/loader/empty_clients.h
 +++ b/third_party/blink/renderer/core/loader/empty_clients.h
-@@ -350,6 +350,8 @@ class CORE_EXPORT EmptyLocalFrameClient : public LocalFrameClient {
+@@ -349,6 +349,8 @@ class CORE_EXPORT EmptyLocalFrameClient : public LocalFrameClient {
  
    void DidCreateScriptContext(v8::Local<v8::Context>,
                                int32_t world_id) override {}

patches/chromium/add_setter_for_browsermainloop_result_code.patch

@@ -10,10 +10,10 @@ valid use cases for setting custom exit codes of the main loop.  This
 exposes a simple setter that embedders can call.
 
 diff --git a/content/browser/browser_main_loop.h b/content/browser/browser_main_loop.h
-index 240fc57ad29fc684d802e4601b72cf3373d69c6b..7123c74af7f4077ecfa451539d49f8e232150317 100644
+index 090ca9c6e8785c6e9f1b9245771645ea19805795..fdf587055a71103c21f27fd79e5714baa24ea5c4 100644
 --- a/content/browser/browser_main_loop.h
 +++ b/content/browser/browser_main_loop.h
-@@ -166,6 +166,10 @@ class CONTENT_EXPORT BrowserMainLoop {
+@@ -161,6 +161,10 @@ class CONTENT_EXPORT BrowserMainLoop {
  
    int GetResultCode() const { return result_code_; }
  

patches/chromium/add_webmessageportconverter_entangleandinjectmessageportchannel.patch

@@ -8,7 +8,7 @@ accessing Blink internals. Its inverse, which already exists, is used in
 Android WebView.
 
 diff --git a/third_party/blink/public/web/web_message_port_converter.h b/third_party/blink/public/web/web_message_port_converter.h
-index ad603aa7c557bfd4f571a541d70e2edf9ae757d9..d4b0bf8f5e8f3af9328b0099b65d9963414dfcc1 100644
+index 70270faafcae01aba19d2be9ece3821c1c75dc29..809ec708c3faa9deb69ff17d499e645540358b88 100644
 --- a/third_party/blink/public/web/web_message_port_converter.h
 +++ b/third_party/blink/public/web/web_message_port_converter.h
 @@ -13,6 +13,7 @@ class Isolate;
@@ -21,7 +21,7 @@ index ad603aa7c557bfd4f571a541d70e2edf9ae757d9..d4b0bf8f5e8f3af9328b0099b65d9963
  namespace blink {
 @@ -25,6 +26,9 @@ class WebMessagePortConverter {
    // neutered, it will return nullopt.
-   BLINK_EXPORT static base::Optional<MessagePortChannel>
+   BLINK_EXPORT static absl::optional<MessagePortChannel>
    DisentangleAndExtractMessagePortChannel(v8::Isolate*, v8::Local<v8::Value>);
 +
 +  BLINK_EXPORT static v8::Local<v8::Value>
@@ -30,7 +30,7 @@ index ad603aa7c557bfd4f571a541d70e2edf9ae757d9..d4b0bf8f5e8f3af9328b0099b65d9963
  
  }  // namespace blink
 diff --git a/third_party/blink/renderer/core/exported/web_message_port_converter.cc b/third_party/blink/renderer/core/exported/web_message_port_converter.cc
-index 333760d667f6b98b3e7674bf9082f999743dadfa..749a5c06ad468ee1ceb602944d3090ae9bbe616d 100644
+index 0f9377d28fdf8dd6511fbf025493367205ff74d6..5b04fb60cbd079b7d589ca14dfbb351fd2492f74 100644
 --- a/third_party/blink/renderer/core/exported/web_message_port_converter.cc
 +++ b/third_party/blink/renderer/core/exported/web_message_port_converter.cc
 @@ -6,6 +6,7 @@

patches/chromium/allow_disabling_blink_scheduler_throttling_per_renderview.patch

@@ -1,15 +1,15 @@
 From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
 From: deepak1556 <hop2deep@gmail.com>
 Date: Mon, 18 May 2020 11:12:26 -0700
-Subject: feat: allow disabling blink scheduler throttling per RenderView
+Subject: allow disabling blink scheduler throttling per RenderView
 
 This allows us to disable throttling for hidden windows.
 
 diff --git a/content/browser/renderer_host/render_view_host_impl.cc b/content/browser/renderer_host/render_view_host_impl.cc
-index ba94f41600d2caf5beafa4aa83127bf1cf868a72..95d0dc410cb2ae4eaedbf28435786f7dc267db59 100644
+index 2e43f4e05e0521a8d1e3bf077360171128a0898f..5934a03cfb6fa7239aa0994fb0a10ae6c5ce69c8 100644
 --- a/content/browser/renderer_host/render_view_host_impl.cc
 +++ b/content/browser/renderer_host/render_view_host_impl.cc
-@@ -611,6 +611,11 @@ void RenderViewHostImpl::SetBackgroundOpaque(bool opaque) {
+@@ -615,6 +615,11 @@ void RenderViewHostImpl::SetBackgroundOpaque(bool opaque) {
    GetWidget()->GetAssociatedFrameWidget()->SetBackgroundOpaque(opaque);
  }
  
@@ -22,7 +22,7 @@ index ba94f41600d2caf5beafa4aa83127bf1cf868a72..95d0dc410cb2ae4eaedbf28435786f7d
    return is_active();
  }
 diff --git a/content/browser/renderer_host/render_view_host_impl.h b/content/browser/renderer_host/render_view_host_impl.h
-index 4085504ff23dee78a4c9cf494a903b990a78b9cf..adfb0e332df94b0866b674bae92b315cb22e0d4f 100644
+index 37f3a9cae4ce9652943bbe7e71541ce182f52c1e..608b54785a1d8b34df41b030f65253c14b8285a1 100644
 --- a/content/browser/renderer_host/render_view_host_impl.h
 +++ b/content/browser/renderer_host/render_view_host_impl.h
 @@ -135,6 +135,7 @@ class CONTENT_EXPORT RenderViewHostImpl
@@ -34,7 +34,7 @@ index 4085504ff23dee78a4c9cf494a903b990a78b9cf..adfb0e332df94b0866b674bae92b315c
    void SendRendererPreferencesToRenderer(
        const blink::RendererPreferences& preferences);
 diff --git a/content/public/browser/render_view_host.h b/content/public/browser/render_view_host.h
-index 9f1acca2bdb697b79a01362a9a5d8dd098eca925..c57c03b838a773d41614002afee27520f4488c6f 100644
+index 740d1c322b740d374dd0287d99daebc1fe39ceda..f6ed1402120c0d8b30356c87a52d88fe39ed08d9 100644
 --- a/content/public/browser/render_view_host.h
 +++ b/content/public/browser/render_view_host.h
 @@ -90,6 +90,9 @@ class CONTENT_EXPORT RenderViewHost {
@@ -48,18 +48,18 @@ index 9f1acca2bdb697b79a01362a9a5d8dd098eca925..c57c03b838a773d41614002afee27520
    // This interface should only be implemented inside content.
    friend class RenderViewHostImpl;
 diff --git a/content/renderer/render_view_impl.h b/content/renderer/render_view_impl.h
-index b65e4cc345b05292e1c31d0b05dacc1363d641a8..fe2f8b68cd7cc3f4417ae70dcd711ae56883e117 100644
+index 59f8c47769c5fa325bb9464912561da1f0ba6c8b..822c94e3a3439b1c97ef25baf3eac97a017fa472 100644
 --- a/content/renderer/render_view_impl.h
 +++ b/content/renderer/render_view_impl.h
-@@ -200,6 +200,8 @@ class CONTENT_EXPORT RenderViewImpl : public blink::WebViewClient,
+@@ -155,6 +155,8 @@ class CONTENT_EXPORT RenderViewImpl : public blink::WebViewClient,
    static WindowOpenDisposition NavigationPolicyToDisposition(
        blink::WebNavigationPolicy policy);
  
 +  void OnSetSchedulerThrottling(bool allowed);
 +
-   // Misc private functions ----------------------------------------------------
- 
-   // In OOPIF-enabled modes, this tells each RenderFrame with a pending state
+   // ---------------------------------------------------------------------------
+   // ADDING NEW FUNCTIONS? Please keep private functions alphabetized and put
+   // it in the same order in the .cc file as it was in the header.
 diff --git a/third_party/blink/public/mojom/page/page.mojom b/third_party/blink/public/mojom/page/page.mojom
 index e122d4ffb857023841dabcb6fed352d7586d8344..3c7cd1cb8b204024a0835150302ee8896e01ee45 100644
 --- a/third_party/blink/public/mojom/page/page.mojom
@@ -73,10 +73,10 @@ index e122d4ffb857023841dabcb6fed352d7586d8344..3c7cd1cb8b204024a0835150302ee889
 +  SetSchedulerThrottling(bool allowed);
  };
 diff --git a/third_party/blink/public/web/web_view.h b/third_party/blink/public/web/web_view.h
-index 5c90d306a8e82dcee667e65c0908fc0fe034e6bb..30a8beae286a8606ebeab523782d98f43b42ba00 100644
+index 97e150f7d7f1ccba622ca0a286023ebd75438bb6..85333052af3dcdf39325033f345ae15674dd8768 100644
 --- a/third_party/blink/public/web/web_view.h
 +++ b/third_party/blink/public/web/web_view.h
-@@ -348,6 +348,7 @@ class WebView {
+@@ -364,6 +364,7 @@ class WebView {
    // Scheduling -----------------------------------------------------------
  
    virtual PageScheduler* Scheduler() const = 0;
@@ -85,10 +85,10 @@ index 5c90d306a8e82dcee667e65c0908fc0fe034e6bb..30a8beae286a8606ebeab523782d98f4
    // Visibility -----------------------------------------------------------
  
 diff --git a/third_party/blink/renderer/core/exported/web_view_impl.cc b/third_party/blink/renderer/core/exported/web_view_impl.cc
-index 44e8d23433b42aebb293633928ddb27a9b7a6924..d9887073dbbb313693f7398b2dd7d34dc50a31bd 100644
+index 81c88781d0b7d5c662164b787d581dbfddaa138a..b627f400d16ee1c605ef7657dc3ba63319c5fd56 100644
 --- a/third_party/blink/renderer/core/exported/web_view_impl.cc
 +++ b/third_party/blink/renderer/core/exported/web_view_impl.cc
-@@ -3555,6 +3555,13 @@ PageScheduler* WebViewImpl::Scheduler() const {
+@@ -3577,6 +3577,13 @@ PageScheduler* WebViewImpl::Scheduler() const {
    return GetPage()->GetPageScheduler();
  }
  
@@ -102,7 +102,7 @@ index 44e8d23433b42aebb293633928ddb27a9b7a6924..d9887073dbbb313693f7398b2dd7d34d
  void WebViewImpl::SetVisibilityState(
      mojom::blink::PageVisibilityState visibility_state,
      bool is_initial_state) {
-@@ -3566,7 +3573,8 @@ void WebViewImpl::SetVisibilityState(
+@@ -3588,7 +3595,8 @@ void WebViewImpl::SetVisibilityState(
    }
    GetPage()->SetVisibilityState(visibility_state, is_initial_state);
    GetPage()->GetPageScheduler()->SetPageVisible(
@@ -113,10 +113,10 @@ index 44e8d23433b42aebb293633928ddb27a9b7a6924..d9887073dbbb313693f7398b2dd7d34d
  
  mojom::blink::PageVisibilityState WebViewImpl::GetVisibilityState() {
 diff --git a/third_party/blink/renderer/core/exported/web_view_impl.h b/third_party/blink/renderer/core/exported/web_view_impl.h
-index 5149d97889632aad6add9909a066c4d2feba22ee..1672c7e5a5c717df76b0b6af2df9e44cc7614204 100644
+index c2e704e745d3859790e73e515c3c1cbcd11ce529..5b3233f4d1f108492f370fc0f6450633dbe713f0 100644
 --- a/third_party/blink/renderer/core/exported/web_view_impl.h
 +++ b/third_party/blink/renderer/core/exported/web_view_impl.h
-@@ -392,6 +392,7 @@ class CORE_EXPORT WebViewImpl final : public WebView,
+@@ -408,6 +408,7 @@ class CORE_EXPORT WebViewImpl final : public WebView,
    LocalDOMWindow* PagePopupWindow() const;
  
    PageScheduler* Scheduler() const override;
@@ -124,17 +124,7 @@ index 5149d97889632aad6add9909a066c4d2feba22ee..1672c7e5a5c717df76b0b6af2df9e44c
    void SetVisibilityState(mojom::blink::PageVisibilityState visibility_state,
                            bool is_initial_state) override;
    mojom::blink::PageVisibilityState GetVisibilityState() override;
-@@ -801,11 +802,18 @@ class CORE_EXPORT WebViewImpl final : public WebView,
- 
-   float zoom_factor_override_ = 0.f;
- 
-+  // TODO(bokan): Temporary debugging added to diagnose
-+  // https://crbug.com/992315. Somehow we're synchronously calling
-+  // WebViewImpl::Close while handling an input event.
-+  bool debug_inside_input_handling_ = false;
-+
-   FloatSize elastic_overscroll_;
- 
+@@ -833,6 +834,8 @@ class CORE_EXPORT WebViewImpl final : public WebView,
    // If true, we send IPC messages when |preferred_size_| changes.
    bool send_preferred_size_changes_ = false;
  

patches/chromium/allow_in_process_windows_to_have_different_web_prefs.patch

@@ -74,18 +74,18 @@ index ab2d320a4073308c249821a060e870afc0dbc3a5..1799d27380c112d98e55e63b9dd842c7
    out->accelerated_video_decode_enabled =
        data.accelerated_video_decode_enabled();
 diff --git a/third_party/blink/public/common/web_preferences/web_preferences.h b/third_party/blink/public/common/web_preferences/web_preferences.h
-index 6a7194fc499dd6c88b6e205853390dbd3dd09094..ecda2293dfb14225a3358509f170196fe2f4ff65 100644
+index 84736bea7ac7b6fcc85782ba9faecb23a0d6574c..99b0d5866781e26022fb3fd8ef684562582d8204 100644
 --- a/third_party/blink/public/common/web_preferences/web_preferences.h
 +++ b/third_party/blink/public/common/web_preferences/web_preferences.h
-@@ -9,6 +9,7 @@
- #include <string>
+@@ -10,6 +10,7 @@
  #include <vector>
  
-+#include "base/files/file_path.h"
- #include "base/time/time.h"
  #include "build/build_config.h"
++#include "base/files/file_path.h"
  #include "net/nqe/effective_connection_type.h"
-@@ -161,6 +162,25 @@ struct BLINK_COMMON_EXPORT WebPreferences {
+ #include "third_party/blink/public/common/common_export.h"
+ #include "third_party/blink/public/mojom/css/preferred_color_scheme.mojom-shared.h"
+@@ -160,6 +161,25 @@ struct BLINK_COMMON_EXPORT WebPreferences {
    blink::mojom::V8CacheOptions v8_cache_options;
    bool record_whole_document;
  

patches/chromium/allow_new_privileges_in_unsandboxed_child_processes.patch

@@ -6,7 +6,7 @@ Subject: allow new privileges in unsandboxed child processes
 This allows unsandboxed renderers to launch setuid processes on Linux.
 
 diff --git a/content/browser/child_process_launcher_helper_linux.cc b/content/browser/child_process_launcher_helper_linux.cc
-index f3d40b628ec20c140fb36d139bad55cb2b1bc30e..9b5b8166987dd82383984391893ca3f2c978aee6 100644
+index bbc1d4d057291cc4a3c65287309a22897179a47e..6318b1f2251670d5dd975fde695ee2438c456a0f 100644
 --- a/content/browser/child_process_launcher_helper_linux.cc
 +++ b/content/browser/child_process_launcher_helper_linux.cc
 @@ -53,6 +53,18 @@ bool ChildProcessLauncherHelper::BeforeLaunchOnLauncherThread(