test: migrate to helpers & disabled tests list (#37513)

* test: migrate to helpers & disabled tests list

* can't disable a test suite

* correct condition

* address review comments

.circleci/config/base.yml

@@ -54,7 +54,7 @@ executors:
         type: enum
         enum: ["macos.x86.medium.gen2", "large"]
     macos:
-      xcode: 13.3.0
+      xcode: 14.0.0
     resource_class: << parameters.size >>
 
   # Electron Runners
@@ -413,6 +413,15 @@ step-get-more-space-on-mac: &step-get-more-space-on-mac
         tmpify ~/.rubies
         tmpify ~/Library/Caches/Homebrew
         tmpify /usr/local/Homebrew
+
+        # the contents of build/linux/strip_binary.gni aren't used, but
+        # https://chromium-review.googlesource.com/c/chromium/src/+/4278307
+        # needs the file to exist.
+        mv ~/project/src/build/linux/strip_binary.gni "${TMPDIR}"/
+        tmpify ~/project/src/build/linux/
+        mkdir -p ~/project/src/build/linux
+        mv "${TMPDIR}/strip_binary.gni" ~/project/src/build/linux/
+
         sudo rm -rf $TMPDIR/del-target
 
         # sudo rm -rf "/System/Library/Desktop Pictures"
@@ -434,7 +443,6 @@ step-get-more-space-on-mac: &step-get-more-space-on-mac
         # sudo rm -rf /System/Library/PreferencePanes
         # sudo rm -rf /System/Library/AssetsV2/*
         sudo rm -rf /Applications/Safari.app
-        sudo rm -rf ~/project/src/build/linux
         sudo rm -rf ~/project/src/third_party/catapult/tracing/test_data
         sudo rm -rf ~/project/src/third_party/angle/third_party/VK-GL-CTS
 
@@ -962,26 +970,13 @@ step-ts-compile: &step-ts-compile
 # List of all steps.
 steps-electron-gn-check: &steps-electron-gn-check
   steps:
-    - *step-checkout-electron
-    - *step-depot-tools-get
-    - *step-depot-tools-add-to-path
     - install-python2-mac
-    - *step-setup-env-for-build
     - *step-setup-goma-for-build
-    - *step-generate-deps-hash
-    - *step-touch-sync-done
-    - maybe-restore-portaled-src-cache
-    - run:
-        name: Ensure src checkout worked
-        command: |
-          if [ ! -d "src/third_party/blink" ]; then
-            echo src cache was not restored for an unknown reason
-            exit 1
-          fi
-    - run:
-        name: Wipe Electron
-        command: rm -rf src/electron
-    - *step-checkout-electron
+    - checkout-from-cache
+    - *step-setup-env-for-build
+    - *step-wait-for-goma
+    - *step-gn-gen-default
+    - *step-gn-check
 
 steps-electron-ts-compile-for-doc-change: &steps-electron-ts-compile-for-doc-change
   steps:
@@ -1054,6 +1049,8 @@ commands:
     parameters:
       artifact-key:
         type: string
+      build-type:
+        type: string      
       build-nonproprietary-ffmpeg:
         type: boolean
         default: true
@@ -1061,6 +1058,7 @@ commands:
       - *step-gn-gen-default
       - ninja_build_electron:
           clean-prebuilt-snapshot: false
+          build-type: << parameters.build-type >>
       - *step-maybe-electron-dist-strip
       - step-electron-dist-build:
           additional-targets: shell_browser_ui_unittests third_party/electron_node:headers third_party/electron_node:overlapped-checker electron:hunspell_dictionaries_zip
@@ -1222,9 +1220,12 @@ commands:
       clean-prebuilt-snapshot:
         type: boolean
         default: true
+      build-type:
+        type: string
+
     steps:
       - run:
-          name: Electron build
+          name: Electron << parameters.build-type >> build
           no_output_timeout: 60m
           command: |
             cd src
@@ -1292,6 +1293,8 @@ commands:
         default: true
       artifact-key:
         type: string
+      build-type:
+        type: string        
       after-build-and-save:
         type: steps
         default: []
@@ -1418,6 +1421,7 @@ commands:
           steps:
             - build_and_save_artifacts:
                 artifact-key: << parameters.artifact-key >>
+                build-type: << parameters.build-type >>
                 build-nonproprietary-ffmpeg: << parameters.build-nonproprietary-ffmpeg >>
             - steps: << parameters.after-build-and-save >>
 
@@ -1563,6 +1567,8 @@ commands:
       checkout:
         type: boolean
         default: true
+      build-type:
+        type: string
     steps:
       - when:
           condition: << parameters.attach >>
@@ -1594,7 +1600,8 @@ commands:
       - *step-gn-gen-default
 
       # Electron app
-      - ninja_build_electron
+      - ninja_build_electron:
+          build-type: << parameters.build-type >>
       - *step-show-goma-stats
       - *step-maybe-generate-breakpad-symbols
       - *step-maybe-electron-dist-strip
@@ -1657,6 +1664,7 @@ jobs:
           save-git-cache: true
           checkout-to-create-src-cache: true
           artifact-key: 'nil'
+          build-type: 'nil'
 
   mac-checkout:
     executor:
@@ -1675,6 +1683,7 @@ jobs:
           persist-checkout: true
           restore-src-cache: false
           artifact-key: 'nil'
+          build-type: 'nil'
 
   mac-make-src-cache:
     executor:
@@ -1693,6 +1702,7 @@ jobs:
           save-git-cache: true
           checkout-to-create-src-cache: true
           artifact-key: 'nil'
+          build-type: 'nil'
 
   # Layer 2: Builds.
   linux-x64-testing:
@@ -1710,6 +1720,7 @@ jobs:
           checkout: false
           checkout-and-assume-cache: true
           artifact-key: 'linux-x64'
+          build-type: 'Linux'
 
   linux-x64-testing-asan:
     executor:
@@ -1728,6 +1739,7 @@ jobs:
           checkout: true
           build-nonproprietary-ffmpeg: false
           artifact-key: 'linux-x64-asan'
+          build-type: 'Linux'
 
   linux-x64-testing-no-run-as-node:
     executor:
@@ -1744,6 +1756,7 @@ jobs:
           persist: false
           checkout: true
           artifact-key: 'linux-x64-no-run-as-node'
+          build-type: 'Linux'
 
   linux-x64-testing-gn-check:
     executor:
@@ -1775,6 +1788,7 @@ jobs:
             - electron-publish:
                 attach: false
                 checkout: true
+                build-type: 'Linux'
 
 
   linux-arm-testing:
@@ -1795,6 +1809,7 @@ jobs:
           checkout: false
           checkout-and-assume-cache: true
           artifact-key: 'linux-arm'
+          build-type: 'Linux ARM'
 
   linux-arm-publish:
     executor:
@@ -1819,6 +1834,7 @@ jobs:
             - electron-publish:
                 attach: false
                 checkout: true
+                build-type: 'Linux ARM'
 
   linux-arm64-testing:
     executor:
@@ -1838,6 +1854,7 @@ jobs:
           checkout: false
           checkout-and-assume-cache: true
           artifact-key: 'linux-arm64'
+          build-type: 'Linux ARM64'
 
   linux-arm64-testing-gn-check:
     executor:
@@ -1872,6 +1889,7 @@ jobs:
             - electron-publish:
                 attach: false
                 checkout: true
+                build-type: 'Linux ARM64'
 
   osx-testing-x64:
     executor:
@@ -1890,6 +1908,7 @@ jobs:
           checkout-and-assume-cache: true
           attach: true
           artifact-key: 'darwin-x64'
+          build-type: 'Darwin'
           after-build-and-save:
             - run:
                 name: Configuring MAS build
@@ -1900,6 +1919,7 @@ jobs:
                   rm -rf src/out/Default/Electron*.app
             - build_and_save_artifacts:
                 artifact-key: 'mas-x64'
+                build-type: 'MAS'
           after-persist:
             - persist_to_workspace:
                 root: .
@@ -1936,6 +1956,7 @@ jobs:
             - electron-publish:
                 attach: true
                 checkout: false
+                build-type: 'Darwin'
 
   osx-publish-arm64:
     executor:
@@ -1958,6 +1979,7 @@ jobs:
             - electron-publish:
                 attach: true
                 checkout: false
+                build-type: 'Darwin ARM64'
 
   osx-testing-arm64:
     executor:
@@ -1978,6 +2000,7 @@ jobs:
           checkout-and-assume-cache: true
           attach: true
           artifact-key: 'darwin-arm64'
+          build-type: 'Darwin ARM64'
           after-build-and-save:
             - run:
                 name: Configuring MAS build
@@ -1988,6 +2011,7 @@ jobs:
                   rm -rf src/out/Default/Electron*.app
             - build_and_save_artifacts:
                 artifact-key: 'mas-arm64'
+                build-type: 'MAS ARM64'
           after-persist:
             - persist_to_workspace:
                 root: .
@@ -2014,6 +2038,7 @@ jobs:
             - electron-publish:
                 attach: true
                 checkout: false
+                build-type: 'MAS'
 
   mas-publish-arm64:
     executor:
@@ -2036,6 +2061,7 @@ jobs:
             - electron-publish:
                 attach: true
                 checkout: false
+                build-type: 'MAS ARM64'
 
   # Layer 3: Tests.
   linux-x64-testing-tests:

.devcontainer/on-create-command.sh

@@ -35,8 +35,13 @@ if [ ! -f $buildtools/configs/evm.testing.json ]; then
   write_config() {
     echo "
         {
-            \"root\": \"/workspaces/gclient\",
             \"goma\": \"$1\",
+            \"root\": \"/workspaces/gclient\",
+            \"remotes\": {
+                \"electron\": {
+                    \"origin\": \"https://github.com/electron/electron.git\"
+                }
+            }
             \"gen\": {
                 \"args\": [
                     \"import(\\\"//electron/build/args/testing.gn\\\")\",
@@ -48,11 +53,7 @@ if [ ! -f $buildtools/configs/evm.testing.json ]; then
                 \"CHROMIUM_BUILDTOOLS_PATH\": \"/workspaces/gclient/src/buildtools\",
                 \"GIT_CACHE_PATH\": \"/workspaces/gclient/.git-cache\"
             },
-            \"remotes\": {
-                \"electron\": {
-                    \"origin\": \"https://github.com/electron/electron.git\"
-                }
-            }
+            \"$schema\": \"file:///home/builduser/.electron_build_tools/evm-config.schema.json\"
         }
     " >$buildtools/configs/evm.testing.json
   }

.gitattributes

@@ -11,4 +11,5 @@ patches/**/.patches merge=union
 *.ts text eol=lf
 *.py text eol=lf
 *.ps1 text eol=lf
+*.html text eol=lf
 *.md text eol=lf

.github/CODEOWNERS

@@ -8,6 +8,7 @@
 DEPS                                    @electron/wg-upgrades
 
 # Releases WG
+/docs/breaking-changes.md               @electron/wg-releases
 /npm/                                   @electron/wg-releases
 /script/release                         @electron/wg-releases
 

.github/config.yml

@@ -25,17 +25,3 @@ newPRWelcomeComment: |
 # Comment to be posted to on pull requests merged by a first time user
 firstPRMergeComment: >
   Congrats on merging your first pull request! 🎉🎉🎉
-
-# Users authorized to run manual trop backports
-authorizedUsers:
-  - alexeykuzmin
-  - ckerr
-  - codebytere
-  - deepak1556
-  - jkleinsc
-  - loc
-  - MarshallOfSound
-  - miniak
-  - mlaurencin
-  - nornagon
-  - zcbenz

.github/workflows/semantic.yml

@@ -1,7 +1,7 @@
 name: "Check Semantic Commit"
 
 on:
-  pull_request_target:
+  pull_request:
     types:
       - opened
       - edited

.github/workflows/update_appveyor_image.yml

@@ -40,13 +40,21 @@ jobs:
       if: ${{ env.APPVEYOR_IMAGE_VERSION }}
       uses: mikefarah/yq@1c7dc0e88aad311c89889bc5ce5d8f96931a1bd0 # v4.27.2
       with:
-        cmd: yq '.image = "${{ env.APPVEYOR_IMAGE_VERSION }}"' "appveyor.yml" > "appveyor2.yml"
+        cmd: |
+          yq '.image = "${{ env.APPVEYOR_IMAGE_VERSION }}"' "appveyor.yml" > "appveyor2.yml"
+          yq '.image = "${{ env.APPVEYOR_IMAGE_VERSION }}"' "appveyor-woa.yml" > "appveyor-woa2.yml"
     - name: (Optionally) Generate Commit Diff
       if: ${{ env.APPVEYOR_IMAGE_VERSION }}
       run: |
         diff -w -B appveyor.yml appveyor2.yml > appveyor.diff || true
         patch -f appveyor.yml < appveyor.diff
         rm appveyor2.yml appveyor.diff
+    - name: (Optionally) Generate Commit Diff for WOA
+      if: ${{ env.APPVEYOR_IMAGE_VERSION }}
+      run: |
+        diff -w -B appveyor-woa.yml appveyor-woa2.yml > appveyor-woa.diff || true
+        patch -f appveyor-woa.yml < appveyor-woa.diff
+        rm appveyor-woa2.yml appveyor-woa.diff
     - name: (Optionally) Commit and Pull Request
       if: ${{ env.APPVEYOR_IMAGE_VERSION }}
       uses: peter-evans/create-pull-request@2b011faafdcbc9ceb11414d64d0573f37c774b04 # v4.2.3
@@ -60,4 +68,5 @@ jobs:
         delete-branch: true
         title: 'build: update appveyor image to latest version'
         body: |
-          This PR updates appveyor.yml to the latest baked image, ${{ env.APPVEYOR_IMAGE_VERSION }}.
+          This PR updates appveyor.yml to the latest baked image, ${{ env.APPVEYOR_IMAGE_VERSION }}.
+          Notes: none

.markdownlint.json

@@ -1,29 +1,27 @@
-{
-  "commands-show-output": false,
-  "first-line-h1": false,
-  "header-increment": false,
-  "line-length": {
-    "code_blocks": false,
-    "tables": false,
-    "stern": true,
-    "line_length": -1
-  },
-  "no-bare-urls": false,
-  "no-blanks-blockquote": false,
-  "no-duplicate-header": {
-    "allow_different_nesting": true
-  },
-  "no-emphasis-as-header": false,
-  "no-hard-tabs": {
-    "code_blocks": false
-  },
-  "no-space-in-emphasis": false,
-  "no-trailing-punctuation": false,
-  "no-trailing-spaces": {
-    "br_spaces": 0
-  },
-  "single-h1": false,
-  "no-inline-html": false,
-  "emphasis-style": false,
-  "strong-style": false
-}
+{
+  "commands-show-output": false,
+  "first-line-h1": false,
+  "header-increment": false,
+  "line-length": {
+    "code_blocks": false,
+    "tables": false,
+    "stern": true,
+    "line_length": -1
+  },
+  "no-bare-urls": false,
+  "no-blanks-blockquote": false,
+  "no-duplicate-header": {
+    "allow_different_nesting": true
+  },
+  "no-emphasis-as-header": false,
+  "no-hard-tabs": {
+    "code_blocks": false
+  },
+  "no-space-in-emphasis": false,
+  "no-trailing-punctuation": false,
+  "no-trailing-spaces": {
+    "br_spaces": 0
+  },
+  "single-h1": false,
+  "no-inline-html": false
+}

BUILD.gn

@@ -1,7 +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/os_crypt/sync/features.gni")
 import("//components/spellcheck/spellcheck_build_features.gni")
 import("//content/public/app/mac_helpers.gni")
 import("//extensions/buildflags/buildflags.gni")
@@ -433,7 +433,7 @@ source_set("electron_lib") {
     "//components/network_hints/renderer",
     "//components/network_session_configurator/common",
     "//components/omnibox/browser:buildflags",
-    "//components/os_crypt",
+    "//components/os_crypt/sync",
     "//components/pref_registry",
     "//components/prefs",
     "//components/security_state/content",
@@ -1277,7 +1277,7 @@ if (is_mac) {
       ]
 
       deps += [
-        "//components/browser_watcher:browser_watcher_client",
+        "//chrome/app:exit_code_watcher",
         "//components/crash/core/app:run_as_crashpad_handler",
       ]
 

CONTRIBUTING.md

@@ -28,7 +28,7 @@ _If an issue has been closed and you still feel it's relevant, feel free to ping
 
 ### Languages
 
-We accept issues in *any* language.
+We accept issues in _any_ language.
 When an issue is posted in a language besides English, it is acceptable and encouraged to post an English-translated copy as a reply.
 Anyone may post the translated reply.
 In most cases, a quick pass through translation software is sufficient.

DEPS

@@ -2,9 +2,9 @@ gclient_gn_args_from = 'src'
 
 vars = {
   'chromium_version':
-    '111.0.5560.0',
+    '114.0.5694.0',
   'node_version':
-    'v18.14.0',
+    'v18.15.0',
   'nan_version':
     '16fa32231e2ccd89d2804b3f765319128b20c4ac',
   'squirrel.mac_version':
@@ -149,5 +149,4 @@ hooks = [
 
 recursedeps = [
   'src',
-  'src/third_party/squirrel.mac',
 ]

appveyor-bake.yml

@@ -6,7 +6,7 @@
 
 version: 1.0.{build}
 build_cloud: electronhq-16-core
-image: e-110.0.5451.0
+image: e-112.0.5607.0-vs2022
 environment:
   GIT_CACHE_PATH: C:\Users\appveyor\libcc_cache
   ELECTRON_OUT_DIR: Default
@@ -16,22 +16,58 @@ environment:
   GOMA_FALLBACK_ON_AUTH_FAILURE: true
   DEPOT_TOOLS_WIN_TOOLCHAIN: 0
   PYTHONIOENCODING: UTF-8
-# Uncomment these lines and set APPVEYOR_RDP_PASSWORD in project settings to enable RDP before bake begins
-# install:
-#  - ps: $blockRdp = $true; iex ((new-object net.webclient).DownloadString('https://raw.githubusercontent.com/appveyor/ci/master/scripts/enable-rdp.ps1'))
+
+# The following lines are needed when baking from a completely new image (eg MicrosoftWindowsServer:WindowsServer:2019-Datacenter:latest via image: base-windows-server2019)
+# init:
+#   - ps: $blockRdp = $true; iex ((new-object net.webclient).DownloadString('https://raw.githubusercontent.com/appveyor/ci/master/scripts/enable-rdp.ps1'))
+#   - appveyor version
+#   - ps: $ErrorActionPreference = 'Stop'
+#   - ps: 'Write-Host "OS Build: $((Get-CimInstance Win32_OperatingSystem).BuildNumber)"'
+
+# clone_folder: '%USERPROFILE%\image-bake-scripts'
+
+# clone_script:  
+#   - ps: Invoke-WebRequest "https://github.com/appveyor/build-images/archive/1f90d94e74c8243c909a09b994e527584dfcb838.zip" -OutFile "$env:temp\scripts.zip"
+#   - ps: Expand-Archive -Path "$env:temp\scripts.zip" -DestinationPath "$env:temp\scripts" -Force
+#   - ps: Copy-Item -Path "$env:temp\scripts\build-images-1f90d94e74c8243c909a09b994e527584dfcb838\scripts\Windows\*" -Destination $env:APPVEYOR_BUILD_FOLDER -Recurse  
+
 build_script:
-  # Uncomment/change the following line if the hard drive/partition size needs to change
-  # - ps: Resize-Partition -DriveLetter C -Size (256GB) # ensure initial partition size
+# The following lines are needed when baking from a completely new image (eg MicrosoftWindowsServer:WindowsServer:2019-Datacenter:latest via image: base-windows-server2019)
+  # - ps: .\init_server.ps1
+  # - ps: .\extend_system_volume.ps1
+
+  # # Restart VM
+  # - ps: Start-Sleep -s 5; Restart-Computer
+  # - ps: Start-Sleep -s 5
+
+  # - appveyor version
+  # - ps: .\install_path_utils.ps1
+  # - ps: .\install_powershell_core.ps1
+  # - ps: .\install_powershell_get.ps1
+  # - ps: .\install_7zip.ps1
+  # - ps: .\install_chocolatey.ps1
+  # - ps: .\install_webpi.ps1
+  # - ps: .\install_nuget.ps1
+  # - ps: .\install_pstools.ps1
+
+  # - ps: .\install_git.ps1
+  # - ps: .\install_git_lfs.ps1
+
+  # # Restart VM
+  # - ps: Start-Sleep -s 5; Restart-Computer
+  # - ps: Start-Sleep -s 5
+# END LINES FOR COMPLETELY NEW IMAGE
+
   - git config --global core.longpaths true
-  - cd ..
   - ps: >-
-      if (-not (Test-Path -Path .\src)) {
-        New-Item -Path .\src -ItemType Directory
+      if (-not (Test-Path -Path C:\projects\src)) {
+        New-Item -Path C:\projects\src -ItemType Directory
       }
-  - ps: git clone --depth=1 https://chromium.googlesource.com/chromium/tools/depot_tools.git
+  - cd C:\projects\
+  - git clone -q --branch=%APPVEYOR_REPO_BRANCH% https://github.com/electron/electron.git C:\projects\src\electron
+  - git clone --depth=1 https://chromium.googlesource.com/chromium/tools/depot_tools.git
   - ps: $env:PATH="$pwd\depot_tools;$env:PATH"
   - update_depot_tools.bat
-  - ps: Move-Item $env:APPVEYOR_BUILD_FOLDER -Destination src\electron
   # Uncomment the following line if windows deps change
   # - src\electron\script\setup-win-for-dev.bat
   - >-
@@ -46,21 +82,27 @@ build_script:
   - ps: Copy-Item -path .\.depshash -destination ..\.depshash
   - ps: cd ..\..
   - gclient sync --with_branch_heads --with_tags --nohooks
-  - ps: regsvr32 /s "C:\Program Files (x86)\Microsoft Visual Studio\2019\Community\DIA SDK\bin\amd64\msdia140.dll"
-  - ps: |
-      $env:appveyor_user = "appveyor"
+  - ps: regsvr32 /s "C:\Program Files\Microsoft Visual Studio\2022\Community\DIA SDK\bin\amd64\msdia140.dll"
+  - ps: set vs2022_install="C:\Program Files\Microsoft Visual Studio\2022\Community"
 
-      $env:appveyor_password = [Guid]::NewGuid().ToString('B')
+# The following lines are needed when baking from a completely new image (eg MicrosoftWindowsServer:WindowsServer:2019-Datacenter:latest via image: base-windows-server2019)
+  # # Restart VM
+  # - ps: Start-Sleep -s 5; Restart-Computer 
+  # - ps: Start-Sleep -s 5
 
-      Set-LocalUser -Name $env:appveyor_user -Password (ConvertTo-SecureString -AsPlainText $env:appveyor_password -Force) -PasswordNeverExpires:$true
-
-      iex ((new-object net.webclient).DownloadString('https://raw.githubusercontent.com/appveyor/build-images/master/scripts/Windows/enable_autologon.ps1'))
+  # - cd %USERPROFILE%\image-bake-scripts
+  # - appveyor version
+  # - ps: .\optimize_dotnet_runtime.ps1
+  # - ps: .\disable_windows_background_services.ps1
+  # - ps: .\enforce_windows_firewall.ps1
+  # - ps: .\cleanup_windows.ps1  
+# END LINES FOR COMPLETELY NEW IMAGE  
 on_image_bake:
   - ps: >-
       echo "Baking image: $env:APPVEYOR_BAKE_IMAGE at dir $PWD"
-  - ps: Remove-Item -Recurse -Force $pwd\depot_tools
-  - ps: Remove-Item -Recurse -Force $pwd\src\electron
+  - ps: Remove-Item -Recurse -Force C:\projects\depot_tools
+  - ps: Remove-Item -Recurse -Force C:\projects\src\electron
 # Uncomment these lines and set APPVEYOR_RDP_PASSWORD in project settings to enable RDP after bake is done
-#on_finish:
-#  - ps: >-
-#       $blockRdp = $true; iex ((new-object net.webclient).DownloadString('https://raw.githubusercontent.com/appveyor/ci/master/scripts/enable-rdp.ps1'))
+# # on_finish:
+#   - ps: >-
+#        $blockRdp = $true; iex ((new-object net.webclient).DownloadString('https://raw.githubusercontent.com/appveyor/ci/master/scripts/enable-rdp.ps1'))

appveyor-woa.yml

@@ -6,7 +6,7 @@
 #  - "GN_CONFIG" Build type. One of {'testing', 'release'}.
 #  - "GN_EXTRA_ARGS" Additional gn arguments for a build config,
 #      e.g. 'target_cpu="x86"' to build for a 32bit platform.
-#      https://gn.googlesource.com/gn/+/master/docs/reference.md#target_cpu
+#      https://gn.googlesource.com/gn/+/main/docs/reference.md#var_target_cpu
 #      Don't forget to set up "NPM_CONFIG_ARCH" and "TARGET_ARCH" accordingly
 #      if you pass a custom value for 'target_cpu'.
 #  - "ELECTRON_RELEASE" Set it to '1' upload binaries on success.
@@ -29,14 +29,14 @@
 
 version: 1.0.{build}
 build_cloud: electronhq-16-core
-image: e-111.0.5518.0
+image: e-114.0.5684.0
 environment:
   GIT_CACHE_PATH: C:\Users\appveyor\libcc_cache
   ELECTRON_OUT_DIR: Default
   ELECTRON_ENABLE_STACK_DUMPING: 1
   ELECTRON_ALSO_LOG_TO_STDERR: 1
   MOCHA_REPORTER: mocha-multi-reporters
-  MOCHA_MULTI_REPORTERS: mocha-appveyor-reporter, tap
+  MOCHA_MULTI_REPORTERS: "@marshallofsound/mocha-appveyor-reporter, tap"
   GOMA_FALLBACK_ON_AUTH_FAILURE: true
   DEPOT_TOOLS_WIN_TOOLCHAIN: 0
   PYTHONIOENCODING: UTF-8
@@ -82,7 +82,7 @@ for:
           if (Test-Path -Path "$pwd\build-tools") {
             Remove-Item -Recurse -Force $pwd\build-tools
           }
-      - ps: git clone --depth=1 https://chromium.googlesource.com/chromium/tools/depot_tools.git
+      - git clone --depth=1 https://chromium.googlesource.com/chromium/tools/depot_tools.git
       - ps: $env:PATH="$pwd\depot_tools;$env:PATH"
       - ps: >-
           if (Test-Path -Path "$pwd\src\electron") {

appveyor.yml

@@ -6,7 +6,7 @@
 #  - "GN_CONFIG" Build type. One of {'testing', 'release'}.
 #  - "GN_EXTRA_ARGS" Additional gn arguments for a build config,
 #      e.g. 'target_cpu="x86"' to build for a 32bit platform.
-#      https://gn.googlesource.com/gn/+/master/docs/reference.md#target_cpu
+#      https://gn.googlesource.com/gn/+/main/docs/reference.md#var_target_cpu
 #      Don't forget to set up "NPM_CONFIG_ARCH" and "TARGET_ARCH" accordingly
 #      if you pass a custom value for 'target_cpu'.
 #  - "ELECTRON_RELEASE" Set it to '1' upload binaries on success.
@@ -29,14 +29,14 @@
 
 version: 1.0.{build}
 build_cloud: electronhq-16-core
-image: e-111.0.5560.0
+image: e-114.0.5684.0
 environment:
   GIT_CACHE_PATH: C:\Users\appveyor\libcc_cache
   ELECTRON_OUT_DIR: Default
   ELECTRON_ENABLE_STACK_DUMPING: 1
   ELECTRON_ALSO_LOG_TO_STDERR: 1
   MOCHA_REPORTER: mocha-multi-reporters
-  MOCHA_MULTI_REPORTERS: mocha-appveyor-reporter, tap
+  MOCHA_MULTI_REPORTERS: "@marshallofsound/mocha-appveyor-reporter, tap"
   GOMA_FALLBACK_ON_AUTH_FAILURE: true
   DEPOT_TOOLS_WIN_TOOLCHAIN: 0
   PYTHONIOENCODING: UTF-8
@@ -80,7 +80,7 @@ for:
           if (Test-Path -Path "$pwd\build-tools") {
             Remove-Item -Recurse -Force $pwd\build-tools
           }
-      - ps: git clone --depth=1 https://chromium.googlesource.com/chromium/tools/depot_tools.git
+      - git clone --depth=1 https://chromium.googlesource.com/chromium/tools/depot_tools.git
       - ps: $env:PATH="$pwd\depot_tools;$env:PATH"
       - ps: >-
           if (Test-Path -Path "$pwd\src\electron") {

build/args/all.gn

@@ -1,8 +1,8 @@
 is_electron_build = true
 root_extra_deps = [ "//electron" ]
 
-# Registry of NMVs --> https://github.com/nodejs/node/blob/master/doc/abi_version_registry.json
-node_module_version = 114
+# Registry of NMVs --> https://github.com/nodejs/node/blob/main/doc/abi_version_registry.json
+node_module_version = 116
 
 v8_promise_internal_field_count = 1
 v8_embedder_string = "-electron.0"
@@ -45,3 +45,7 @@ is_cfi = false
 
 # TODO: fix this once sysroots have been updated.
 use_qt = false
+
+# https://chromium-review.googlesource.com/c/chromium/src/+/4365718
+# TODO(codebytere): fix perfetto incompatibility with Node.js.
+use_perfetto_client_library = false

build/zip.py

@@ -10,7 +10,13 @@ EXTENSIONS_TO_SKIP = [
   '.mojom.js',
   '.mojom-lite.js',
   '.info',
-  '.m.js'
+  '.m.js',
+
+  # These are only needed for Chromium tests we don't run. Listed in
+  # 'extensions' because the mksnapshot zip has these under a subdirectory, and
+  # the PATHS_TO_SKIP is checked with |startswith|.
+  'dbgcore.dll',
+  'dbghelp.dll',
 ]
 
 PATHS_TO_SKIP = [
@@ -34,7 +40,7 @@ PATHS_TO_SKIP = [
   # Skip because these are outputs that we don't need.
   'resources/inspector',
   'gen/third_party/devtools-frontend/src',
-  'gen/ui/webui'
+  'gen/ui/webui',
 ]
 
 def skip_path(dep, dist_zip, target_cpu):

docs/README.md

@@ -90,7 +90,6 @@ These individual tutorials expand on topics discussed in the guide above.
 
 ## API References
 
-* [Synopsis](api/synopsis.md)
 * [Process Object](api/process.md)
 * [Supported Command Line Switches](api/command-line-switches.md)
 * [Environment Variables](api/environment-variables.md)

docs/api/app.md

@@ -23,8 +23,7 @@ The `app` object emits the following events:
 Emitted when the application has finished basic startup. On Windows and Linux,
 the `will-finish-launching` event is the same as the `ready` event; on macOS,
 this event represents the `applicationWillFinishLaunching` notification of
-`NSApplication`. You would usually set up listeners for the `open-file` and
-`open-url` events here, and start the crash reporter and auto updater.
+`NSApplication`.
 
 In most cases, you should do everything in the `ready` event handler.
 
@@ -64,7 +63,7 @@ Calling `event.preventDefault()` will prevent the default behavior, which is
 terminating the application.
 
 **Note:** If application quit was initiated by `autoUpdater.quitAndInstall()`,
-then `before-quit` is emitted *after* emitting `close` event on all windows and
+then `before-quit` is emitted _after_ emitting `close` event on all windows and
 closing them.
 
 **Note:** On Windows, this event will not be emitted if the app is closed due
@@ -128,8 +127,6 @@ Emitted when the user wants to open a URL with the application. Your application
 `Info.plist` file must define the URL scheme within the `CFBundleURLTypes` key, and
 set `NSPrincipalClass` to `AtomApplication`.
 
-You should call `event.preventDefault()` if you want to handle this event.
-
 As with the `open-file` event, be sure to register a listener for the `open-url`
 event early in your application startup to detect if the the application being
 is being opened to handle a URL. If you register the listener in response to a
@@ -807,7 +804,7 @@ editor. Please refer to [Apple's documentation][CFBundleURLTypes] for details.
 **Note:** In a Windows Store environment (when packaged as an `appx`) this API
 will return `true` for all calls but the registry key it sets won't be accessible
 by other applications.  In order to register your Windows Store application
-as a default protocol handler you must [declare the protocol in your manifest](https://docs.microsoft.com/en-us/uwp/schemas/appxpackage/uapmanifestschema/element-uap-protocol).
+as a default protocol handler you must [declare the protocol in your manifest](https://learn.microsoft.com/en-us/uwp/schemas/appxpackage/uapmanifestschema/element-uap-protocol).
 
 The API uses the Windows Registry and `LSSetDefaultHandlerForURLScheme` internally.
 
@@ -1357,7 +1354,7 @@ This API must be called after the `ready` event is emitted.
 
 ### `app.showAboutPanel()`
 
-Show the app's about panel options. These options can be overridden with `app.setAboutPanelOptions(options)`.
+Show the app's about panel options. These options can be overridden with `app.setAboutPanelOptions(options)`. This function runs asynchronously.
 
 ### `app.setAboutPanelOptions(options)`
 
@@ -1513,18 +1510,18 @@ dock on macOS.
 
 A `boolean` property that returns  `true` if the app is packaged, `false` otherwise. For many apps, this property can be used to distinguish development and production environments.
 
-[tasks]:https://msdn.microsoft.com/en-us/library/windows/desktop/dd378460(v=vs.85).aspx#tasks
-[app-user-model-id]: https://msdn.microsoft.com/en-us/library/windows/desktop/dd378459(v=vs.85).aspx
+[tasks]:https://learn.microsoft.com/en-us/windows/win32/shell/taskbar-extensions#tasks
+[app-user-model-id]: https://learn.microsoft.com/en-us/windows/win32/shell/appids
 [electron-forge]: https://www.electronforge.io/
 [electron-packager]: https://github.com/electron/electron-packager
 [CFBundleURLTypes]: https://developer.apple.com/library/ios/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html#//apple_ref/doc/uid/TP40009249-102207-TPXREF115
-[LSCopyDefaultHandlerForURLScheme]: https://developer.apple.com/library/mac/documentation/Carbon/Reference/LaunchServicesReference/#//apple_ref/c/func/LSCopyDefaultHandlerForURLScheme
+[LSCopyDefaultHandlerForURLScheme]: https://developer.apple.com/documentation/coreservices/1441725-lscopydefaulthandlerforurlscheme?language=objc
 [handoff]: https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/Handoff/HandoffFundamentals/HandoffFundamentals.html
 [activity-type]: https://developer.apple.com/library/ios/documentation/Foundation/Reference/NSUserActivity_Class/index.html#//apple_ref/occ/instp/NSUserActivity/activityType
 [unity-requirement]: https://help.ubuntu.com/community/UnityLaunchersAndDesktopFiles#Adding_shortcuts_to_a_launcher
 [mas-builds]: ../tutorial/mac-app-store-submission-guide.md
 [Squirrel-Windows]: https://github.com/Squirrel/Squirrel.Windows
-[JumpListBeginListMSDN]: https://msdn.microsoft.com/en-us/library/windows/desktop/dd378398(v=vs.85).aspx
+[JumpListBeginListMSDN]: https://learn.microsoft.com/en-us/windows/win32/api/shobjidl_core/nf-shobjidl_core-icustomdestinationlist-beginlist
 [about-panel-options]: https://developer.apple.com/reference/appkit/nsapplication/1428479-orderfrontstandardaboutpanelwith?language=objc
 
 ### `app.name`

docs/api/auto-updater.md

@@ -140,5 +140,5 @@ application starts.
 [installer]: https://github.com/electron/grunt-electron-installer
 [installer-lib]: https://github.com/electron/windows-installer
 [electron-forge-lib]: https://github.com/electron/forge
-[app-user-model-id]: https://msdn.microsoft.com/en-us/library/windows/desktop/dd378459(v=vs.85).aspx
+[app-user-model-id]: https://learn.microsoft.com/en-us/windows/win32/shell/appids
 [event-emitter]: https://nodejs.org/api/events.html#events_class_eventemitter

docs/api/browser-window.md

@@ -269,7 +269,7 @@ It creates a new `BrowserWindow` with native properties as set by the `options`.
     zoom to the width of the screen. This will also affect the behavior when
     calling `maximize()` directly. Default is `false`.
   * `tabbingIdentifier` string (optional) _macOS_ - Tab group name, allows
-    opening the window as a native tab on macOS 10.12+. Windows with the same
+    opening the window as a native tab. Windows with the same
     tabbing identifier will be grouped together. This also adds a native new
     tab button to your window's tab bar and allows your `app` and window to
     receive the `new-window-for-tab` event.
@@ -595,7 +595,7 @@ Emitted when the window is being moved to a new position.
 
 Emitted once when the window is moved to a new position.
 
-__Note__: On macOS this event is an alias of `move`.
+**Note**: On macOS this event is an alias of `move`.
 
 #### Event: 'enter-full-screen'
 
@@ -629,7 +629,7 @@ Returns:
 * `event` Event
 * `command` string
 
-Emitted when an [App Command](https://msdn.microsoft.com/en-us/library/windows/desktop/ms646275(v=vs.85).aspx)
+Emitted when an [App Command](https://learn.microsoft.com/en-us/windows/win32/inputdev/wm-appcommand)
 is invoked. These are typically related to keyboard media keys or browser
 commands, as well as the "Back" button built into some mice on Windows.
 
@@ -1664,13 +1664,13 @@ in the taskbar.
 #### `win.setAppDetails(options)` _Windows_
 
 * `options` Object
-  * `appId` string (optional) - Window's [App User Model ID](https://msdn.microsoft.com/en-us/library/windows/desktop/dd391569(v=vs.85).aspx).
+  * `appId` string (optional) - Window's [App User Model ID](https://learn.microsoft.com/en-us/windows/win32/shell/appids).
     It has to be set, otherwise the other options will have no effect.
-  * `appIconPath` string (optional) - Window's [Relaunch Icon](https://msdn.microsoft.com/en-us/library/windows/desktop/dd391573(v=vs.85).aspx).
+  * `appIconPath` string (optional) - Window's [Relaunch Icon](https://learn.microsoft.com/en-us/windows/win32/properties/props-system-appusermodel-relaunchiconresource).
   * `appIconIndex` Integer (optional) - Index of the icon in `appIconPath`.
     Ignored when `appIconPath` is not set. Default is `0`.
-  * `relaunchCommand` string (optional) - Window's [Relaunch Command](https://msdn.microsoft.com/en-us/library/windows/desktop/dd391571(v=vs.85).aspx).
-  * `relaunchDisplayName` string (optional) - Window's [Relaunch Display Name](https://msdn.microsoft.com/en-us/library/windows/desktop/dd391572(v=vs.85).aspx).
+  * `relaunchCommand` string (optional) - Window's [Relaunch Command](https://learn.microsoft.com/en-us/windows/win32/properties/props-system-appusermodel-relaunchcommand).
+  * `relaunchDisplayName` string (optional) - Window's [Relaunch Display Name](https://learn.microsoft.com/en-us/windows/win32/properties/props-system-appusermodel-relaunchdisplaynameresource).
 
 Sets the properties for the window's taskbar button.
 
@@ -1776,7 +1776,7 @@ On macOS it does not remove the focus from the window.
 
 #### `win.isFocusable()` _macOS_ _Windows_
 
-Returns whether the window can be focused.
+Returns `boolean` - Whether the window can be focused.
 
 #### `win.setParentWindow(parent)`
 
@@ -1842,16 +1842,36 @@ will remove the vibrancy effect on the window.
 Note that `appearance-based`, `light`, `dark`, `medium-light`, and `ultra-dark` have been
 deprecated and will be removed in an upcoming version of macOS.
 
-#### `win.setTrafficLightPosition(position)` _macOS_
+#### `win.setWindowButtonPosition(position)` _macOS_
+
+* `position` [Point](structures/point.md) | null
+
+Set a custom position for the traffic light buttons in frameless window.
+Passing `null` will reset the position to default.
+
+#### `win.getWindowButtonPosition()` _macOS_
+
+Returns `Point | null` - The custom position for the traffic light buttons in
+frameless window, `null` will be returned when there is no custom position.
+
+#### `win.setTrafficLightPosition(position)` _macOS_ _Deprecated_
 
 * `position` [Point](structures/point.md)
 
 Set a custom position for the traffic light buttons in frameless window.
+Passing `{ x: 0, y: 0 }` will reset the position to default.
 
-#### `win.getTrafficLightPosition()` _macOS_
+> **Note**
+> This function is deprecated. Use [setWindowButtonPosition](#winsetwindowbuttonpositionposition-macos) instead.
+
+#### `win.getTrafficLightPosition()` _macOS_ _Deprecated_
 
 Returns `Point` - The custom position for the traffic light buttons in
-frameless window.
+frameless window, `{ x: 0, y: 0 }` will be returned when there is no custom
+position.
+
+> **Note**
+> This function is deprecated. Use [getWindowButtonPosition](#wingetwindowbuttonposition-macos) instead.
 
 #### `win.setTouchBar(touchBar)` _macOS_
 
@@ -1859,7 +1879,7 @@ frameless window.
 
 Sets the touchBar layout for the current window. Specifying `null` or
 `undefined` clears the touch bar. This method only has an effect if the
-machine has a touch bar and is running on macOS 10.12.1+.
+machine has a touch bar.
 
 **Note:** The TouchBar API is currently experimental and may change or be
 removed in future Electron releases.
@@ -1910,7 +1930,7 @@ removed in future Electron releases.
 On a Window with Window Controls Overlay already enabled, this method updates
 the style of the title bar overlay.
 
-[runtime-enabled-features]: https://cs.chromium.org/chromium/src/third_party/blink/renderer/platform/runtime_enabled_features.json5?l=70
+[runtime-enabled-features]: https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/platform/runtime_enabled_features.json5
 [page-visibility-api]: https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API
 [quick-look]: https://en.wikipedia.org/wiki/Quick_Look
 [vibrancy-docs]: https://developer.apple.com/documentation/appkit/nsvisualeffectview?preferredLanguage=objc

docs/api/client-request.md

@@ -23,12 +23,14 @@ following properties:
     with which the request is associated. Defaults to the empty string. The
     `session` option supersedes `partition`. Thus if a `session` is explicitly
     specified, `partition` is ignored.
-  * `credentials` string (optional) - Can be `include` or `omit`. Whether to
-    send [credentials](https://fetch.spec.whatwg.org/#credentials) with this
+  * `credentials` string (optional) - Can be `include`, `omit` or
+    `same-origin`. Whether to send
+    [credentials](https://fetch.spec.whatwg.org/#credentials) with this
     request. If set to `include`, credentials from the session associated with
     the request will be used. If set to `omit`, credentials will not be sent
     with the request (and the `'login'` event will not be triggered in the
-    event of a 401). This matches the behavior of the
+    event of a 401). If set to `same-origin`, `origin` must also be specified.
+    This matches the behavior of the
     [fetch](https://fetch.spec.whatwg.org/#concept-request-credentials-mode)
     option of the same name. If this option is not specified, authentication
     data from the session will be sent, and cookies will not be sent (unless
@@ -49,6 +51,13 @@ following properties:
     [`request.followRedirect`](#requestfollowredirect) is invoked synchronously
     during the [`redirect`](#event-redirect) event.  Defaults to `follow`.
   * `origin` string (optional) - The origin URL of the request.
+  * `referrerPolicy` string (optional) - can be `""`, `no-referrer`,
+    `no-referrer-when-downgrade`, `origin`, `origin-when-cross-origin`,
+    `unsafe-url`, `same-origin`, `strict-origin`, or
+    `strict-origin-when-cross-origin`. Defaults to
+    `strict-origin-when-cross-origin`.
+  * `cache` string (optional) - can be `default`, `no-store`, `reload`,
+    `no-cache`, `force-cache` or `only-if-cached`.
 
 `options` properties such as `protocol`, `host`, `hostname`, `port` and `path`
 strictly follow the Node.js model as described in the
@@ -234,6 +243,8 @@ it is not allowed to add or remove a custom header.
 * `encoding` string (optional)
 * `callback` Function (optional)
 
+Returns `this`.
+
 Sends the last chunk of the request data. Subsequent write or end operations
 will not be allowed. The `finish` event is emitted just after the end operation.
 

docs/api/clipboard.md

@@ -226,7 +226,7 @@ clipboard.writeBuffer('public/utf8-plain-text', buffer)
 
 const ret = clipboard.readBuffer('public/utf8-plain-text')
 
-console.log(buffer.equals(out))
+console.log(buffer.equals(ret))
 // true
 ```
 

docs/api/cookies.md

@@ -78,6 +78,7 @@ The following methods are available on instances of `Cookies`:
   * `path` string (optional) - Retrieves cookies whose path matches `path`.
   * `secure` boolean (optional) - Filters cookies by their Secure property.
   * `session` boolean (optional) - Filters out session or persistent cookies.
+  * `httpOnly` boolean (optional) - Filters cookies by httpOnly.
 
 Returns `Promise<Cookie[]>` - A promise which resolves an array of cookie objects.
 

docs/api/menu-item.md

@@ -51,7 +51,7 @@ See [`Menu`](menu.md) for examples.
     the placement of their containing group after the containing group of the item
     with the specified label.
 
-**Note:** `acceleratorWorksWhenHidden` is specified as being macOS-only because accelerators always work when items are hidden on Windows and Linux. The option is exposed to users to give them the option to turn it off, as this is possible in native macOS development. This property is only usable on macOS High Sierra 10.13 or newer.
+**Note:** `acceleratorWorksWhenHidden` is specified as being macOS-only because accelerators always work when items are hidden on Windows and Linux. The option is exposed to users to give them the option to turn it off, as this is possible in native macOS development.
 
 ### Roles
 
@@ -115,7 +115,7 @@ The following additional roles are available on _macOS_:
 * `moveTabToNewWindow` - Map to the `moveTabToNewWindow` action.
 * `window` - The submenu is a "Window" menu.
 * `help` - The submenu is a "Help" menu.
-* `services` - The submenu is a ["Services"](https://developer.apple.com/documentation/appkit/nsapplication/1428608-servicesmenu?language=objc) menu. This is only intended for use in the Application Menu and is *not* the same as the "Services" submenu used in context menus in macOS apps, which is not implemented in Electron.
+* `services` - The submenu is a ["Services"](https://developer.apple.com/documentation/appkit/nsapplication/1428608-servicesmenu?language=objc) menu. This is only intended for use in the Application Menu and is _not_ the same as the "Services" submenu used in context menus in macOS apps, which is not implemented in Electron.
 * `recentDocuments` - The submenu is an "Open Recent" menu.
 * `clearRecentDocuments` - Map to the `clearRecentDocuments` action.
 * `shareMenu` - The submenu is [share menu][ShareMenu]. The `sharingItem` property must also be set to indicate the item to share.

docs/api/menu.md

@@ -317,7 +317,7 @@ name, no matter what label you set. To change it, modify your app bundle's
 [About Information Property List Files][AboutInformationPropertyListFiles]
 for more information.
 
-## Setting Menu for Specific Browser Window (*Linux* *Windows*)
+## Setting Menu for Specific Browser Window (_Linux_ _Windows_)
 
 The [`setMenu` method][setMenu] of browser windows can set the menu of certain
 browser windows.

docs/api/native-image.md

@@ -47,9 +47,9 @@ quality, it is recommended to include at least the following sizes in the:
   * 64x64 (200% DPI scale)
   * 256x256
 
-Check the *Size requirements* section in [this article][icons].
+Check the _Size requirements_ section in [this article][icons].
 
-[icons]:https://msdn.microsoft.com/en-us/library/windows/desktop/dn742485(v=vs.85).aspx
+[icons]: https://learn.microsoft.com/en-us/windows/win32/uxguide/vis-icons
 
 ## High Resolution Image
 
@@ -119,13 +119,15 @@ Returns `NativeImage`
 
 Creates an empty `NativeImage` instance.
 
-### `nativeImage.createThumbnailFromPath(path, maxSize)` _macOS_ _Windows_
+### `nativeImage.createThumbnailFromPath(path, size)` _macOS_ _Windows_
 
 * `path` string - path to a file that we intend to construct a thumbnail out of.
-* `maxSize` [Size](structures/size.md) - the maximum width and height (positive numbers) the thumbnail returned can be. The Windows implementation will ignore `maxSize.height` and scale the height according to `maxSize.width`.
+* `size` [Size](structures/size.md) - the desired width and height (positive numbers) of the thumbnail.
 
 Returns `Promise<NativeImage>` - fulfilled with the file's thumbnail preview image, which is a [NativeImage](native-image.md).
 
+Note: The Windows implementation will ignore `size.height` and scale the height according to `size.width`.
+
 ### `nativeImage.createFromPath(path)`
 
 * `path` string

docs/api/net.md

@@ -63,6 +63,62 @@ Creates a [`ClientRequest`](./client-request.md) instance using the provided
 The `net.request` method would be used to issue both secure and insecure HTTP
 requests according to the specified protocol scheme in the `options` object.
 
+### `net.fetch(input[, init])`
+
+* `input` string | [GlobalRequest](https://nodejs.org/api/globals.html#request)
+* `init` [RequestInit](https://developer.mozilla.org/en-US/docs/Web/API/fetch#options) & { bypassCustomProtocolHandlers?: boolean } (optional)
+
+Returns `Promise<GlobalResponse>` - see [Response](https://developer.mozilla.org/en-US/docs/Web/API/Response).
+
+Sends a request, similarly to how `fetch()` works in the renderer, using
+Chrome's network stack. This differs from Node's `fetch()`, which uses
+Node.js's HTTP stack.
+
+Example:
+
+```js
+async function example () {
+  const response = await net.fetch('https://my.app')
+  if (response.ok) {
+    const body = await response.json()
+    // ... use the result.
+  }
+}
+```
+
+This method will issue requests from the [default
+session](session.md#sessiondefaultsession). To send a `fetch` request from
+another session, use [ses.fetch()](session.md#sesfetchinput-init).
+
+See the MDN documentation for
+[`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/fetch) for more
+details.
+
+Limitations:
+
+* `net.fetch()` does not support the `data:` or `blob:` schemes.
+* The value of the `integrity` option is ignored.
+* The `.type` and `.url` values of the returned `Response` object are
+  incorrect.
+
+By default, requests made with `net.fetch` can be made to [custom
+protocols](protocol.md) as well as `file:`, and will trigger
+[webRequest](web-request.md) handlers if present. When the non-standard
+`bypassCustomProtocolHandlers` option is set in RequestInit, custom protocol
+handlers will not be called for this request. This allows forwarding an
+intercepted request to the built-in handler. [webRequest](web-request.md)
+handlers will still be triggered when bypassing custom protocols.
+
+```js
+protocol.handle('https', (req) => {
+  if (req.url === 'https://my-app.com') {
+    return new Response('<body>my app</body>')
+  } else {
+    return net.fetch(req, { bypassCustomProtocolHandlers: true })
+  }
+})
+```
+
 ### `net.isOnline()`
 
 Returns `boolean` - Whether there is currently internet connection.

docs/api/notification.md

@@ -4,9 +4,12 @@
 
 Process: [Main](../glossary.md#main-process)
 
-## Using in the renderer process
+:::info Renderer process notifications
 
-If you want to show Notifications from a renderer process you should use the [HTML5 Notification API](../tutorial/notifications.md)
+If you want to show notifications from a renderer process you should use the
+[web Notifications API](../tutorial/notifications.md)
+
+:::
 
 ## Class: Notification
 
@@ -29,10 +32,10 @@ Returns `boolean` - Whether or not desktop notifications are supported on the cu
 ### `new Notification([options])`
 
 * `options` Object (optional)
-  * `title` string (optional) - A title for the notification, which will be shown at the top of the notification window when it is shown.
+  * `title` string (optional) - A title for the notification, which will be displayed at the top of the notification window when it is shown.
   * `subtitle` string (optional) _macOS_ - A subtitle for the notification, which will be displayed below the title.
   * `body` string (optional) - The body text of the notification, which will be displayed below the title or subtitle.
-  * `silent` boolean (optional) - Whether or not to emit an OS notification noise when showing the notification.
+  * `silent` boolean (optional) - Whether or not to suppress the OS notification noise when showing the notification.
   * `icon` (string | [NativeImage](native-image.md)) (optional) - An icon to use in the notification.
   * `hasReply` boolean (optional) _macOS_ - Whether or not to add an inline reply option to the notification.
   * `timeoutType` string (optional) _Linux_ _Windows_ - The timeout duration of the notification. Can be 'default' or 'never'.
@@ -47,8 +50,11 @@ Returns `boolean` - Whether or not desktop notifications are supported on the cu
 
 Objects created with `new Notification` emit the following events:
 
-**Note:** Some events are only available on specific operating systems and are
-labeled as such.
+:::info
+
+Some events are only available on specific operating systems and are labeled as such.
+
+:::
 
 #### Event: 'show'
 
@@ -56,7 +62,7 @@ Returns:
 
 * `event` Event
 
-Emitted when the notification is shown to the user, note this could be fired
+Emitted when the notification is shown to the user. Note that this event can be fired
 multiple times as a notification can be shown multiple times through the
 `show()` method.
 
@@ -106,14 +112,13 @@ Emitted when an error is encountered while creating and showing the native notif
 
 ### Instance Methods
 
-Objects created with `new Notification` have the following instance methods:
+Objects created with the `new Notification()` constructor have the following instance methods:
 
 #### `notification.show()`
 
-Immediately shows the notification to the user, please note this means unlike the
-HTML5 Notification implementation, instantiating a `new Notification` does
-not immediately show it to the user, you need to call this method before the OS
-will display it.
+Immediately shows the notification to the user. Unlike the web notification API,
+instantiating a `new Notification()` does not immediately show it to the user. Instead, you need to
+call this method before the OS will display it.
 
 If the notification has been shown before, this method will dismiss the previously
 shown notification and create a new one with identical properties.
@@ -160,7 +165,7 @@ A `boolean` property representing whether the notification has a reply action.
 
 A `string` property representing the urgency level of the notification. Can be 'normal', 'critical', or 'low'.
 
-Default is 'low' - see [NotifyUrgency](https://developer.gnome.org/notification-spec/#urgency-levels) for more information.
+Default is 'low' - see [NotifyUrgency](https://developer-old.gnome.org/notification-spec/#urgency-levels) for more information.
 
 #### `notification.timeoutType` _Linux_ _Windows_
 

docs/api/process.md

@@ -49,8 +49,11 @@ beginning to load the web page or the main script.
 
 ### `process.defaultApp` _Readonly_
 
-A `boolean`. When app is started by being passed as parameter to the default app, this
+A `boolean`. When the app is started by being passed as parameter to the default Electron executable, this
 property is `true` in the main process, otherwise it is `undefined`.
+For example when running the app with `electron .`, it is `true`,
+even if the app is packaged ([`isPackaged`](app.md#appispackaged-readonly)) is `true`.
+This can be useful to determine how many arguments will need to be sliced off from `process.argv`.
 
 ### `process.isMainFrame` _Readonly_
 

docs/api/protocol.md

@@ -8,15 +8,11 @@ An example of implementing a protocol that has the same effect as the
 `file://` protocol:
 
 ```javascript
-const { app, protocol } = require('electron')
-const path = require('path')
-const url = require('url')
+const { app, protocol, net } = require('electron')
 
 app.whenReady().then(() => {
-  protocol.registerFileProtocol('atom', (request, callback) => {
-    const filePath = url.fileURLToPath('file://' + request.url.slice('atom://'.length))
-    callback(filePath)
-  })
+  protocol.handle('atom', (request) =>
+    net.fetch('file://' + request.url.slice('atom://'.length)))
 })
 ```
 
@@ -38,14 +34,15 @@ to register it to that session explicitly.
 ```javascript
 const { session, app, protocol } = require('electron')
 const path = require('path')
+const url = require('url')
 
 app.whenReady().then(() => {
   const partition = 'persist:example'
   const ses = session.fromPartition(partition)
 
-  ses.protocol.registerFileProtocol('atom', (request, callback) => {
-    const url = request.url.substr(7)
-    callback({ path: path.normalize(`${__dirname}/${url}`) })
+  ses.protocol.handle('atom', (request) => {
+    const path = request.url.slice('atom://'.length)
+    return net.fetch(url.pathToFileURL(path.join(__dirname, path)))
   })
 
   mainWindow = new BrowserWindow({ webPreferences: { partition } })
@@ -109,7 +106,74 @@ The `<video>` and `<audio>` HTML elements expect protocols to buffer their
 responses by default. The `stream` flag configures those elements to correctly
 expect streaming responses.
 
-### `protocol.registerFileProtocol(scheme, handler)`
+### `protocol.handle(scheme, handler)`
+
+* `scheme` string - scheme to handle, for example `https` or `my-app`. This is
+  the bit before the `:` in a URL.
+* `handler` Function<[GlobalResponse](https://nodejs.org/api/globals.html#response) | Promise<GlobalResponse>>
+  * `request` [GlobalRequest](https://nodejs.org/api/globals.html#request)
+
+Register a protocol handler for `scheme`. Requests made to URLs with this
+scheme will delegate to this handler to determine what response should be sent.
+
+Either a `Response` or a `Promise<Response>` can be returned.
+
+Example:
+
+```js
+import { app, protocol } from 'electron'
+import { join } from 'path'
+import { pathToFileURL } from 'url'
+
+protocol.registerSchemesAsPrivileged([
+  {
+    scheme: 'app',
+    privileges: {
+      standard: true,
+      secure: true,
+      supportsFetchAPI: true
+    }
+  }
+])
+
+app.whenReady().then(() => {
+  protocol.handle('app', (req) => {
+    const { host, pathname } = new URL(req.url)
+    if (host === 'bundle') {
+      if (pathname === '/') {
+        return new Response('<h1>hello, world</h1>', {
+          headers: { 'content-type': 'text/html' }
+        })
+      }
+      // NB, this does not check for paths that escape the bundle, e.g.
+      // app://bundle/../../secret_file.txt
+      return net.fetch(pathToFileURL(join(__dirname, pathname)))
+    } else if (host === 'api') {
+      return net.fetch('https://api.my-server.com/' + pathname, {
+        method: req.method,
+        headers: req.headers,
+        body: req.body
+      })
+    }
+  })
+})
+```
+
+See the MDN docs for [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request) and [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response) for more details.
+
+### `protocol.unhandle(scheme)`
+
+* `scheme` string - scheme for which to remove the handler.
+
+Removes a protocol handler registered with `protocol.handle`.
+
+### `protocol.isProtocolHandled(scheme)`
+
+* `scheme` string
+
+Returns `boolean` - Whether `scheme` is already handled.
+
+### `protocol.registerFileProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -130,7 +194,7 @@ path or an object that has a `path` property, e.g. `callback(filePath)` or
 By default the `scheme` is treated like `http:`, which is parsed differently
 from protocols that follow the "generic URI syntax" like `file:`.
 
-### `protocol.registerBufferProtocol(scheme, handler)`
+### `protocol.registerBufferProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -154,7 +218,7 @@ protocol.registerBufferProtocol('atom', (request, callback) => {
 })
 ```
 
-### `protocol.registerStringProtocol(scheme, handler)`
+### `protocol.registerStringProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -170,7 +234,7 @@ The usage is the same with `registerFileProtocol`, except that the `callback`
 should be called with either a `string` or an object that has the `data`
 property.
 
-### `protocol.registerHttpProtocol(scheme, handler)`
+### `protocol.registerHttpProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -185,7 +249,7 @@ Registers a protocol of `scheme` that will send an HTTP request as a response.
 The usage is the same with `registerFileProtocol`, except that the `callback`
 should be called with an object that has the `url` property.
 
-### `protocol.registerStreamProtocol(scheme, handler)`
+### `protocol.registerStreamProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -234,7 +298,7 @@ protocol.registerStreamProtocol('atom', (request, callback) => {
 })
 ```
 
-### `protocol.unregisterProtocol(scheme)`
+### `protocol.unregisterProtocol(scheme)` _Deprecated_
 
 * `scheme` string
 
@@ -242,13 +306,13 @@ Returns `boolean` - Whether the protocol was successfully unregistered
 
 Unregisters the custom protocol of `scheme`.
 
-### `protocol.isProtocolRegistered(scheme)`
+### `protocol.isProtocolRegistered(scheme)` _Deprecated_
 
 * `scheme` string
 
 Returns `boolean` - Whether `scheme` is already registered.
 
-### `protocol.interceptFileProtocol(scheme, handler)`
+### `protocol.interceptFileProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -261,7 +325,7 @@ Returns `boolean` - Whether the protocol was successfully intercepted
 Intercepts `scheme` protocol and uses `handler` as the protocol's new handler
 which sends a file as a response.
 
-### `protocol.interceptStringProtocol(scheme, handler)`
+### `protocol.interceptStringProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -274,7 +338,7 @@ Returns `boolean` - Whether the protocol was successfully intercepted
 Intercepts `scheme` protocol and uses `handler` as the protocol's new handler
 which sends a `string` as a response.
 
-### `protocol.interceptBufferProtocol(scheme, handler)`
+### `protocol.interceptBufferProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -287,7 +351,7 @@ Returns `boolean` - Whether the protocol was successfully intercepted
 Intercepts `scheme` protocol and uses `handler` as the protocol's new handler
 which sends a `Buffer` as a response.
 
-### `protocol.interceptHttpProtocol(scheme, handler)`
+### `protocol.interceptHttpProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -300,7 +364,7 @@ Returns `boolean` - Whether the protocol was successfully intercepted
 Intercepts `scheme` protocol and uses `handler` as the protocol's new handler
 which sends a new HTTP request as a response.
 
-### `protocol.interceptStreamProtocol(scheme, handler)`
+### `protocol.interceptStreamProtocol(scheme, handler)` _Deprecated_
 
 * `scheme` string
 * `handler` Function
@@ -313,7 +377,7 @@ Returns `boolean` - Whether the protocol was successfully intercepted
 Same as `protocol.registerStreamProtocol`, except that it replaces an existing
 protocol handler.
 
-### `protocol.uninterceptProtocol(scheme)`
+### `protocol.uninterceptProtocol(scheme)` _Deprecated_
 
 * `scheme` string
 
@@ -321,7 +385,7 @@ Returns `boolean` - Whether the protocol was successfully unintercepted
 
 Remove the interceptor installed for `scheme` and restore its original handler.
 
-### `protocol.isProtocolIntercepted(scheme)`
+### `protocol.isProtocolIntercepted(scheme)` _Deprecated_
 
 * `scheme` string
 

docs/api/push-notifications.md

@@ -40,7 +40,7 @@ The `pushNotification` module has the following methods:
 
 Returns `Promise<string>`
 
-Registers the app with Apple Push Notification service (APNS) to receive [Badge, Sound, and Alert](https://developer.apple.com/documentation/appkit/sremotenotificationtype?language=objc) notifications. If registration is successful, the promise will be resolved with the APNS device token. Otherwise, the promise will be rejected with an error message.
+Registers the app with Apple Push Notification service (APNS) to receive [Badge, Sound, and Alert](https://developer.apple.com/documentation/appkit/nsremotenotificationtype?language=objc) notifications. If registration is successful, the promise will be resolved with the APNS device token. Otherwise, the promise will be rejected with an error message.
 See: https://developer.apple.com/documentation/appkit/nsapplication/1428476-registerforremotenotificationtyp?language=objc
 
 ### `pushNotifications.unregisterForAPNSNotifications()` _macOS_

docs/api/session.md

@@ -42,6 +42,22 @@ To create a `Session` with `options`, you have to ensure the `Session` with the
 `partition` has never been used before. There is no way to change the `options`
 of an existing `Session` object.
 
+### `session.fromPath(path[, options])`
+
+* `path` string
+* `options` Object (optional)
+  * `cache` boolean - Whether to enable cache.
+
+Returns `Session` - A session instance from the absolute path as specified by the `path`
+string. When there is an existing `Session` with the same absolute path, it
+will be returned; otherwise a new `Session` instance will be created with `options`. The
+call will throw an error if the path is not an absolute path. Additionally, an error will
+be thrown if an empty string is provided.
+
+To create a `Session` with `options`, you have to ensure the `Session` with the
+`path` has never been used before. There is no way to change the `options`
+of an existing `Session` object.
+
 ## Properties
 
 The `session` module has the following properties:
@@ -644,8 +660,8 @@ The `proxyBypassRules` is a comma separated list of rules described below:
    Match all hostnames that match the pattern HOSTNAME_PATTERN.
 
    Examples:
-     "foobar.com", "*foobar.com", "*.foobar.com", "*foobar.com:99",
-     "https://x.*.y.com:99"
+     "foobar.com", "\*foobar.com", "\*.foobar.com", "\*foobar.com:99",
+     "https://x.\*.y.com:99"
 
 * `"." HOSTNAME_SUFFIX_PATTERN [ ":" PORT ]`
 
@@ -731,6 +747,61 @@ Returns `Promise<void>` - Resolves when all connections are closed.
 
 **Note:** It will terminate / fail all requests currently in flight.
 
+#### `ses.fetch(input[, init])`
+
+* `input` string | [GlobalRequest](https://nodejs.org/api/globals.html#request)
+* `init` [RequestInit](https://developer.mozilla.org/en-US/docs/Web/API/fetch#options) (optional)
+
+Returns `Promise<GlobalResponse>` - see [Response](https://developer.mozilla.org/en-US/docs/Web/API/Response).
+
+Sends a request, similarly to how `fetch()` works in the renderer, using
+Chrome's network stack. This differs from Node's `fetch()`, which uses
+Node.js's HTTP stack.
+
+Example:
+
+```js
+async function example () {
+  const response = await net.fetch('https://my.app')
+  if (response.ok) {
+    const body = await response.json()
+    // ... use the result.
+  }
+}
+```
+
+See also [`net.fetch()`](net.md#netfetchinput-init), a convenience method which
+issues requests from the [default session](#sessiondefaultsession).
+
+See the MDN documentation for
+[`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/fetch) for more
+details.
+
+Limitations:
+
+* `net.fetch()` does not support the `data:` or `blob:` schemes.
+* The value of the `integrity` option is ignored.
+* The `.type` and `.url` values of the returned `Response` object are
+  incorrect.
+
+By default, requests made with `net.fetch` can be made to [custom
+protocols](protocol.md) as well as `file:`, and will trigger
+[webRequest](web-request.md) handlers if present. When the non-standard
+`bypassCustomProtocolHandlers` option is set in RequestInit, custom protocol
+handlers will not be called for this request. This allows forwarding an
+intercepted request to the built-in handler. [webRequest](web-request.md)
+handlers will still be triggered when bypassing custom protocols.
+
+```js
+protocol.handle('https', (req) => {
+  if (req.url === 'https://my-app.com') {
+    return new Response('<body>my app</body>')
+  } else {
+    return net.fetch(req, { bypassCustomProtocolHandlers: true })
+  }
+})
+```
+
 #### `ses.disableNetworkEmulation()`
 
 Disables any network emulation already active for the `session`. Resets to
@@ -879,6 +950,10 @@ session.fromPartition('some-partition').setPermissionCheckHandler((webContents,
         Specifying a loopback device will capture system audio, and is
         currently only supported on Windows. If a WebFrameMain is specified,
         will capture audio from that frame.
+      * `enableLocalEcho` Boolean (optional) - If `audio` is a [WebFrameMain](web-frame-main.md)
+         and this is set to `true`, then local playback of audio will not be muted (e.g. using `MediaRecorder`
+         to record `WebFrameMain` with this flag set to `true` will allow audio to pass through to the speakers
+         while recording). Default is `false`.
 
 This handler will be called when web content requests access to display media
 via the `navigator.mediaDevices.getDisplayMedia` API. Use the

docs/api/shell.md

@@ -40,6 +40,8 @@ Open the given file in the desktop's default manner.
 * `options` Object (optional)
   * `activate` boolean (optional) _macOS_ - `true` to bring the opened application to the foreground. The default is `true`.
   * `workingDirectory` string (optional) _Windows_ - The working directory.
+  * `logUsage` boolean (optional) _Windows_ - Indicates a user initiated launch that enables tracking of frequently used programs and other behaviors.
+                                              The default is `false`.
 
 Returns `Promise<void>`
 

docs/api/structures/event.md

@@ -1,3 +0,0 @@
-# Event Object extends `GlobalEvent`
-
-* `preventDefault` VoidFunction

docs/api/structures/ipc-main-event.md

@@ -3,9 +3,9 @@
 * `processId` Integer - The internal ID of the renderer process that sent this message
 * `frameId` Integer - The ID of the renderer frame that sent this message
 * `returnValue` any - Set this to the value to be returned in a synchronous message
-* `sender` WebContents - Returns the `webContents` that sent the message
-* `senderFrame` WebFrameMain _Readonly_ - The frame that sent this message
-* `ports` MessagePortMain[] - A list of MessagePorts that were transferred with this message
+* `sender` [WebContents](../web-contents.md) - Returns the `webContents` that sent the message
+* `senderFrame` [WebFrameMain](../web-frame-main.md) _Readonly_ - The frame that sent this message
+* `ports` [MessagePortMain](../message-port-main.md)[] - A list of MessagePorts that were transferred with this message
 * `reply` Function - A function that will send an IPC message to the renderer frame that sent the original message that you are currently handling.  You should use this method to "reply" to the sent message in order to guarantee the reply will go to the correct process and frame.
   * `channel` string
   * `...args` any[]

docs/api/structures/ipc-main-invoke-event.md

@@ -2,5 +2,5 @@
 
 * `processId` Integer - The internal ID of the renderer process that sent this message
 * `frameId` Integer - The ID of the renderer frame that sent this message
-* `sender` WebContents - Returns the `webContents` that sent the message
-* `senderFrame` WebFrameMain _Readonly_ - The frame that sent this message
+* `sender` [WebContents](../web-contents.md) - Returns the `webContents` that sent the message
+* `senderFrame` [WebFrameMain](../web-frame-main.md) _Readonly_ - The frame that sent this message

docs/api/structures/ipc-renderer-event.md

@@ -1,7 +1,8 @@
 # IpcRendererEvent Object extends `Event`
 
-* `sender` IpcRenderer - The `IpcRenderer` instance that emitted the event originally
+* `sender` [IpcRenderer](../ipc-renderer.md) - The `IpcRenderer` instance that emitted the event originally
 * `senderId` Integer - The `webContents.id` that sent the message, you can call `event.sender.sendTo(event.senderId, ...)` to reply to the message, see [ipcRenderer.sendTo][ipc-renderer-sendto] for more information. This only applies to messages sent from a different renderer. Messages sent directly from the main process set `event.senderId` to `0`.
-* `ports` MessagePort[] - A list of MessagePorts that were transferred with this message
+* `ports` [MessagePort][][] - A list of MessagePorts that were transferred with this message
 
 [ipc-renderer-sendto]: ../ipc-renderer.md#ipcrenderersendtowebcontentsid-channel-args
+[MessagePort]: https://developer.mozilla.org/en-US/docs/Web/API/MessagePort

docs/api/structures/printer-info.md

@@ -7,7 +7,7 @@
 * `isDefault` boolean - whether or not a given printer is set as the default printer on the OS.
 * `options` Object - an object containing a variable number of platform-specific printer information.
 
-The number represented by `status` means different things on different platforms: on Windows its potential values can be found [here](https://docs.microsoft.com/en-us/windows/win32/printdocs/printer-info-2), and on Linux and macOS they can be found [here](https://www.cups.org/doc/cupspm.html).
+The number represented by `status` means different things on different platforms: on Windows its potential values can be found [here](https://learn.microsoft.com/en-us/windows/win32/printdocs/printer-info-2), and on Linux and macOS they can be found [here](https://www.cups.org/doc/cupspm.html).
 
 ## Example
 

docs/api/structures/upload-file.md

@@ -2,8 +2,8 @@
 
 * `type` 'file' - `file`.
 * `filePath` string - Path of file to be uploaded.
-* `offset` Integer - Defaults to `0`.
-* `length` Integer - Number of bytes to read from `offset`.
+* `offset` Integer (optional) - Defaults to `0`.
+* `length` Integer (optional) - Number of bytes to read from `offset`.
   Defaults to `0`.
-* `modificationTime` Double - Last Modification time in
-  number of seconds since the UNIX epoch.
+* `modificationTime` Double (optional) - Last Modification time in
+  number of seconds since the UNIX epoch. Defaults to `0`.

docs/api/structures/web-request-filter.md

@@ -1,3 +1,4 @@
 # WebRequestFilter Object
 
 * `urls` string[] - Array of [URL patterns](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Match_patterns) that will be used to filter out the requests that do not match the URL patterns.
+* `types` String[] (optional) - Array of types that will be used to filter out the requests that do not match the types. When not specified, all types will be matched. Can be `mainFrame`, `subFrame`, `stylesheet`, `script`, `image`, `font`, `object`, `xhr`, `ping`, `cspReport`, `media` or `webSocket`.

docs/api/synopsis.md

@@ -1,93 +0,0 @@
-# Synopsis
-
-> How to use Node.js and Electron APIs.
-
-All of [Node.js's built-in modules](https://nodejs.org/api/) are available in
-Electron and third-party node modules also fully supported as well (including
-the [native modules](../tutorial/using-native-node-modules.md)).
-
-Electron also provides some extra built-in modules for developing native
-desktop applications. Some modules are only available in the main process, some
-are only available in the renderer process (web page), and some can be used in
-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
-scripts to be able to use those modules.
-
-The main process script is like a normal Node.js script:
-
-```javascript
-const { app, BrowserWindow } = require('electron')
-let win = null
-
-app.whenReady().then(() => {
-  win = new BrowserWindow({ width: 800, height: 600 })
-  win.loadURL('https://github.com')
-})
-```
-
-The renderer process is no different than a normal web page, except for the
-extra ability to use node modules if `nodeIntegration` is enabled:
-
-```html
-<!DOCTYPE html>
-<html>
-<body>
-<script>
-  const fs = require('fs')
-  console.log(fs.readFileSync(__filename, 'utf8'))
-</script>
-</body>
-</html>
-```
-
-## Destructuring assignment
-
-As of 0.37, you can use
-[destructuring assignment][destructuring-assignment] to make it easier to use
-built-in modules.
-
-```javascript
-const { app, BrowserWindow } = require('electron')
-
-let win
-
-app.whenReady().then(() => {
-  win = new BrowserWindow()
-  win.loadURL('https://github.com')
-})
-```
-
-If you need the entire `electron` module, you can require it and then using
-destructuring to access the individual modules from `electron`.
-
-```javascript
-const electron = require('electron')
-const { app, BrowserWindow } = electron
-
-let win
-
-app.whenReady().then(() => {
-  win = new BrowserWindow()
-  win.loadURL('https://github.com')
-})
-```
-
-This is equivalent to the following code:
-
-```javascript
-const electron = require('electron')
-const app = electron.app
-const BrowserWindow = electron.BrowserWindow
-let win
-
-app.whenReady().then(() => {
-  win = new BrowserWindow()
-  win.loadURL('https://github.com')
-})
-```
-
-[gui]: https://en.wikipedia.org/wiki/Graphical_user_interface
-[destructuring-assignment]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

docs/api/system-preferences.md

@@ -235,7 +235,7 @@ if (browserOptions.transparent) {
 }
 ```
 
-[dwm-composition]:https://msdn.microsoft.com/en-us/library/windows/desktop/aa969540.aspx
+[dwm-composition]: https://learn.microsoft.com/en-us/windows/win32/dwm/composition-ovw
 
 ### `systemPreferences.getAccentColor()` _Windows_ _macOS_
 
@@ -336,8 +336,8 @@ See the [Windows docs][windows-colors] and the [macOS docs][macos-colors] for mo
 
 The following colors are only available on macOS 10.14: `find-highlight`, `selected-content-background`, `separator`, `unemphasized-selected-content-background`, `unemphasized-selected-text-background`, and `unemphasized-selected-text`.
 
-[windows-colors]:https://msdn.microsoft.com/en-us/library/windows/desktop/ms724371(v=vs.85).aspx
-[macos-colors]:https://developer.apple.com/design/human-interface-guidelines/macos/visual-design/color#dynamic-system-colors
+[windows-colors]: https://learn.microsoft.com/en-us/windows/win32/api/winuser/nf-winuser-getsyscolor
+[macos-colors]: https://developer.apple.com/design/human-interface-guidelines/macos/visual-design/color#dynamic-system-colors
 
 ### `systemPreferences.getSystemColor(color)` _macOS_
 
@@ -394,8 +394,6 @@ system default and override the value of `getEffectiveAppearance`.
 
 Returns `boolean` - whether or not this device has the ability to use Touch ID.
 
-**NOTE:** This API will return `false` on macOS systems older than Sierra 10.12.2.
-
 ### `systemPreferences.promptTouchID(reason)` _macOS_
 
 * `reason` string - The reason you are asking for Touch ID authentication
@@ -414,8 +412,6 @@ systemPreferences.promptTouchID('To get consent for a Security-Gated Thing').the
 
 This API itself will not protect your user data; rather, it is a mechanism to allow you to do so. Native apps will need to set [Access Control Constants](https://developer.apple.com/documentation/security/secaccesscontrolcreateflags?language=objc) like [`kSecAccessControlUserPresence`](https://developer.apple.com/documentation/security/secaccesscontrolcreateflags/ksecaccesscontroluserpresence?language=objc) on their keychain entry so that reading it would auto-prompt for Touch ID biometric consent. This could be done with [`node-keytar`](https://github.com/atom/node-keytar), such that one would store an encryption key with `node-keytar` and only fetch it if `promptTouchID()` resolves.
 
-**NOTE:** This API will return a rejected Promise on macOS systems older than Sierra 10.12.2.
-
 ### `systemPreferences.isTrustedAccessibilityClient(prompt)` _macOS_
 
 * `prompt` boolean - whether or not the user will be informed via prompt if the current process is untrusted.
@@ -428,7 +424,7 @@ Returns `boolean` - `true` if the current process is a trusted accessibility cli
 
 Returns `string` - Can be `not-determined`, `granted`, `denied`, `restricted` or `unknown`.
 
-This user consent was not required on macOS 10.13 High Sierra or lower so this method will always return `granted`.
+This user consent was not required on macOS 10.13 High Sierra so this method will always return `granted`.
 macOS 10.14 Mojave or higher requires consent for `microphone` and `camera` access.
 macOS 10.15 Catalina or higher requires consent for `screen` access.
 
@@ -443,7 +439,7 @@ Returns `Promise<boolean>` - A promise that resolves with `true` if consent was
 
 **Important:** In order to properly leverage this API, you [must set](https://developer.apple.com/documentation/avfoundation/cameras_and_media_capture/requesting_authorization_for_media_capture_on_macos?language=objc) the `NSMicrophoneUsageDescription` and `NSCameraUsageDescription` strings in your app's `Info.plist` file. The values for these keys will be used to populate the permission dialogs so that the user will be properly informed as to the purpose of the permission request. See [Electron Application Distribution](../tutorial/application-distribution.md#rebranding-with-downloaded-binaries) for more information about how to set these in the context of Electron.
 
-This user consent was not required until macOS 10.14 Mojave, so this method will always return `true` if your system is running 10.13 High Sierra or lower.
+This user consent was not required until macOS 10.14 Mojave, so this method will always return `true` if your system is running 10.13 High Sierra.
 
 ### `systemPreferences.getAnimationSettings()`
 

docs/api/tray.md

@@ -25,9 +25,9 @@ app.whenReady().then(() => {
 })
 ```
 
-__Platform Considerations__
+**Platform Considerations**
 
-__Linux__
+**Linux**
 
 * Tray icon uses [StatusNotifierItem](https://www.freedesktop.org/wiki/Specifications/StatusNotifierItem/)
   by default, when it is not available in user's desktop environment the
@@ -58,14 +58,14 @@ app.whenReady().then(() => {
 })
 ```
 
-__MacOS__
+**MacOS**
 
 * Icons passed to the Tray constructor should be [Template Images](native-image.md#template-image).
 * To make sure your icon isn't grainy on retina monitors, be sure your `@2x` image is 144dpi.
 * If you are bundling your application (e.g., with webpack for development), be sure that the file names are not being mangled or hashed. The filename needs to end in Template, and the `@2x` image needs to have the same filename as the standard image, or MacOS will not magically invert your image's colors or use the high density image.
 * 16x16 (72dpi) and 32x32@2x (144dpi) work well for most icons.
 
-__Windows__
+**Windows**
 
 * It is recommended to use `ICO` icons to get best visual effects.
 
@@ -235,7 +235,7 @@ Sets the hover text for this tray icon.
 
 * `title` string
 * `options` Object (optional)
-  * `fontType` string (optional) - The font family variant to display, can be `monospaced` or `monospacedDigit`. `monospaced` is available in macOS 10.15+ and `monospacedDigit` is available in macOS 10.11+.  When left blank, the title uses the default system font.
+  * `fontType` string (optional) - The font family variant to display, can be `monospaced` or `monospacedDigit`. `monospaced` is available in macOS 10.15+ When left blank, the title uses the default system font.
 
 Sets the title displayed next to the tray icon in the status bar (Support ANSI colors).
 
@@ -269,9 +269,9 @@ Returns `boolean` - Whether double click events will be ignored.
 
 Displays a tray balloon.
 
-[NIIF_NOSOUND]: https://docs.microsoft.com/en-us/windows/win32/api/shellapi/ns-shellapi-notifyicondataa#niif_nosound-0x00000010
-[NIIF_LARGE_ICON]: https://docs.microsoft.com/en-us/windows/win32/api/shellapi/ns-shellapi-notifyicondataa#niif_large_icon-0x00000020
-[NIIF_RESPECT_QUIET_TIME]: https://docs.microsoft.com/en-us/windows/win32/api/shellapi/ns-shellapi-notifyicondataa#niif_respect_quiet_time-0x00000080
+[NIIF_NOSOUND]: https://learn.microsoft.com/en-us/windows/win32/api/shellapi/ns-shellapi-notifyicondataa#niif_nosound-0x00000010
+[NIIF_LARGE_ICON]: https://learn.microsoft.com/en-us/windows/win32/api/shellapi/ns-shellapi-notifyicondataa#niif_large_icon-0x00000020
+[NIIF_RESPECT_QUIET_TIME]: https://learn.microsoft.com/en-us/windows/win32/api/shellapi/ns-shellapi-notifyicondataa#niif_respect_quiet_time-0x00000080
 
 #### `tray.removeBalloon()` _Windows_
 

docs/api/web-contents.md

@@ -19,6 +19,36 @@ const contents = win.webContents
 console.log(contents)
 ```
 
+## Navigation Events
+
+Several events can be used to monitor navigations as they occur within a `webContents`.
+
+### Document Navigations
+
+When a `webContents` navigates to another page (as opposed to an [in-page navigation](web-contents.md#in-page-navigation)), the following events will be fired.
+
+* [`did-start-navigation`](web-contents.md#event-did-start-navigation)
+* [`will-frame-navigate`](web-contents.md#event-will-frame-navigate)
+* [`will-navigate`](web-contents.md#event-will-navigate) (only fired when main frame navigates)
+* [`will-redirect`](web-contents.md#event-will-redirect) (only fired when a redirect happens during navigation)
+* [`did-redirect-navigation`](web-contents.md#event-did-redirect-navigation) (only fired when a redirect happens during navigation)
+* [`did-frame-navigate`](web-contents.md#event-did-frame-navigate)
+* [`did-navigate`](web-contents.md#event-did-navigate) (only fired when main frame navigates)
+
+Subsequent events will not fire if `event.preventDefault()` is called on any of the cancellable events.
+
+### In-page Navigation
+
+In-page navigations don't cause the page to reload, but instead navigate to a location within the current page. These events are not cancellable. For an in-page navigations, the following events will fire in this order:
+
+* [`did-start-navigation`](web-contents.md#event-did-start-navigation)
+* [`did-navigate-in-page`](web-contents.md#event-did-navigate-in-page)
+
+### Frame Navigation
+
+The [`will-navigate`](web-contents.md#event-will-navigate) and [`did-navigate`](web-contents.md#event-did-navigate) events only fire when the [mainFrame](web-contents.md#contentsmainframe-readonly) navigates.
+If you want to also observe navigations in `<iframe>`s, use [`will-frame-navigate`](web-contents.md#event-will-frame-navigate) and [`did-frame-navigate`](web-contents.md#event-did-frame-navigate) events.
+
 ## Methods
 
 These methods can be accessed from the `webContents` module:
@@ -195,7 +225,7 @@ Returns:
     Only defined when the window is being created by a form that set
     `target=_blank`.
   * `disposition` string - Can be `default`, `foreground-tab`,
-    `background-tab`, `new-window`, `save-to-disk` and `other`.
+    `background-tab`, `new-window` or `other`.
 
 Emitted _after_ successful creation of a window via `window.open` in the renderer.
 Not emitted if the creation of the window is canceled from
@@ -207,10 +237,25 @@ See [`window.open()`](window-open.md) for more details and how to use this in co
 
 Returns:
 
-* `event` Event
-* `url` string
+* `details` Event<>
+  * `url` string - The URL the frame is navigating to.
+  * `isSameDocument` boolean - Whether the navigation happened without changing
+    document. Examples of same document navigations are reference fragment
+    navigations, pushState/replaceState, and same page history navigation.
+  * `isMainFrame` boolean - True if the navigation is taking place in a main frame.
+  * `frame` WebFrameMain - The frame to be navigated.
+  * `initiator` WebFrameMain (optional) - The frame which initiated the
+    navigation, which can be a parent frame (e.g. via `window.open` with a
+    frame's name), or null if the navigation was not initiated by a frame. This
+    can also be null if the initiating frame was deleted before the event was
+    emitted.
+* `url` string _Deprecated_
+* `isInPlace` boolean _Deprecated_
+* `isMainFrame` boolean _Deprecated_
+* `frameProcessId` Integer _Deprecated_
+* `frameRoutingId` Integer _Deprecated_
 
-Emitted when a user or the page wants to start navigation. It can happen when
+Emitted when a user or the page wants to start navigation on the main frame. It can happen when
 the `window.location` object is changed or a user clicks a link in the page.
 
 This event will not emit when the navigation is started programmatically with
@@ -222,30 +267,79 @@ this purpose.
 
 Calling `event.preventDefault()` will prevent the navigation.
 
+#### Event: 'will-frame-navigate'
+
+Returns:
+
+* `details` Event<>
+  * `url` string - The URL the frame is navigating to.
+  * `isMainFrame` boolean - True if the navigation is taking place in a main frame.
+  * `frame` WebFrameMain - The frame to be navigated.
+  * `initiator` WebFrameMain (optional) - The frame which initiated the
+    navigation, which can be a parent frame (e.g. via `window.open` with a
+    frame's name), or null if the navigation was not initiated by a frame. This
+    can also be null if the initiating frame was deleted before the event was
+    emitted.
+
+Emitted when a user or the page wants to start navigation in any frame. It can happen when
+the `window.location` object is changed or a user clicks a link in the page.
+
+Unlike `will-navigate`, `will-frame-navigate` is fired when the main frame or any of its subframes attempts to navigate. When the navigation event comes from the main frame, `isMainFrame` will be `true`.
+
+This event will not emit when the navigation is started programmatically with
+APIs like `webContents.loadURL` and `webContents.back`.
+
+It is also not emitted for in-page navigations, such as clicking anchor links
+or updating the `window.location.hash`. Use `did-navigate-in-page` event for
+this purpose.
+
+Calling `event.preventDefault()` will prevent the navigation.
+
 #### Event: 'did-start-navigation'
 
 Returns:
 
-* `event` Event
-* `url` string
-* `isInPlace` boolean
-* `isMainFrame` boolean
-* `frameProcessId` Integer
-* `frameRoutingId` Integer
+* `details` Event<>
+  * `url` string - The URL the frame is navigating to.
+  * `isSameDocument` boolean - Whether the navigation happened without changing
+    document. Examples of same document navigations are reference fragment
+    navigations, pushState/replaceState, and same page history navigation.
+  * `isMainFrame` boolean - True if the navigation is taking place in a main frame.
+  * `frame` WebFrameMain - The frame to be navigated.
+  * `initiator` WebFrameMain (optional) - The frame which initiated the
+    navigation, which can be a parent frame (e.g. via `window.open` with a
+    frame's name), or null if the navigation was not initiated by a frame. This
+    can also be null if the initiating frame was deleted before the event was
+    emitted.
+* `url` string _Deprecated_
+* `isInPlace` boolean _Deprecated_
+* `isMainFrame` boolean _Deprecated_
+* `frameProcessId` Integer _Deprecated_
+* `frameRoutingId` Integer _Deprecated_
 
-Emitted when any frame (including main) starts navigating. `isInPlace` will be
-`true` for in-page navigations.
+Emitted when any frame (including main) starts navigating.
 
 #### Event: 'will-redirect'
 
 Returns:
 
-* `event` Event
-* `url` string
-* `isInPlace` boolean
-* `isMainFrame` boolean
-* `frameProcessId` Integer
-* `frameRoutingId` Integer
+* `details` Event<>
+  * `url` string - The URL the frame is navigating to.
+  * `isSameDocument` boolean - Whether the navigation happened without changing
+    document. Examples of same document navigations are reference fragment
+    navigations, pushState/replaceState, and same page history navigation.
+  * `isMainFrame` boolean - True if the navigation is taking place in a main frame.
+  * `frame` WebFrameMain - The frame to be navigated.
+  * `initiator` WebFrameMain (optional) - The frame which initiated the
+    navigation, which can be a parent frame (e.g. via `window.open` with a
+    frame's name), or null if the navigation was not initiated by a frame. This
+    can also be null if the initiating frame was deleted before the event was
+    emitted.
+* `url` string _Deprecated_
+* `isInPlace` boolean _Deprecated_
+* `isMainFrame` boolean _Deprecated_
+* `frameProcessId` Integer _Deprecated_
+* `frameRoutingId` Integer _Deprecated_
 
 Emitted when a server side redirect occurs during navigation.  For example a 302
 redirect.
@@ -260,12 +354,23 @@ redirect).
 
 Returns:
 
-* `event` Event
-* `url` string
-* `isInPlace` boolean
-* `isMainFrame` boolean
-* `frameProcessId` Integer
-* `frameRoutingId` Integer
+* `details` Event<>
+  * `url` string - The URL the frame is navigating to.
+  * `isSameDocument` boolean - Whether the navigation happened without changing
+    document. Examples of same document navigations are reference fragment
+    navigations, pushState/replaceState, and same page history navigation.
+  * `isMainFrame` boolean - True if the navigation is taking place in a main frame.
+  * `frame` WebFrameMain - The frame to be navigated.
+  * `initiator` WebFrameMain (optional) - The frame which initiated the
+    navigation, which can be a parent frame (e.g. via `window.open` with a
+    frame's name), or null if the navigation was not initiated by a frame. This
+    can also be null if the initiating frame was deleted before the event was
+    emitted.
+* `url` string _Deprecated_
+* `isInPlace` boolean _Deprecated_
+* `isMainFrame` boolean _Deprecated_
+* `frameProcessId` Integer _Deprecated_
+* `frameRoutingId` Integer _Deprecated_
 
 Emitted after a server side redirect occurs during navigation.  For example a 302
 redirect.
@@ -588,6 +693,15 @@ Emitted when media starts playing.
 
 Emitted when media is paused or done playing.
 
+#### Event: 'audio-state-changed'
+
+Returns:
+
+* `event` Event<>
+  * `audible` boolean - True if one or more frames or child `webContents` are emitting audio.
+
+Emitted when media becomes audible or inaudible.
+
 #### Event: 'did-change-theme-color'
 
 Returns:
@@ -721,20 +835,24 @@ Returns:
 * `callback` Function
   * `deviceId` string
 
-Emitted when bluetooth device needs to be selected on call to
-`navigator.bluetooth.requestDevice`. To use `navigator.bluetooth` api
-`webBluetooth` should be enabled. If `event.preventDefault` is not called,
-first available device will be selected. `callback` should be called with
-`deviceId` to be selected, passing empty string to `callback` will
-cancel the request.
+Emitted when a bluetooth device needs to be selected when a call to
+`navigator.bluetooth.requestDevice` is made. `callback` should be called with
+the `deviceId` of the device to be selected.  Passing an empty string to
+`callback` will cancel the request.
 
-If no event listener is added for this event, all bluetooth requests will be cancelled.
+If an event listener is not added for this event, or if `event.preventDefault`
+is not called when handling this event, the first available device will be
+automatically selected.
 
-```javascript
+Due to the nature of bluetooth, scanning for devices when
+`navigator.bluetooth.requestDevice` is called may take time and will cause
+`select-bluetooth-device` to fire multiple times until `callback` is called
+with either a device id or an empty string to cancel the request.
+
+```javascript title='main.js'
 const { app, BrowserWindow } = require('electron')
 
 let win = null
-app.commandLine.appendSwitch('enable-experimental-web-platform-features')
 
 app.whenReady().then(() => {
   win = new BrowserWindow({ width: 800, height: 600 })
@@ -744,6 +862,9 @@ app.whenReady().then(() => {
       return device.deviceName === 'test'
     })
     if (!result) {
+      // The device wasn't found so we need to either wait longer (eg until the
+      // device is turned on) or cancel the request by calling the callback 
+      // with an empty string.
       callback('')
     } else {
       callback(result.deviceId)
@@ -831,7 +952,7 @@ Emitted when the preload script `preloadPath` throws an unhandled exception `err
 
 Returns:
 
-* `event` Event
+* `event` [IpcMainEvent](structures/ipc-main-event.md)
 * `channel` string
 * `...args` any[]
 
@@ -843,7 +964,7 @@ See also [`webContents.ipc`](#contentsipc-readonly), which provides an [`IpcMain
 
 Returns:
 
-* `event` Event
+* `event` [IpcMainEvent](structures/ipc-main-event.md)
 * `channel` string
 * `...args` any[]
 
@@ -1169,7 +1290,7 @@ Ignore application menu shortcuts while this web contents is focused.
     * `frameName` string - Name of the window provided in `window.open()`
     * `features` string - Comma separated list of window features provided to `window.open()`.
     * `disposition` string - Can be `default`, `foreground-tab`, `background-tab`,
-      `new-window`, `save-to-disk` or `other`.
+      `new-window` or `other`.
     * `referrer` [Referrer](structures/referrer.md) - The referrer that will be
       passed to the new window. May or may not result in the `Referer` header being
       sent, depending on the referrer policy.
@@ -1409,8 +1530,8 @@ Returns `Promise<PrinterInfo[]>` - Resolves with a [`PrinterInfo[]`](structures/
     * `vertical` number (optional) - The vertical dpi.
   * `header` string (optional) - string to be printed as page header.
   * `footer` string (optional) - string to be printed as page footer.
-  * `pageSize` string | Size (optional) - Specify page size of the printed document. Can be `A3`,
-  `A4`, `A5`, `Legal`, `Letter`, `Tabloid` or an Object containing `height` and `width`.
+  * `pageSize` string | Size (optional) - Specify page size of the printed document. Can be `A0`, `A1`, `A2`, `A3`,
+  `A4`, `A5`, `A6`, `Legal`, `Letter`, `Tabloid` or an Object containing `height` and `width`.
 * `callback` Function (optional)
   * `success` boolean - Indicates success of the print call.
   * `failureReason` string - Error description called back if the print fails.
@@ -1575,7 +1696,7 @@ ipcMain.on('open-devtools', (event, targetContentsId, devtoolsContentsId) => {
 
 An example of showing devtools in a `BrowserWindow`:
 
-```js
+```js title='main.js'
 const { app, BrowserWindow } = require('electron')
 
 let win = null
@@ -1658,40 +1779,14 @@ Algorithm][SCA], just like [`postMessage`][], so prototype chains will not be
 included. Sending Functions, Promises, Symbols, WeakMaps, or WeakSets will
 throw an exception.
 
-> **NOTE**: Sending non-standard JavaScript types such as DOM objects or
-> special Electron objects will throw an exception.
+:::warning
 
-The renderer process can handle the message by listening to `channel` with the
-[`ipcRenderer`](ipc-renderer.md) module.
+Sending non-standard JavaScript types such as DOM objects or
+special Electron objects will throw an exception.
 
-An example of sending messages from the main process to the renderer process:
+:::
 
-```javascript
-// In the main process.
-const { app, BrowserWindow } = require('electron')
-let win = null
-
-app.whenReady().then(() => {
-  win = new BrowserWindow({ width: 800, height: 600 })
-  win.loadURL(`file://${__dirname}/index.html`)
-  win.webContents.on('did-finish-load', () => {
-    win.webContents.send('ping', 'whoooooooh!')
-  })
-})
-```
-
-```html
-<!-- index.html -->
-<html>
-<body>
-  <script>
-    require('electron').ipcRenderer.on('ping', (event, message) => {
-      console.log(message) // Prints 'whoooooooh!'
-    })
-  </script>
-</body>
-</html>
-```
+For additional reading, refer to [Electron's IPC guide](../tutorial/ipc.md).
 
 #### `contents.sendToFrame(frameId, channel, ...args)`
 
@@ -1853,36 +1948,36 @@ Shows pop-up dictionary that searches the selected word on the page.
 
 #### `contents.isOffscreen()`
 
-Returns `boolean` - Indicates whether *offscreen rendering* is enabled.
+Returns `boolean` - Indicates whether _offscreen rendering_ is enabled.
 
 #### `contents.startPainting()`
 
-If *offscreen rendering* is enabled and not painting, start painting.
+If _offscreen rendering_ is enabled and not painting, start painting.
 
 #### `contents.stopPainting()`
 
-If *offscreen rendering* is enabled and painting, stop painting.
+If _offscreen rendering_ is enabled and painting, stop painting.
 
 #### `contents.isPainting()`
 
-Returns `boolean` - If *offscreen rendering* is enabled returns whether it is currently painting.
+Returns `boolean` - If _offscreen rendering_ is enabled returns whether it is currently painting.
 
 #### `contents.setFrameRate(fps)`
 
 * `fps` Integer
 
-If *offscreen rendering* is enabled sets the frame rate to the specified number.
+If _offscreen rendering_ is enabled sets the frame rate to the specified number.
 Only values between 1 and 240 are accepted.
 
 #### `contents.getFrameRate()`
 
-Returns `Integer` - If *offscreen rendering* is enabled returns the current frame rate.
+Returns `Integer` - If _offscreen rendering_ is enabled returns the current frame rate.
 
 #### `contents.invalidate()`
 
 Schedules a full repaint of the window this web contents is in.
 
-If *offscreen rendering* is enabled invalidates the frame and generates a new
+If _offscreen rendering_ is enabled invalidates the frame and generates a new
 one through the `'paint'` event.
 
 #### `contents.getWebRTCIPHandlingPolicy()`
@@ -2023,7 +2118,7 @@ The zoom factor is the zoom percent divided by 100, so 300% = 3.0.
 An `Integer` property that sets the frame rate of the web contents to the specified number.
 Only values between 1 and 240 are accepted.
 
-Only applicable if *offscreen rendering* is enabled.
+Only applicable if _offscreen rendering_ is enabled.
 
 #### `contents.id` _Readonly_
 

docs/api/webview-tag.md

@@ -821,7 +821,29 @@ It is also not emitted during in-page navigation, such as clicking anchor links
 or updating the `window.location.hash`. Use `did-navigate-in-page` event for
 this purpose.
 
-Calling `event.preventDefault()` does __NOT__ have any effect.
+Calling `event.preventDefault()` does **NOT** have any effect.
+
+### Event: 'will-frame-navigate'
+
+Returns:
+
+* `url` string
+* `isMainFrame` boolean
+* `frameProcessId` Integer
+* `frameRoutingId` Integer
+
+Emitted when a user or the page wants to start navigation anywhere in the `<webview>`
+or any frames embedded within. It can happen when the `window.location` object is
+changed or a user clicks a link in the page.
+
+This event will not emit when the navigation is started programmatically with
+APIs like `<webview>.loadURL` and `<webview>.back`.
+
+It is also not emitted during in-page navigation, such as clicking anchor links
+or updating the `window.location.hash`. Use `did-navigate-in-page` event for
+this purpose.
+
+Calling `event.preventDefault()` does **NOT** have any effect.
 
 ### Event: 'did-start-navigation'
 
@@ -1001,7 +1023,7 @@ Emitted when DevTools is closed.
 
 Emitted when DevTools is focused / opened.
 
-[runtime-enabled-features]: https://cs.chromium.org/chromium/src/third_party/blink/renderer/platform/runtime_enabled_features.json5?l=70
+[runtime-enabled-features]: https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/platform/runtime_enabled_features.json5
 [chrome-webview]: https://developer.chrome.com/docs/extensions/reference/webviewTag/
 
 ### Event: 'context-menu'

docs/breaking-changes.md

@@ -12,8 +12,140 @@ This document uses the following convention to categorize breaking changes:
 * **Deprecated:** An API was marked as deprecated. The API will continue to function, but will emit a deprecation warning, and will be removed in a future release.
 * **Removed:** An API or feature was removed, and is no longer supported by Electron.
 
+## Planned Breaking API Changes (25.0)
+
+### Deprecated: `protocol.{register,intercept}{Buffer,String,Stream,File,Http}Protocol`
+
+The `protocol.register*Protocol` and `protocol.intercept*Protocol` methods have
+been replaced with [`protocol.handle`](api/protocol.md#protocolhandlescheme-handler).
+
+The new method can either register a new protocol or intercept an existing
+protocol, and responses can be of any type.
+
+```js
+// Deprecated in Electron 25
+protocol.registerBufferProtocol('some-protocol', () => {
+  callback({ mimeType: 'text/html', data: Buffer.from('<h5>Response</h5>') })
+})
+
+// Replace with
+protocol.handle('some-protocol', () => {
+  return new Response(
+    Buffer.from('<h5>Response</h5>'), // Could also be a string or ReadableStream.
+    { headers: { 'content-type': 'text/html' } }
+  )
+})
+```
+
+```js
+// Deprecated in Electron 25
+protocol.registerHttpProtocol('some-protocol', () => {
+  callback({ url: 'https://electronjs.org' })
+})
+
+// Replace with
+protocol.handle('some-protocol', () => {
+  return net.fetch('https://electronjs.org')
+})
+```
+
+```js
+// Deprecated in Electron 25
+protocol.registerFileProtocol('some-protocol', () => {
+  callback({ filePath: '/path/to/my/file' })
+})
+
+// Replace with
+protocol.handle('some-protocol', () => {
+  return net.fetch('file:///path/to/my/file')
+})
+```
+
+## Planned Breaking API Changes (24.0)
+
+### API Changed: `nativeImage.createThumbnailFromPath(path, size)`
+
+The `maxSize` parameter has been changed to `size` to reflect that the size passed in will be the size the thumbnail created. Previously, Windows would not scale the image up if it were smaller than `maxSize`, and
+macOS would always set the size to `maxSize`. Behavior is now the same across platforms.
+
+Updated Behavior:
+
+```js
+// a 128x128 image.
+const imagePath = path.join('path', 'to', 'capybara.png')
+
+// Scaling up a smaller image.
+const upSize = { width: 256, height: 256 }
+nativeImage.createThumbnailFromPath(imagePath, upSize).then(result => {
+  console.log(result.getSize()) // { width: 256, height: 256 }
+})
+
+// Scaling down a larger image.
+const downSize = { width: 64, height: 64 }
+nativeImage.createThumbnailFromPath(imagePath, downSize).then(result => {
+  console.log(result.getSize()) // { width: 64, height: 64 }
+})
+```
+
+Previous Behavior (on Windows):
+
+```js
+// a 128x128 image
+const imagePath = path.join('path', 'to', 'capybara.png')
+const size = { width: 256, height: 256 }
+nativeImage.createThumbnailFromPath(imagePath, size).then(result => {
+  console.log(result.getSize()) // { width: 128, height: 128 }
+})
+```
+
+### Deprecated: `BrowserWindow.setTrafficLightPosition(position)`
+
+`BrowserWindow.setTrafficLightPosition(position)` has been deprecated, the
+`BrowserWindow.setWindowButtonPosition(position)` API should be used instead
+which accepts `null` instead of `{ x: 0, y: 0 }` to reset the position to
+system default.
+
+```js
+// Removed in Electron 24
+win.setTrafficLightPosition({ x: 10, y: 10 })
+win.setTrafficLightPosition({ x: 0, y: 0 })
+
+// Replace with
+win.setWindowButtonPosition({ x: 10, y: 10 })
+win.setWindowButtonPosition(null)
+```
+
+### Deprecated: `BrowserWindow.getTrafficLightPosition()`
+
+`BrowserWindow.getTrafficLightPosition()` has been deprecated, the
+`BrowserWindow.getWindowButtonPosition()` API should be used instead
+which returns `null` instead of `{ x: 0, y: 0 }` when there is no custom
+position.
+
+```js
+// Removed in Electron 24
+const pos = win.getTrafficLightPosition()
+if (pos.x === 0 && pos.y === 0) {
+  // No custom position.
+}
+
+// Replace with
+const ret = win.getWindowButtonPosition()
+if (ret === null) {
+  // No custom position.
+}
+```
+
 ## Planned Breaking API Changes (23.0)
 
+### Behavior Changed: Draggable Regions on macOS
+
+The implementation of draggable regions (using the CSS property `-webkit-app-region: drag`) has changed on macOS to bring it in line with Windows and Linux. Previously, when a region with `-webkit-app-region: no-drag` overlapped a region with `-webkit-app-region: drag`, the `no-drag` region would always take precedence on macOS, regardless of CSS layering. That is, if a `drag` region was above a `no-drag` region, it would be ignored. Beginning in Electron 23, a `drag` region on top of a `no-drag` region will correctly cause the region to be draggable.
+
+Additionally, the `customButtonsOnHover` BrowserWindow property previously created a draggable region which ignored the `-webkit-app-region` CSS property. This has now been fixed (see [#37210](https://github.com/electron/electron/issues/37210#issuecomment-1440509592) for discussion).
+
+As a result, if your app uses a frameless window with draggable regions on macOS, the regions which are draggable in your app may change in Electron 23.
+
 ### Removed: Windows 7 / 8 / 8.1 support
 
 [Windows 7, Windows 8, and Windows 8.1 are no longer supported](https://www.electronjs.org/blog/windows-7-to-8-1-deprecation-notice). Electron follows the planned Chromium deprecation policy, which will [deprecate Windows 7 support beginning in Chromium 109](https://support.google.com/chrome/thread/185534985/sunsetting-support-for-windows-7-8-8-1-in-early-2023?hl=en).
@@ -236,6 +368,13 @@ webContents.printToPDF({
 
 ## Planned Breaking API Changes (20.0)
 
+### Removed: macOS 10.11 / 10.12 support
+
+macOS 10.11 (El Capitan) and macOS 10.12 (Sierra) are no longer supported by [Chromium](https://chromium-review.googlesource.com/c/chromium/src/+/3646050).
+
+Older versions of Electron will continue to run on these operating systems, but macOS 10.13 (High Sierra)
+or later will be required to run Electron v20.0.0 and higher.
+
 ### Default Changed: renderers without `nodeIntegration: true` are sandboxed by default
 
 Previously, renderers that specified a preload script defaulted to being

docs/development/azure-vm-setup.md

@@ -1,6 +1,6 @@
 # Updating an Appveyor Azure Image
 
-Electron CI on Windows uses AppVeyor, which in turn uses Azure VM images to run.  Occasionally, these VM images need to be updated due to changes in Chromium requirements.  In order to update you will need [PowerShell](https://docs.microsoft.com/en-us/powershell/scripting/install/installing-powershell?view=powershell-6) and the [Azure PowerShell module](https://docs.microsoft.com/en-us/powershell/azure/install-az-ps?view=azps-1.8.0&viewFallbackFrom=azurermps-6.13.0).
+Electron CI on Windows uses AppVeyor, which in turn uses Azure VM images to run.  Occasionally, these VM images need to be updated due to changes in Chromium requirements.  In order to update you will need [PowerShell](https://learn.microsoft.com/en-us/powershell/scripting/install/installing-powershell?view=powershell-7.3&viewFallbackFrom=powershell-6) and the [Azure PowerShell module](https://learn.microsoft.com/en-us/powershell/azure/install-az-ps?view=azps-9.5.0&viewFallbackFrom=azps-1.8.0).
 
 Occasionally we need to update these images owing to changes in Chromium or other miscellaneous build requirement changes.
 
@@ -8,8 +8,8 @@ Example Use Case:
     * We need `VS15.9` and we have `VS15.7` installed; this would require us to update an Azure image.
 
 1. Identify the image you wish to modify.
-    * In [appveyor.yml](https://github.com/electron/electron/blob/main/appveyor.yml), the image is identified by the property *image*.
-        * The names used correspond to the *"images"* defined for a build cloud, eg the [libcc-20 cloud](https://windows-ci.electronjs.org/build-clouds/8).
+    * In [appveyor.yml](https://github.com/electron/electron/blob/main/appveyor.yml), the image is identified by the property _image_.
+        * The names used correspond to the _"images"_ defined for a build cloud, eg the [libcc-20 cloud](https://windows-ci.electronjs.org/build-clouds/8).
     * Find the image you wish to modify in the build cloud and make note of the **VHD Blob Path** for that image, which is the value for that corresponding key.
         * You will need this URI path to copy into a new image.
     * You will also need the storage account name which is labeled in AppVeyor as the **Disk Storage Account Name**

docs/development/chromium-development.md

@@ -18,8 +18,8 @@ See also [V8 Development](v8-development.md)
 
 ### Code Resources
 
-- [Code Search](https://cs.chromium.org/) - Indexed and searchable source code for Chromium and associated projects.
-- [Source Code](https://cs.chromium.org/chromium/src/) - The source code for Chromium itself.
+- [Code Search](https://source.chromium.org/chromium) - Indexed and searchable source code for Chromium and associated projects.
+- [Source Code](https://source.chromium.org/chromium/chromium/src) - The source code for Chromium itself.
 - [Chromium Review](https://chromium-review.googlesource.com) - The searchable code host which facilitates code reviews for Chromium and related projects.
 
 ### Informational Resources

docs/development/creating-api.md

@@ -158,7 +158,7 @@ We will need to create a new TypeScript file in the path that follows:
 
 `"lib/browser/api/{electron_browser_{api_name}}.ts"`
 
-An example of the contents of this file can be found [here](https://github.com/electron/electron/blob/main/lib/browser/api/native-image.ts).
+An example of the contents of this file can be found [here](https://github.com/electron/electron/blob/main/lib/browser/api/native-theme.ts).
 
 ### Expose your module to TypeScript
 

docs/development/debugging-on-windows.md

@@ -89,12 +89,12 @@ For an introduction to ProcMon's basic and advanced debugging features, go check
 out [this video tutorial][procmon-instructions] provided by Microsoft.
 
 [sys-internals]: https://technet.microsoft.com/en-us/sysinternals/processmonitor.aspx
-[procmon-instructions]: https://channel9.msdn.com/shows/defrag-tools/defrag-tools-4-process-monitor
+[procmon-instructions]: https://learn.microsoft.com/en-us/shows/defrag-tools/4-process-monitor
 
 ## Using WinDbg
 <!-- TODO(@codebytere): add images and more information here? -->
 
-It's possible to debug crashes and issues in the Renderer process with [WinDbg](https://docs.microsoft.com/en-us/windows-hardware/drivers/debugger/getting-started-with-windbg).
+It's possible to debug crashes and issues in the Renderer process with [WinDbg](https://learn.microsoft.com/en-us/windows-hardware/drivers/debugger/getting-started-with-windbg).
 
 To attach to a debug a process with WinDbg:
 

docs/development/goma.md

@@ -44,7 +44,7 @@ machine you can monitor compile jobs as they flow through the goma system.
 For security and cost reasons, access to Electron's Goma cluster is currently restricted
 to Electron Maintainers.  If you want access please head to `#access-requests` in
 Slack and ping `@goma-squad` to ask for access.  Please be aware that being a
-maintainer does not *automatically* grant access and access is determined on a
+maintainer does not _automatically_ grant access and access is determined on a
 case by case basis.
 
 ## Uptime / Support

docs/development/issues.md

@@ -57,7 +57,7 @@ unfriendly.
 
 Contributors are encouraged to solve issues collaboratively and help one
 another make progress. If you encounter an issue that you feel is invalid, or
-which contains incorrect information, explain *why* you feel that way with
+which contains incorrect information, explain _why_ you feel that way with
 additional supporting context, and be willing to be convinced that you may
 be wrong. By doing so, we can often reach the correct outcome faster.
 

docs/development/pull-requests.md

@@ -219,7 +219,7 @@ of the area you modified in order to land. Whenever a maintainer reviews a pull
 request they may request changes. These may be small, such as fixing a typo, or
 may involve substantive changes. Such requests are intended to be helpful, but
 at times may come across as abrupt or unhelpful, especially if they do not include
-concrete suggestions on *how* to change them.
+concrete suggestions on _how_ to change them.
 
 Try not to be discouraged. If you feel that a review is unfair, say so or seek
 the input of another project contributor. Often such comments are the result of

docs/development/testing.md

@@ -79,7 +79,7 @@ the Node.js source tree.
 
 #### Missing fonts
 
-[Some Windows 10 devices](https://docs.microsoft.com/en-us/typography/fonts/windows_10_font_list) do not ship with the Meiryo font installed, which may cause a font fallback test to fail. To install Meiryo:
+[Some Windows 10 devices](https://learn.microsoft.com/en-us/typography/fonts/windows_10_font_list) do not ship with the Meiryo font installed, which may cause a font fallback test to fail. To install Meiryo:
 
 1. Push the Windows key and search for _Manage optional features_.
 2. Click _Add a feature_.

docs/faq.md

@@ -60,7 +60,7 @@ garbage collected.
 If you encounter this problem, the following articles may prove helpful:
 
 * [Memory Management][memory-management]
-* [Variable Scope][variable-scope]
+* [Closures][closures]
 
 If you want a quick fix, you can make the variables global by changing your
 code from this:
@@ -153,7 +153,7 @@ The effect is visible only on (some?) LCD screens. Even if you don't see a diffe
 Notice that just setting the background in the CSS does not have the desired effect.
 
 [memory-management]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management
-[variable-scope]: https://msdn.microsoft.com/library/bzt2dkta(v=vs.94).aspx
+[closures]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures
 [storage]: https://developer.mozilla.org/en-US/docs/Web/API/Storage
 [local-storage]: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
 [session-storage]: https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

docs/fiddles/features/web-bluetooth/index.html

@@ -9,6 +9,7 @@
     <h1>Web Bluetooth API</h1>
 
     <button id="clickme">Test Bluetooth</button>
+    <button id="cancel">Cancel Bluetooth Request</button>
 
     <p>Currently selected bluetooth device: <strong id="device-name""></strong></p>
 

docs/fiddles/features/web-bluetooth/main.js

@@ -1,6 +1,9 @@
 const {app, BrowserWindow, ipcMain} = require('electron')
 const path = require('path')
 
+let bluetoothPinCallback 
+let selectBluetoothCallback
+
 function createWindow () {
   const mainWindow = new BrowserWindow({
     width: 800,
@@ -12,11 +15,23 @@ function createWindow () {
 
   mainWindow.webContents.on('select-bluetooth-device', (event, deviceList, callback) => {
     event.preventDefault()
-    if (deviceList && deviceList.length > 0) {
-      callback(deviceList[0].deviceId)
-    }
+    selectBluetoothCallback = callback
+    const result = deviceList.find((device) => {
+      return device.deviceName === 'test'
+    })
+    if (result) {
+      callback(result.deviceId)
+    } else {
+      // The device wasn't found so we need to either wait longer (eg until the
+      // device is turned on) or until the user cancels the request
+    }     
   })
 
+  ipcMain.on('cancel-bluetooth-request', (event) => {
+    selectBluetoothCallback('')
+  })
+  
+
   // Listen for a message from the renderer to get the response for the Bluetooth pairing.
   ipcMain.on('bluetooth-pairing-response', (event, response) => {
     bluetoothPinCallback(response)

docs/fiddles/features/web-bluetooth/preload.js

@@ -1,6 +1,7 @@
 const { contextBridge, ipcRenderer } = require('electron')
 
 contextBridge.exposeInMainWorld('electronAPI', {
+  cancelBluetoothRequest: (callback) => ipcRenderer.send('cancel-bluetooth-request', callback),
   bluetoothPairingRequest: (callback) => ipcRenderer.on('bluetooth-pairing-request', callback),
   bluetoothPairingResponse: (response) => ipcRenderer.send('bluetooth-pairing-response', response)
 })

docs/fiddles/features/web-bluetooth/renderer.js

@@ -7,6 +7,12 @@ async function testIt() {
 
 document.getElementById('clickme').addEventListener('click',testIt)
 
+function cancelRequest() {
+  window.electronAPI.cancelBluetoothRequest()
+}
+
+document.getElementById('cancel').addEventListener('click', cancelRequest)
+
 window.electronAPI.bluetoothPairingRequest((event, details) => {
   const response = {}
 

docs/fiddles/features/web-usb/main.js

@@ -1,5 +1,4 @@
 const {app, BrowserWindow} = require('electron')
-const e = require('express')
 const path = require('path')
 
 function createWindow () {
@@ -44,7 +43,6 @@ function createWindow () {
     }
   })
 
-
   mainWindow.webContents.session.setDevicePermissionHandler((details) => {
     if (details.deviceType === 'usb' && details.origin === 'file://') {
       if (!grantedDeviceThroughPermHandler) {

docs/fiddles/features/web-usb/renderer.js

@@ -1,5 +1,5 @@
 function getDeviceDetails(device) {
-  return grantedDevice.productName || `Unknown device ${grantedDevice.deviceId}`
+  return device.productName || `Unknown device ${device.deviceId}`
 }
 
 async function testIt() {

docs/fiddles/menus/customize-menus/index.html

@@ -1,128 +1,128 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Customize Menus</title>
-  </head>
-
-  <body>
-    <div>
-      <h1>Customize Menus</h1>
-
-      <h3>
-        The <code>Menu</code> and <code>MenuItem</code> modules can be used to
-        create custom native menus.
-      </h3>
-
-      <p>
-        There are two kinds of menus: the application (top) menu and context
-        (right-click) menu.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/menu"
-          >full API documentation<span
-            >(opens in new window)</span
-          ></a
-        >
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <h2>Create an application menu</h2>
-      <div>
-        <div>
-          <p>
-            The <code>Menu</code> and <code>MenuItem</code> modules allow you to
-            customize your application menu. If you don't set any menu, Electron
-            will generate a minimal menu for your app by default.
-          </p>
-
-          <p>
-            If you click the 'View' option in the application menu and then the
-            'App Menu Demo', you'll see an information box displayed.
-          </p>
-
-          <div>
-            <h2>ProTip</h2>
-            <strong>Know operating system menu differences.</strong>
-            <p>
-              When designing an app for multiple operating systems it's
-              important to be mindful of the ways application menu conventions
-              differ on each operating system.
-            </p>
-            <p>
-              For instance, on Windows, accelerators are set with an
-              <code>&</code>. Naming conventions also vary, like between
-              "Settings" or "Preferences". Below are resources for learning
-              operating system specific standards.
-            </p>
-            <ul>
-              <li>
-                <a
-                  href="https://developer.apple.com/macos/human-interface-guidelines/menus/menu-anatomy/"
-                  >macOS<span
-                    >(opens in new window)</span
-                  ></a
-                >
-              </li>
-              <li>
-                <a
-                  href="https://msdn.microsoft.com/en-us/library/windows/desktop/bb226797(v=vs.85).aspx"
-                  >Windows<span
-                    >(opens in new window)</span
-                  ></a
-                >
-              </li>
-              <li>
-                <a
-                  href="https://developer.gnome.org/hig/stable/menu-bars.html.en"
-                  >Linux<span
-                    >(opens in new window)</span
-                  ></a
-                >
-              </li>
-            </ul>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div>
-      <h2>Create a context menu</h2>
-      <div>
-        <div>
-          <div>
-            <button id="context-menu">View Demo</button>
-          </div>
-          <p>
-            A context, or right-click, menu can be created with the
-            <code>Menu</code> and <code>MenuItem</code> modules as well. You can
-            right-click anywhere in this app or click the demo button to see an
-            example context menu.
-          </p>
-
-          <p>
-            In this demo we use the <code>ipcRenderer</code> module to show the
-            context menu when explicitly calling it from the renderer process.
-          </p>
-          <p>
-            See the full
-            <a
-              href="https://electronjs.org/docs/api/web-contents/#event-context-menu"
-              >context-menu event documentation</a
-            >
-            for all the available properties.
-          </p>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Customize Menus</title>
+  </head>
+
+  <body>
+    <div>
+      <h1>Customize Menus</h1>
+
+      <h3>
+        The <code>Menu</code> and <code>MenuItem</code> modules can be used to
+        create custom native menus.
+      </h3>
+
+      <p>
+        There are two kinds of menus: the application (top) menu and context
+        (right-click) menu.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/menu"
+          >full API documentation<span
+            >(opens in new window)</span
+          ></a
+        >
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <h2>Create an application menu</h2>
+      <div>
+        <div>
+          <p>
+            The <code>Menu</code> and <code>MenuItem</code> modules allow you to
+            customize your application menu. If you don't set any menu, Electron
+            will generate a minimal menu for your app by default.
+          </p>
+
+          <p>
+            If you click the 'View' option in the application menu and then the
+            'App Menu Demo', you'll see an information box displayed.
+          </p>
+
+          <div>
+            <h2>ProTip</h2>
+            <strong>Know operating system menu differences.</strong>
+            <p>
+              When designing an app for multiple operating systems it's
+              important to be mindful of the ways application menu conventions
+              differ on each operating system.
+            </p>
+            <p>
+              For instance, on Windows, accelerators are set with an
+              <code>&</code>. Naming conventions also vary, like between
+              "Settings" or "Preferences". Below are resources for learning
+              operating system specific standards.
+            </p>
+            <ul>
+              <li>
+                <a
+                  href="https://developer.apple.com/macos/human-interface-guidelines/menus/menu-anatomy/"
+                  >macOS<span
+                    >(opens in new window)</span
+                  ></a
+                >
+              </li>
+              <li>
+                <a
+                  href="https://learn.microsoft.com/en-us/previous-versions/windows/desktop/bb226797"
+                  >Windows<span
+                    >(opens in new window)</span
+                  ></a
+                >
+              </li>
+              <li>
+                <a
+                  href="https://developer.gnome.org/hig/stable/menu-bars.html.en"
+                  >Linux<span
+                    >(opens in new window)</span
+                  ></a
+                >
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div>
+      <h2>Create a context menu</h2>
+      <div>
+        <div>
+          <div>
+            <button id="context-menu">View Demo</button>
+          </div>
+          <p>
+            A context, or right-click, menu can be created with the
+            <code>Menu</code> and <code>MenuItem</code> modules as well. You can
+            right-click anywhere in this app or click the demo button to see an
+            example context menu.
+          </p>
+
+          <p>
+            In this demo we use the <code>ipcRenderer</code> module to show the
+            context menu when explicitly calling it from the renderer process.
+          </p>
+          <p>
+            See the full
+            <a
+              href="https://electronjs.org/docs/api/web-contents/#event-context-menu"
+              >context-menu event documentation</a
+            >
+            for all the available properties.
+          </p>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/menus/shortcuts/index.html

@@ -1,73 +1,73 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-	<meta charset="UTF-8">
-	<title>Keyboard Shortcuts</title>
-</head>
-
-<body>
-	<div>
-		<h1>Keyboard Shortcuts</h1>
-
-		<h3>The <code>globalShortcut</code> and <code>Menu</code> modules can be used to define keyboard shortcuts.</h3>
-
-		<p>
-			In Electron, keyboard shortcuts are called accelerators.
-			They can be assigned to actions in your application's Menu,
-			or they can be assigned globally so they'll be triggered even when
-			your app doesn't have keyboard focus.
-		</p>
-
-		<p>
-			Open the full documentation for the
-			<a href="https://electronjs.org/docs/api/menu">Menu</a>,
-			<a href="https://electronjs.org/docs/api/accelerator">Accelerator</a>,
-			and
-			<a href="https://electronjs.org/docs/api/global-shortcut">globalShortcut</a>
-			APIs in your browser.
-		</p>
-
-	</div>
-
-	<div>
-		<div>
-			<div>
-				<p>
-					To try this demo, press <kbd>CommandOrControl+Alt+K</kbd> on your
-					keyboard.
-				</p>
-
-				<p>
-					Global shortcuts are detected even when the app doesn't have
-					keyboard focus, and they must be registered after the app's
-					`ready` event is emitted.
-				</p>
-
-				<div>
-					<h2>ProTip</h2>
-					<strong>Avoid overriding system-wide keyboard shortcuts.</strong>
-					<p>
-						When registering global shortcuts, it's important to be aware of
-						existing defaults in the target operating system, so as not to
-						override any existing behaviors. For an overview of each
-						operating system's keyboard shortcuts, view these documents:
-					</p>
-
-					<ul>
-						<li><a
-								href="https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/OSXHIGuidelines/Keyboard.html">macOS</a>
-						</li>
-						<li><a
-								href="http://windows.microsoft.com/en-us/windows-10/keyboard-shortcuts">Windows</a></li>
-						<li><a
-								href="https://developer.gnome.org/hig/stable/keyboard-input.html.en">Linux</a></li>
-					</ul>
-				</div>
-
-			</div>
-		</div>
-	</div>
-</body>
-
-</html>
+<!DOCTYPE html>
+<html>
+
+<head>
+	<meta charset="UTF-8">
+	<title>Keyboard Shortcuts</title>
+</head>
+
+<body>
+	<div>
+		<h1>Keyboard Shortcuts</h1>
+
+		<h3>The <code>globalShortcut</code> and <code>Menu</code> modules can be used to define keyboard shortcuts.</h3>
+
+		<p>
+			In Electron, keyboard shortcuts are called accelerators.
+			They can be assigned to actions in your application's Menu,
+			or they can be assigned globally so they'll be triggered even when
+			your app doesn't have keyboard focus.
+		</p>
+
+		<p>
+			Open the full documentation for the
+			<a href="https://electronjs.org/docs/api/menu">Menu</a>,
+			<a href="https://electronjs.org/docs/api/accelerator">Accelerator</a>,
+			and
+			<a href="https://electronjs.org/docs/api/global-shortcut">globalShortcut</a>
+			APIs in your browser.
+		</p>
+
+	</div>
+
+	<div>
+		<div>
+			<div>
+				<p>
+					To try this demo, press <kbd>CommandOrControl+Alt+K</kbd> on your
+					keyboard.
+				</p>
+
+				<p>
+					Global shortcuts are detected even when the app doesn't have
+					keyboard focus, and they must be registered after the app's
+					`ready` event is emitted.
+				</p>
+
+				<div>
+					<h2>ProTip</h2>
+					<strong>Avoid overriding system-wide keyboard shortcuts.</strong>
+					<p>
+						When registering global shortcuts, it's important to be aware of
+						existing defaults in the target operating system, so as not to
+						override any existing behaviors. For an overview of each
+						operating system's keyboard shortcuts, view these documents:
+					</p>
+
+					<ul>
+						<li><a
+								href="https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/OSXHIGuidelines/Keyboard.html">macOS</a>
+						</li>
+						<li><a
+								href="http://windows.microsoft.com/en-us/windows-10/keyboard-shortcuts">Windows</a></li>
+						<li><a
+								href="https://developer.gnome.org/hig/stable/keyboard-input.html.en">Linux</a></li>
+					</ul>
+				</div>
+
+			</div>
+		</div>
+	</div>
+</body>
+
+</html>

docs/fiddles/native-ui/dialogs/error-dialog/index.html

@@ -1,81 +1,81 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Error Dialog</title>
-  </head>
-
-  <body>
-    <div>
-      <h1>Use system dialogs</h1>
-
-      <h3>
-        The <code>dialog</code> module in Electron allows you to use native
-        system dialogs for opening files or directories, saving a file or
-        displaying informational messages.
-      </h3>
-
-      <p>
-        This is a main process module because this process is more efficient
-        with native utilities and it allows the call to happen without
-        interrupting the visible elements in your page's renderer process.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/dialog/">
-          full API documentation (opens in new window)
-          </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Error Dialog</h2>
-        <div>
-          <div>
-            <button id="error-dialog">View Demo</button>
-          </div>
-          <p>
-            In this demo, the <code>ipc</code> module is used to send a message
-            from the renderer process instructing the main process to launch the
-            error dialog.
-          </p>
-
-          <p>
-            You can use an error dialog before the app's
-            <code>ready</code> event, which is useful for showing errors upon
-            startup.
-          </p>
-          <h5>Renderer Process</h5>
-          <pre>
-          <code>
-const {ipcRenderer} = require('electron')
-
-const errorBtn = document.getElementById('error-dialog')
-
-errorBtn.addEventListener('click', (event) => {
-  ipcRenderer.send('open-error-dialog')
-})
-          </code></pre>
-          <h5>Main Process</h5>
-          <pre>
-          <code>
-const {ipcMain, dialog} = require('electron')
-
-ipcMain.on('open-error-dialog', (event) => {
-  dialog.showErrorBox('An Error Message', 'Demonstrating an error message.')
-})
-          </code>
-        </pre>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Error Dialog</title>
+  </head>
+
+  <body>
+    <div>
+      <h1>Use system dialogs</h1>
+
+      <h3>
+        The <code>dialog</code> module in Electron allows you to use native
+        system dialogs for opening files or directories, saving a file or
+        displaying informational messages.
+      </h3>
+
+      <p>
+        This is a main process module because this process is more efficient
+        with native utilities and it allows the call to happen without
+        interrupting the visible elements in your page's renderer process.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/dialog/">
+          full API documentation (opens in new window)
+          </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Error Dialog</h2>
+        <div>
+          <div>
+            <button id="error-dialog">View Demo</button>
+          </div>
+          <p>
+            In this demo, the <code>ipc</code> module is used to send a message
+            from the renderer process instructing the main process to launch the
+            error dialog.
+          </p>
+
+          <p>
+            You can use an error dialog before the app's
+            <code>ready</code> event, which is useful for showing errors upon
+            startup.
+          </p>
+          <h5>Renderer Process</h5>
+          <pre>
+          <code>
+const {ipcRenderer} = require('electron')
+
+const errorBtn = document.getElementById('error-dialog')
+
+errorBtn.addEventListener('click', (event) => {
+  ipcRenderer.send('open-error-dialog')
+})
+          </code></pre>
+          <h5>Main Process</h5>
+          <pre>
+          <code>
+const {ipcMain, dialog} = require('electron')
+
+ipcMain.on('open-error-dialog', (event) => {
+  dialog.showErrorBox('An Error Message', 'Demonstrating an error message.')
+})
+          </code>
+        </pre>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/native-ui/dialogs/information-dialog/index.html

@@ -1,104 +1,104 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Information Dialog</title>
-  </head>
-
-  <body>
-    <div class="section-wrapper">
-      <h1>Use system dialogs</h1>
-
-      <h3>
-        The <code>dialog</code> module in Electron allows you to use native
-        system dialogs for opening files or directories, saving a file or
-        displaying informational messages.
-      </h3>
-
-      <p>
-        This is a main process module because this process is more efficient
-        with native utilities and it allows the call to happen without
-        interrupting the visible elements in your page's renderer process.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/dialog/">
-          full API documentation (opens in new window)
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Information Dialog</h2>
-        <div>
-          <div>
-            <button id="information-dialog">
-              View Demo
-            </button>
-            <span id="info-selection"></span>
-          </div>
-          <p>
-            In this demo, the <code>ipc</code> module is used to send a message
-            from the renderer process instructing the main process to launch the
-            information dialog. Options may be provided for responses which can
-            then be relayed back to the renderer process.
-          </p>
-
-          <p>
-            Note: The <code>title</code> property is not displayed in macOS.
-          </p>
-
-          <p>
-            An information dialog can contain an icon, your choice of buttons,
-            title and message.
-          </p>
-          <h5>Renderer Process</h5>
-          <pre>
-            <code>
-const {ipcRenderer} = require('electron')
-
-const informationBtn = document.getElementById('information-dialog')
-
-informationBtn.addEventListener('click', (event) => {
-  ipcRenderer.send('open-information-dialog')
-})
-
-ipcRenderer.on('information-dialog-selection', (event, index) => {
-  let message = 'You selected '
-  if (index === 0) message += 'yes.'
-  else message += 'no.'
-  document.getElementById('info-selection').innerHTML = message
-})
-            </code>
-          </pre>
-          <h5>Main Process</h5>
-          <pre>
-            <code>
-const {ipcMain, dialog} = require('electron')
-
-ipcMain.on('open-information-dialog', (event) => {
-  const options = {
-    type: 'info',
-    title: 'Information',
-    message: "This is an information dialog. Isn't it nice?",
-    buttons: ['Yes', 'No']
-  }
-  dialog.showMessageBox(options, (index) => {
-    event.sender.send('information-dialog-selection', index)
-  })
-})
-            </code>
-          </pre>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Information Dialog</title>
+  </head>
+
+  <body>
+    <div class="section-wrapper">
+      <h1>Use system dialogs</h1>
+
+      <h3>
+        The <code>dialog</code> module in Electron allows you to use native
+        system dialogs for opening files or directories, saving a file or
+        displaying informational messages.
+      </h3>
+
+      <p>
+        This is a main process module because this process is more efficient
+        with native utilities and it allows the call to happen without
+        interrupting the visible elements in your page's renderer process.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/dialog/">
+          full API documentation (opens in new window)
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Information Dialog</h2>
+        <div>
+          <div>
+            <button id="information-dialog">
+              View Demo
+            </button>
+            <span id="info-selection"></span>
+          </div>
+          <p>
+            In this demo, the <code>ipc</code> module is used to send a message
+            from the renderer process instructing the main process to launch the
+            information dialog. Options may be provided for responses which can
+            then be relayed back to the renderer process.
+          </p>
+
+          <p>
+            Note: The <code>title</code> property is not displayed in macOS.
+          </p>
+
+          <p>
+            An information dialog can contain an icon, your choice of buttons,
+            title and message.
+          </p>
+          <h5>Renderer Process</h5>
+          <pre>
+            <code>
+const {ipcRenderer} = require('electron')
+
+const informationBtn = document.getElementById('information-dialog')
+
+informationBtn.addEventListener('click', (event) => {
+  ipcRenderer.send('open-information-dialog')
+})
+
+ipcRenderer.on('information-dialog-selection', (event, index) => {
+  let message = 'You selected '
+  if (index === 0) message += 'yes.'
+  else message += 'no.'
+  document.getElementById('info-selection').innerHTML = message
+})
+            </code>
+          </pre>
+          <h5>Main Process</h5>
+          <pre>
+            <code>
+const {ipcMain, dialog} = require('electron')
+
+ipcMain.on('open-information-dialog', (event) => {
+  const options = {
+    type: 'info',
+    title: 'Information',
+    message: "This is an information dialog. Isn't it nice?",
+    buttons: ['Yes', 'No']
+  }
+  dialog.showMessageBox(options, (index) => {
+    event.sender.send('information-dialog-selection', index)
+  })
+})
+            </code>
+          </pre>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/native-ui/dialogs/open-file-or-directory/index.html

@@ -1,108 +1,108 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Open File or Directory</title>
-  </head>
-
-  <body>
-    <div class="section-wrapper">
-      <h1>Use system dialogs</h1>
-
-      <h3>
-        The <code>dialog</code> module in Electron allows you to use native
-        system dialogs for opening files or directories, saving a file or
-        displaying informational messages.
-      </h3>
-
-      <p>
-        This is a main process module because this process is more efficient
-        with native utilities and it allows the call to happen without
-        interrupting the visible elements in your page's renderer process.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/dialog/">
-          full API documentation (opens in new window)
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Open a File or Directory</h2>
-        <div>
-          <div>
-            <button id="select-directory">View Demo</button>
-            <span id="selected-file"></span>
-          </div>
-          <p>
-            In this demo, the <code>ipc</code> module is used to send a message
-            from the renderer process instructing the main process to launch the
-            open file (or directory) dialog. If a file is selected, the main
-            process can send that information back to the renderer process.
-          </p>
-          <h5>Renderer Process</h5>
-          <pre>
-          <code>
-const {ipcRenderer} = require('electron')
-
-const selectDirBtn = document.getElementById('select-directory')
-
-selectDirBtn.addEventListener('click', (event) => {
-  ipcRenderer.send('open-file-dialog')
-})
-
-ipcRenderer.on('selected-directory', (event, path) => {
-  document.getElementById('selected-file').innerHTML = `You selected: ${path}`
-})
-          </code>
-        </pre>
-          <h5>Main Process</h5>
-          <pre>
-          <code>
-const {ipcMain, dialog} = require('electron')
-
-ipcMain.on('open-file-dialog', (event) => {
-  dialog.showOpenDialog({
-    properties: ['openFile', 'openDirectory']
-  }, (files) => {
-    if (files) {
-      event.sender.send('selected-directory', files)
-    }
-  })
-})
-          </code>
-        </pre>
-
-          <div>
-            <h2>ProTip</h2>
-            <strong>The sheet-style dialog on macOS.</strong>
-            <p>
-              On macOS you can choose between a "sheet" dialog or a default
-              dialog. The sheet version descends from the top of the window. To
-              use sheet version, pass the <code>window</code> as the first
-              argument in the dialog method.
-            </p>
-            <pre><code class="language-js">const ipc = require('electron').ipcMain
-const dialog = require('electron').dialog
-const BrowserWindow = require('electron').BrowserWindow
-
-
-ipc.on('open-file-dialog-sheet', function (event) {
-  const window = BrowserWindow.fromWebContents(event.sender)
-  const files = dialog.showOpenDialog(window, { properties: [ 'openFile' ]})
-})</code></pre>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Open File or Directory</title>
+  </head>
+
+  <body>
+    <div class="section-wrapper">
+      <h1>Use system dialogs</h1>
+
+      <h3>
+        The <code>dialog</code> module in Electron allows you to use native
+        system dialogs for opening files or directories, saving a file or
+        displaying informational messages.
+      </h3>
+
+      <p>
+        This is a main process module because this process is more efficient
+        with native utilities and it allows the call to happen without
+        interrupting the visible elements in your page's renderer process.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/dialog/">
+          full API documentation (opens in new window)
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Open a File or Directory</h2>
+        <div>
+          <div>
+            <button id="select-directory">View Demo</button>
+            <span id="selected-file"></span>
+          </div>
+          <p>
+            In this demo, the <code>ipc</code> module is used to send a message
+            from the renderer process instructing the main process to launch the
+            open file (or directory) dialog. If a file is selected, the main
+            process can send that information back to the renderer process.
+          </p>
+          <h5>Renderer Process</h5>
+          <pre>
+          <code>
+const {ipcRenderer} = require('electron')
+
+const selectDirBtn = document.getElementById('select-directory')
+
+selectDirBtn.addEventListener('click', (event) => {
+  ipcRenderer.send('open-file-dialog')
+})
+
+ipcRenderer.on('selected-directory', (event, path) => {
+  document.getElementById('selected-file').innerHTML = `You selected: ${path}`
+})
+          </code>
+        </pre>
+          <h5>Main Process</h5>
+          <pre>
+          <code>
+const {ipcMain, dialog} = require('electron')
+
+ipcMain.on('open-file-dialog', (event) => {
+  dialog.showOpenDialog({
+    properties: ['openFile', 'openDirectory']
+  }, (files) => {
+    if (files) {
+      event.sender.send('selected-directory', files)
+    }
+  })
+})
+          </code>
+        </pre>
+
+          <div>
+            <h2>ProTip</h2>
+            <strong>The sheet-style dialog on macOS.</strong>
+            <p>
+              On macOS you can choose between a "sheet" dialog or a default
+              dialog. The sheet version descends from the top of the window. To
+              use sheet version, pass the <code>window</code> as the first
+              argument in the dialog method.
+            </p>
+            <pre><code class="language-js">const ipc = require('electron').ipcMain
+const dialog = require('electron').dialog
+const BrowserWindow = require('electron').BrowserWindow
+
+
+ipc.on('open-file-dialog-sheet', function (event) {
+  const window = BrowserWindow.fromWebContents(event.sender)
+  const files = dialog.showOpenDialog(window, { properties: [ 'openFile' ]})
+})</code></pre>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/native-ui/dialogs/save-dialog/index.html

@@ -1,91 +1,91 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Save Dialog</title>
-  </head>
-
-  <body>
-    <div>
-      <h1>Use system dialogs</h1>
-
-      <h3>
-        The <code>dialog</code> module in Electron allows you to use native
-        system dialogs for opening files or directories, saving a file or
-        displaying informational messages.
-      </h3>
-
-      <p>
-        This is a main process module because this process is more efficient
-        with native utilities and it allows the call to happen without
-        interrupting the visible elements in your page's renderer process.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/dialog/">
-          full API documentation (opens in new window)
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Save Dialog</h2>
-        <div>
-          <div>
-            <button button id="save-dialog">View Demo</button>
-            <span id="file-saved"></span>
-          </div>
-          <p>
-            In this demo, the <code>ipc</code> module is used to send a message
-            from the renderer process instructing the main process to launch the
-            save dialog. It returns the path selected by the user which can be
-            relayed back to the renderer process.
-          </p>
-          <h5>Renderer Process</h5>
-          <pre>
-            <code>
-const {ipcRenderer} = require('electron')
-
-const saveBtn = document.getElementById('save-dialog')
-
-saveBtn.addEventListener('click', (event) => {
-  ipcRenderer.send('save-dialog')
-})
-
-ipcRenderer.on('saved-file', (event, path) => {
-  if (!path) path = 'No path'
-  document.getElementById('file-saved').innerHTML = `Path selected: ${path}`
-})
-            </code>
-          </pre>
-          <h5>Main Process</h5>
-          <pre>
-            <code>
-const {ipcMain, dialog} = require('electron')
-
-ipcMain.on('save-dialog', (event) => {
-  const options = {
-    title: 'Save an Image',
-    filters: [
-      { name: 'Images', extensions: ['jpg', 'png', 'gif'] }
-    ]
-  }
-  dialog.showSaveDialog(options, (filename) => {
-    event.sender.send('saved-file', filename)
-  })
-})
-            </code>
-          </pre>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Save Dialog</title>
+  </head>
+
+  <body>
+    <div>
+      <h1>Use system dialogs</h1>
+
+      <h3>
+        The <code>dialog</code> module in Electron allows you to use native
+        system dialogs for opening files or directories, saving a file or
+        displaying informational messages.
+      </h3>
+
+      <p>
+        This is a main process module because this process is more efficient
+        with native utilities and it allows the call to happen without
+        interrupting the visible elements in your page's renderer process.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/dialog/">
+          full API documentation (opens in new window)
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Save Dialog</h2>
+        <div>
+          <div>
+            <button button id="save-dialog">View Demo</button>
+            <span id="file-saved"></span>
+          </div>
+          <p>
+            In this demo, the <code>ipc</code> module is used to send a message
+            from the renderer process instructing the main process to launch the
+            save dialog. It returns the path selected by the user which can be
+            relayed back to the renderer process.
+          </p>
+          <h5>Renderer Process</h5>
+          <pre>
+            <code>
+const {ipcRenderer} = require('electron')
+
+const saveBtn = document.getElementById('save-dialog')
+
+saveBtn.addEventListener('click', (event) => {
+  ipcRenderer.send('save-dialog')
+})
+
+ipcRenderer.on('saved-file', (event, path) => {
+  if (!path) path = 'No path'
+  document.getElementById('file-saved').innerHTML = `Path selected: ${path}`
+})
+            </code>
+          </pre>
+          <h5>Main Process</h5>
+          <pre>
+            <code>
+const {ipcMain, dialog} = require('electron')
+
+ipcMain.on('save-dialog', (event) => {
+  const options = {
+    title: 'Save an Image',
+    filters: [
+      { name: 'Images', extensions: ['jpg', 'png', 'gif'] }
+    ]
+  }
+  dialog.showSaveDialog(options, (filename) => {
+    event.sender.send('saved-file', filename)
+  })
+})
+            </code>
+          </pre>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/native-ui/drag-and-drop/index.html

@@ -1,76 +1,76 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Drag and drop files</title>
-  </head>
-
-  <body>
-    <div>
-      <h1>Drag and drop files</h1>
-      <div>Supports: Win, macOS, Linux <span>|</span> Process: Both</div>
-      <h3>
-        Electron supports dragging files and content out from web content into
-        the operating system's world.
-      </h3>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/tutorial/native-file-drag-drop">
-          full API documentation (opens in new window)
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Dragging files</h2>
-        <div>
-          <div>
-            <a href="#" id="drag-file-link">Drag Demo</a>
-          </div>
-          <p>
-            Click and drag the link above to copy the renderer process
-            javascript file on to your machine.
-          </p>
-
-          <p>
-            In this demo, the <code>webContents.startDrag()</code> API is called
-            in response to the <code>ondragstart</code> event.
-          </p>
-          <h5>Renderer Process</h5>
-          <pre><code>
-const {ipcRenderer} = require('electron')
-
-const dragFileLink = document.getElementById('drag-file-link')
-
-dragFileLink.addEventListener('dragstart', (event) => {
-  event.preventDefault()
-  ipcRenderer.send('ondragstart', __filename)
-})
-        </code></pre>
-          <h5>Main Process</h5>
-          <pre>
-            <code>
-const {ipcMain} = require('electron')
-const path = require('path')
-
-ipcMain.on('ondragstart', (event, filepath) => {
-  const iconName = 'codeIcon.png'
-  event.sender.startDrag({
-    file: filepath,
-    icon: path.join(__dirname, iconName)
-  })
-})
-            </code></pre>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Drag and drop files</title>
+  </head>
+
+  <body>
+    <div>
+      <h1>Drag and drop files</h1>
+      <div>Supports: Win, macOS, Linux <span>|</span> Process: Both</div>
+      <h3>
+        Electron supports dragging files and content out from web content into
+        the operating system's world.
+      </h3>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/tutorial/native-file-drag-drop">
+          full API documentation (opens in new window)
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Dragging files</h2>
+        <div>
+          <div>
+            <a href="#" id="drag-file-link">Drag Demo</a>
+          </div>
+          <p>
+            Click and drag the link above to copy the renderer process
+            javascript file on to your machine.
+          </p>
+
+          <p>
+            In this demo, the <code>webContents.startDrag()</code> API is called
+            in response to the <code>ondragstart</code> event.
+          </p>
+          <h5>Renderer Process</h5>
+          <pre><code>
+const {ipcRenderer} = require('electron')
+
+const dragFileLink = document.getElementById('drag-file-link')
+
+dragFileLink.addEventListener('dragstart', (event) => {
+  event.preventDefault()
+  ipcRenderer.send('ondragstart', __filename)
+})
+        </code></pre>
+          <h5>Main Process</h5>
+          <pre>
+            <code>
+const {ipcMain} = require('electron')
+const path = require('path')
+
+ipcMain.on('ondragstart', (event, filepath) => {
+  const iconName = 'codeIcon.png'
+  event.sender.startDrag({
+    file: filepath,
+    icon: path.join(__dirname, iconName)
+  })
+})
+            </code></pre>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/native-ui/external-links-file-manager/index.html

@@ -1,104 +1,104 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Open external links and the file manager</title>
-  </head>
-  <body>
-    <div>
-      <h1>
-        Open external links and the file manager
-      </h1>
-      <h3>
-        The <code>shell</code> module in Electron allows you to access certain
-        native elements like the file manager and default web browser.
-      </h3>
-
-      <p>This module works in both the main and renderer process.</p>
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/shell">
-          full API documentation (opens in new window)
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Open Path in File Manager</h2>
-        <div>
-          <div>
-            <button id="open-file-manager">
-              View Demo
-            </button>
-          </div>
-          <p>
-            This demonstrates using the <code>shell</code> module to open the
-            system file manager at a particular location.
-          </p>
-          <p>
-            Clicking the demo button will open your file manager at the root.
-          </p>
-        </div>
-      </div>
-    </div>
-
-    <div>
-      <div>
-        <h2>Open External Links</h2>
-        <div>
-          <div>
-            <button id="open-ex-links">View Demo</button>
-          </div>
-          <p>
-            If you do not want your app to open website links
-            <em>within</em> the app, you can use the <code>shell</code> module
-            to open them externally. When clicked, the links will open outside
-            of your app and in the user's default web browser.
-          </p>
-          <p>
-            When the demo button is clicked, the electron website will open in
-            your browser.
-          </p>
-          <p></p>
-
-          <div>
-            <h2>ProTip</h2>
-            <strong>Open all outbound links externally.</strong>
-            <p>
-              You may want to open all <code>http</code> and
-              <code>https</code> links outside of your app. To do this, query
-              the document and loop through each link and add a listener. This
-              app uses the code below which is located in
-              <code>assets/ex-links.js</code>.
-            </p>
-            <h5>Renderer Process</h5>
-            <pre>
-                <code>
-const shell = require('electron').shell
-
-const links = document.querySelectorAll('a[href]')
-
-Array.prototype.forEach.call(links, (link) => {
-  const url = link.getAttribute('href')
-  if (url.indexOf('http') === 0) {
-    link.addEventListener('click', (e) => {
-      e.preventDefault()
-      shell.openExternal(url)
-    })
-  }
-})
-                </code>
-              </pre>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Open external links and the file manager</title>
+  </head>
+  <body>
+    <div>
+      <h1>
+        Open external links and the file manager
+      </h1>
+      <h3>
+        The <code>shell</code> module in Electron allows you to access certain
+        native elements like the file manager and default web browser.
+      </h3>
+
+      <p>This module works in both the main and renderer process.</p>
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/shell">
+          full API documentation (opens in new window)
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Open Path in File Manager</h2>
+        <div>
+          <div>
+            <button id="open-file-manager">
+              View Demo
+            </button>
+          </div>
+          <p>
+            This demonstrates using the <code>shell</code> module to open the
+            system file manager at a particular location.
+          </p>
+          <p>
+            Clicking the demo button will open your file manager at the root.
+          </p>
+        </div>
+      </div>
+    </div>
+
+    <div>
+      <div>
+        <h2>Open External Links</h2>
+        <div>
+          <div>
+            <button id="open-ex-links">View Demo</button>
+          </div>
+          <p>
+            If you do not want your app to open website links
+            <em>within</em> the app, you can use the <code>shell</code> module
+            to open them externally. When clicked, the links will open outside
+            of your app and in the user's default web browser.
+          </p>
+          <p>
+            When the demo button is clicked, the electron website will open in
+            your browser.
+          </p>
+          <p></p>
+
+          <div>
+            <h2>ProTip</h2>
+            <strong>Open all outbound links externally.</strong>
+            <p>
+              You may want to open all <code>http</code> and
+              <code>https</code> links outside of your app. To do this, query
+              the document and loop through each link and add a listener. This
+              app uses the code below which is located in
+              <code>assets/ex-links.js</code>.
+            </p>
+            <h5>Renderer Process</h5>
+            <pre>
+                <code>
+const shell = require('electron').shell
+
+const links = document.querySelectorAll('a[href]')
+
+Array.prototype.forEach.call(links, (link) => {
+  const url = link.getAttribute('href')
+  if (url.indexOf('http') === 0) {
+    link.addEventListener('click', (e) => {
+      e.preventDefault()
+      shell.openExternal(url)
+    })
+  }
+})
+                </code>
+              </pre>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/native-ui/notifications/index.html

@@ -1,67 +1,67 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Desktop notifications</title>
-  </head>
-  <body>
-    <div>
-      <h1>Desktop notifications</h1>
-      <h3>
-        The <code>notification</code> module in Electron allows you to add basic
-        desktop notifications.
-      </h3>
-
-      <p>
-        Electron conveniently allows developers to send notifications with the
-        <a href="https://notifications.spec.whatwg.org/">HTML5 Notification API</a>,
-        using the currently running operating system’s native notification
-        APIs to display it.
-      </p>
-
-      <p>
-        <b>Note:</b> Since this is an HTML5 API it is only available in the
-        renderer process.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/all/#notifications-windows-linux-macos">
-          full API documentation<span>(opens in new window)</span>
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Basic notification</h2>
-        <div>
-          <div>
-            <button id="basic-noti">View demo</button>
-          </div>
-          <p>This demo demonstrates a basic notification. Text only.</p>
-        </div>
-      </div>
-    </div>
-
-    <div>
-      <div>
-        <h2>Notification with image</h2>
-        <div>
-          <div>
-            <button id="advanced-noti">View demo</button>
-          </div>
-          <p>
-            This demo demonstrates a basic notification. Both text and a image
-          </p>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Desktop notifications</title>
+  </head>
+  <body>
+    <div>
+      <h1>Desktop notifications</h1>
+      <h3>
+        The <code>notification</code> module in Electron allows you to add basic
+        desktop notifications.
+      </h3>
+
+      <p>
+        Electron conveniently allows developers to send notifications with the
+        <a href="https://notifications.spec.whatwg.org/">HTML5 Notification API</a>,
+        using the currently running operating system’s native notification
+        APIs to display it.
+      </p>
+
+      <p>
+        <b>Note:</b> Since this is an HTML5 API it is only available in the
+        renderer process.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/all/#notifications-windows-linux-macos">
+          full API documentation<span>(opens in new window)</span>
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Basic notification</h2>
+        <div>
+          <div>
+            <button id="basic-noti">View demo</button>
+          </div>
+          <p>This demo demonstrates a basic notification. Text only.</p>
+        </div>
+      </div>
+    </div>
+
+    <div>
+      <div>
+        <h2>Notification with image</h2>
+        <div>
+          <div>
+            <button id="advanced-noti">View demo</button>
+          </div>
+          <p>
+            This demo demonstrates a basic notification. Both text and a image
+          </p>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/native-ui/tray/index.html

@@ -1,47 +1,47 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Tray</title>
-  </head>
-  <body>
-    <div>
-      <h1>Tray</h1>
-      <h3>
-        The <code>tray</code> module allows you to create an icon in the
-        operating system's notification area.
-      </h3>
-      <p>This icon can also have a context menu attached.</p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/tray">
-          full API documentation
-        </a>
-        in your browser.
-      </p>
-    </div>
-      <div>
-          <div>
-            <h2>ProTip</h2>
-            <strong>Tray support in Linux.</strong>
-            <p>
-              On Linux distributions that only have app indicator support, users
-              will need to install <code>libappindicator1</code> to make the
-              tray icon work. See the
-              <a href="https://electronjs.org/docs/api/tray">
-                full API documentation
-              </a>
-              for more details about using Tray on Linux.
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Tray</title>
+  </head>
+  <body>
+    <div>
+      <h1>Tray</h1>
+      <h3>
+        The <code>tray</code> module allows you to create an icon in the
+        operating system's notification area.
+      </h3>
+      <p>This icon can also have a context menu attached.</p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/tray">
+          full API documentation
+        </a>
+        in your browser.
+      </p>
+    </div>
+      <div>
+          <div>
+            <h2>ProTip</h2>
+            <strong>Tray support in Linux.</strong>
+            <p>
+              On Linux distributions that only have app indicator support, users
+              will need to install <code>libappindicator1</code> to make the
+              tray icon work. See the
+              <a href="https://electronjs.org/docs/api/tray">
+                full API documentation
+              </a>
+              for more details about using Tray on Linux.
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/windows/manage-windows/frameless-window/index.html

@@ -1,77 +1,77 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Frameless window</title>
-  </head>
-
-  <body>
-    <div>
-      <h1>Create and Manage Windows</h1>
-
-      <h3>
-        The <code>BrowserWindow</code> module in Electron allows you to create a
-        new browser window or manage an existing one.
-      </h3>
-
-      <p>
-        Each browser window is a separate process, known as the renderer
-        process. This process, like the main process that controls the life
-        cycle of the app, has full access to the Node.js APIs.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/browser-window">
-          full API documentation (opens in new window)
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Create a frameless window</h2>
-        <div>
-          <div>
-            <button id="frameless-window">View Demo</button>
-          </div>
-          <p>
-            A frameless window is a window that has no
-            <a href="https://developer.mozilla.org/en-US/docs/Glossary/Chrome">
-              "chrome"
-            </a>
-            , such as toolbars, title bars, status bars, borders, etc. You can
-            make a browser window frameless by setting <code>frame</code> to
-            <code>false</code> when creating the window.
-          </p>
-
-          <p>
-            Windows can have a transparent background, too. By setting the
-            <code>transparent</code> option to <code>true</code>, you can also
-            make your frameless window transparent:
-          </p>
-          <pre>
-<code class="language-js">var win = new BrowserWindow({
-  transparent: true,
-  frame: false
-})</code></pre>
-
-          <p>
-            For more details, see the
-            <a href="https://electronjs.org/docs/tutorial/window-customization/">
-              Window Customization
-
-            </a>
-            documentation.
-          </p>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Frameless window</title>
+  </head>
+
+  <body>
+    <div>
+      <h1>Create and Manage Windows</h1>
+
+      <h3>
+        The <code>BrowserWindow</code> module in Electron allows you to create a
+        new browser window or manage an existing one.
+      </h3>
+
+      <p>
+        Each browser window is a separate process, known as the renderer
+        process. This process, like the main process that controls the life
+        cycle of the app, has full access to the Node.js APIs.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/browser-window">
+          full API documentation (opens in new window)
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Create a frameless window</h2>
+        <div>
+          <div>
+            <button id="frameless-window">View Demo</button>
+          </div>
+          <p>
+            A frameless window is a window that has no
+            <a href="https://developer.mozilla.org/en-US/docs/Glossary/Chrome">
+              "chrome"
+            </a>
+            , such as toolbars, title bars, status bars, borders, etc. You can
+            make a browser window frameless by setting <code>frame</code> to
+            <code>false</code> when creating the window.
+          </p>
+
+          <p>
+            Windows can have a transparent background, too. By setting the
+            <code>transparent</code> option to <code>true</code>, you can also
+            make your frameless window transparent:
+          </p>
+          <pre>
+<code class="language-js">var win = new BrowserWindow({
+  transparent: true,
+  frame: false
+})</code></pre>
+
+          <p>
+            For more details, see the
+            <a href="https://electronjs.org/docs/tutorial/window-customization/">
+              Window Customization
+
+            </a>
+            documentation.
+          </p>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/windows/manage-windows/manage-window-state/index.html

@@ -1,64 +1,64 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Manage window state</title>
-  </head>
-
-  <body>
-    <div>
-      <h1>Create and Manage Windows</h1>
-
-      <h3>
-        The <code>BrowserWindow</code> module in Electron allows you to create a
-        new browser window or manage an existing one.
-      </h3>
-
-      <p>
-        Each browser window is a separate process, known as the renderer
-        process. This process, like the main process that controls the life
-        cycle of the app, has full access to the Node.js APIs.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/browser-window">
-          full API documentation (opens in new window)
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Manage window state</h2>
-        <div>
-          <div>
-            <button id="manage-window">View Demo</button>
-            <span id="manage-window-reply"></span>
-          </div>
-          <p>
-            In this demo we create a new window and listen for
-            <code>move</code> and <code>resize</code> events on it. Click the
-            demo button, change the new window and see the dimensions and
-            position update here, above.
-          </p>
-          <p>
-            There are a lot of methods for controlling the state of the window
-            such as the size, location, and focus status as well as events to
-            listen to for window changes. Visit the
-            <a href="https://electronjs.org/docs/api/browser-window">
-              documentation (opens in new window)
-            </a>
-            for the full list.
-          </p>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Manage window state</title>
+  </head>
+
+  <body>
+    <div>
+      <h1>Create and Manage Windows</h1>
+
+      <h3>
+        The <code>BrowserWindow</code> module in Electron allows you to create a
+        new browser window or manage an existing one.
+      </h3>
+
+      <p>
+        Each browser window is a separate process, known as the renderer
+        process. This process, like the main process that controls the life
+        cycle of the app, has full access to the Node.js APIs.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/browser-window">
+          full API documentation (opens in new window)
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Manage window state</h2>
+        <div>
+          <div>
+            <button id="manage-window">View Demo</button>
+            <span id="manage-window-reply"></span>
+          </div>
+          <p>
+            In this demo we create a new window and listen for
+            <code>move</code> and <code>resize</code> events on it. Click the
+            demo button, change the new window and see the dimensions and
+            position update here, above.
+          </p>
+          <p>
+            There are a lot of methods for controlling the state of the window
+            such as the size, location, and focus status as well as events to
+            listen to for window changes. Visit the
+            <a href="https://electronjs.org/docs/api/browser-window">
+              documentation (opens in new window)
+            </a>
+            for the full list.
+          </p>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/fiddles/windows/manage-windows/window-events/index.html

@@ -1,58 +1,58 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Window events</title>
-  </head>
-
-  <body>
-    <div>
-      <h1>Create and Manage Windows</h1>
-
-      <h3>
-        The <code>BrowserWindow</code> module in Electron allows you to create a
-        new browser window or manage an existing one.
-      </h3>
-
-      <p>
-        Each browser window is a separate process, known as the renderer
-        process. This process, like the main process that controls the life
-        cycle of the app, has full access to the Node.js APIs.
-      </p>
-
-      <p>
-        Open the
-        <a href="https://electronjs.org/docs/api/browser-window">
-          full API documentation (opens in new window)
-        </a>
-        in your browser.
-      </p>
-    </div>
-
-    <div>
-      <div>
-        <h2>Window events</h2>
-        <div>
-          <div>
-            <button id="listen-to-window">View Demo</button>
-            <button id="focus-on-modal-window">
-              Focus on Demo
-            </button>
-          </div>
-          <p>
-            In this demo, we create a new window and listen for
-            <code>blur</code> event on it. Click the demo button to create a new
-            modal window, and switch focus back to the parent window by clicking
-            on it. You can click the <i>Focus on Demo</i> button to switch focus
-            to the modal window again.
-          </p>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      // You can also require other files to run in this process
-      require("./renderer.js");
-    </script>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Window events</title>
+  </head>
+
+  <body>
+    <div>
+      <h1>Create and Manage Windows</h1>
+
+      <h3>
+        The <code>BrowserWindow</code> module in Electron allows you to create a
+        new browser window or manage an existing one.
+      </h3>
+
+      <p>
+        Each browser window is a separate process, known as the renderer
+        process. This process, like the main process that controls the life
+        cycle of the app, has full access to the Node.js APIs.
+      </p>
+
+      <p>
+        Open the
+        <a href="https://electronjs.org/docs/api/browser-window">
+          full API documentation (opens in new window)
+        </a>
+        in your browser.
+      </p>
+    </div>
+
+    <div>
+      <div>
+        <h2>Window events</h2>
+        <div>
+          <div>
+            <button id="listen-to-window">View Demo</button>
+            <button id="focus-on-modal-window">
+              Focus on Demo
+            </button>
+          </div>
+          <p>
+            In this demo, we create a new window and listen for
+            <code>blur</code> event on it. Click the demo button to create a new
+            modal window, and switch focus back to the parent window by clicking
+            on it. You can click the <i>Focus on Demo</i> button to switch focus
+            to the modal window again.
+          </p>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      // You can also require other files to run in this process
+      require("./renderer.js");
+    </script>
+  </body>
+</html>

docs/glossary.md

@@ -234,7 +234,7 @@ embedded content.
 [context isolation]: tutorial/context-isolation.md
 [mac app store submission guide]: tutorial/mac-app-store-submission-guide.md
 [main]: #main-process
-[msi]: https://docs.microsoft.com/en-us/windows/win32/msi/windows-installer-portal
+[msi]: https://learn.microsoft.com/en-us/windows/win32/msi/windows-installer-portal
 [Native Node Modules]: tutorial/using-native-node-modules.md
 [offscreen rendering]: tutorial/offscreen-rendering.md
 [process sandboxing]: tutorial/sandbox.md

docs/tutorial/boilerplates-and-clis.md

@@ -21,8 +21,8 @@ can clone and customize to your heart's content.
 
 A command line tool on the other hand continues to support you throughout the
 development and release. They are more helpful and supportive but enforce
-guidelines on how your code should be structured and built. *Especially for
-beginners, using a command line tool is likely to be helpful*.
+guidelines on how your code should be structured and built. _Especially for
+beginners, using a command line tool is likely to be helpful_.
 
 ## Electron Forge
 

docs/tutorial/code-signing.md

@@ -95,7 +95,7 @@ Before signing Windows builds, you must do the following:
 You can get a code signing certificate from a lot of resellers. Prices vary, so
 it may be worth your time to shop around. Popular resellers include:
 
-- [digicert](https://www.digicert.com/code-signing/microsoft-authenticode.htm)
+- [digicert](https://www.digicert.com/dc/code-signing/microsoft-authenticode.htm)
 - [Sectigo](https://sectigo.com/ssl-certificates-tls/code-signing)
 - Amongst others, please shop around to find one that suits your needs! 😄
 
@@ -200,4 +200,4 @@ See the [Windows Store Guide][].
 [windows store guide]: ./windows-store-guide.md
 [maker-squirrel]: https://www.electronforge.io/config/makers/squirrel.windows
 [maker-msi]: https://www.electronforge.io/config/makers/wix-msi
-[signtool.exe]: https://docs.microsoft.com/en-us/dotnet/framework/tools/signtool-exe
+[signtool.exe]: https://learn.microsoft.com/en-us/dotnet/framework/tools/signtool-exe

docs/tutorial/electron-timelines.md

@@ -65,7 +65,7 @@ the Electron team will drop support back to the latest three stable major versio
 
 :::
 
-The latest three *stable* major versions are supported by the Electron team.
+The latest three _stable_ major versions are supported by the Electron team.
 For example, if the latest release is 6.1.x, then the 5.0.x as well
 as the 4.2.x series are supported. We only support the latest minor release
 for each stable release series. This means that in the case of a security fix,

docs/tutorial/electron-versioning.md

@@ -143,7 +143,7 @@ The `electron/electron` repository also enforces squash merging, so you only nee
 
 ## Historical versioning (Electron 1.X)
 
-Electron versions *< 2.0* did not conform to the [SemVer](https://semver.org) spec: major versions corresponded to end-user API changes, minor versions corresponded to Chromium major releases, and patch versions corresponded to new features and bug fixes. While convenient for developers merging features, it creates problems for developers of client-facing applications. The QA testing cycles of major apps like Slack, Teams, Skype, VS Code, and GitHub Desktop can be lengthy and stability is a highly desired outcome. There is a high risk in adopting new features while trying to absorb bug fixes.
+Electron versions _< 2.0_ did not conform to the [SemVer](https://semver.org) spec: major versions corresponded to end-user API changes, minor versions corresponded to Chromium major releases, and patch versions corresponded to new features and bug fixes. While convenient for developers merging features, it creates problems for developers of client-facing applications. The QA testing cycles of major apps like Slack, Teams, Skype, VS Code, and GitHub Desktop can be lengthy and stability is a highly desired outcome. There is a high risk in adopting new features while trying to absorb bug fixes.
 
 Here is an example of the 1.x strategy:
 

docs/tutorial/macos-dock.md

@@ -15,7 +15,7 @@ icon as the entry point for cross-platform features like
 The custom dock is commonly used to add shortcuts to tasks the user wouldn't
 want to open the whole app window for.
 
-__Dock menu of Terminal.app:__
+**Dock menu of Terminal.app:**
 
 ![Dock Menu][dock-menu-image]
 

docs/tutorial/notifications.md

@@ -1,98 +1,108 @@
 # Notifications
 
-## Overview
+Each operating system has its own mechanism to display notifications to users. Electron's notification
+APIs are cross-platform, but are different for each process type.
 
-All three operating systems provide means for applications to send
-notifications to the user. The technique of showing notifications is different
-for the Main and Renderer processes.
+If you want to use a renderer process API in the main process or vice-versa, consider using
+[inter-process communication](./ipc.md).
 
-For the Renderer process, Electron conveniently allows developers to send
-notifications with the [HTML5 Notification API](https://notifications.spec.whatwg.org/),
-using the currently running operating system's native notification APIs
-to display it.
+## Usage
 
-To show notifications in the Main process, you need to use the
-[Notification](../api/notification.md) module.
+Below are two examples showing how to display notifications for each process type.
 
-## Example
+### Show notifications in the main process
 
-### Show notifications in the Renderer process
+Main process notifications are displayed using Electron's [Notification module](../api/notification.md).
+Notification objects created using this module do not appear unless their `show()` instance
+method is called.
 
-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:
+```js title='Main Process'
+const { Notification } = require("electron");
 
-```html
-<script src="renderer.js"></script>
+const NOTIFICATION_TITLE = "Basic Notification";
+const NOTIFICATION_BODY = "Notification from the Main process";
+
+new Notification({
+  title: NOTIFICATION_TITLE,
+  body: NOTIFICATION_BODY,
+}).show();
 ```
 
-...and add the `renderer.js` file:
-
-```javascript fiddle='docs/fiddles/features/notifications/renderer'
-const NOTIFICATION_TITLE = 'Title'
-const NOTIFICATION_BODY = 'Notification from the Renderer process. Click to log to console.'
-const CLICK_MESSAGE = '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)
-
-Additionally, if you click on the notification, the DOM will update to show "Notification clicked!".
-
-### Show notifications in the Main process
-
-Starting with a working application from the
-[Quick Start Guide](quick-start.md), update the `main.js` file with the following lines:
+Here's a full example that you can open with Electron Fiddle:
 
 ```javascript fiddle='docs/fiddles/features/notifications/main'
-const { Notification } = require('electron')
+const { Notification } = require("electron");
 
-const NOTIFICATION_TITLE = 'Basic Notification'
-const NOTIFICATION_BODY = 'Notification from the Main process'
+const NOTIFICATION_TITLE = "Basic Notification";
+const NOTIFICATION_BODY = "Notification from the Main process";
 
-const showNotification = () => {
-  new Notification({ title: NOTIFICATION_TITLE, body: NOTIFICATION_BODY }).show()
-}
-
-app.whenReady().then(createWindow).then(showNotification)
+new Notification({
+  title: NOTIFICATION_TITLE,
+  body: NOTIFICATION_BODY,
+}).show();
 ```
 
-After launching the Electron application, you should see the system notification:
+### Show notifications in the renderer process
 
-![Notification in the Main process](../images/notification-main.png)
+Notifications can be displayed directly from the renderer process with the
+[web Notifications API](https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API/Using_the_Notifications_API).
 
-## Additional information
+```js title='Renderer Process'
+const NOTIFICATION_TITLE = "Title";
+const NOTIFICATION_BODY =
+  "Notification from the Renderer process. Click to log to console.";
+const CLICK_MESSAGE = "Notification clicked";
+
+new Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY }).onclick =
+  () => console.log(CLICK_MESSAGE);
+```
+
+Here's a full example that you can open with Electron Fiddle:
+
+```javascript fiddle='docs/fiddles/features/notifications/renderer'
+const NOTIFICATION_TITLE = "Title";
+const NOTIFICATION_BODY =
+  "Notification from the Renderer process. Click to log to console.";
+const CLICK_MESSAGE = "Notification clicked";
+
+new Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY }).onclick =
+  () => console.log(CLICK_MESSAGE);
+```
+
+## Platform considerations
 
 While code and user experience across operating systems are similar, there
 are subtle differences.
 
 ### Windows
 
-* On Windows 10, a shortcut to your app with an
-[Application User Model ID][app-user-model-id] must be installed to the
-Start Menu. This can be overkill during development, so adding
-`node_modules\electron\dist\electron.exe` to your Start Menu also does the
-trick. Navigate to the file in Explorer, right-click and 'Pin to Start Menu'.
-You will then need to add the line `app.setAppUserModelId(process.execPath)` to
-your main process to see notifications.
+For notifications on Windows, your Electron app needs to have a Start Menu shortcut with an
+[AppUserModelID][app-user-model-id] and a corresponding [ToastActivatorCLSID][toast-activator-clsid].
 
-Electron attempts to automate the work around the Application User Model ID. When
-Electron is used together with the installation and update framework Squirrel,
-[shortcuts will automatically be set correctly][squirrel-events]. Furthermore,
-Electron will detect that Squirrel was used and will automatically call
+Electron attempts to automate the work around the AppUserModelID and ToastActivatorCLSID. When
+Electron is used together with Squirrel.Windows (e.g. if you're using electron-winstaller),
+[shortcuts will automatically be set correctly][squirrel-events].
+
+In production, Electron will also detect that Squirrel was used and will automatically call
 `app.setAppUserModelId()` with the correct value. During development, you may have
 to call [`app.setAppUserModelId()`][set-app-user-model-id] yourself.
 
-#### Advanced Notifications
+:::info Notifications in development
 
-Later versions of Windows allow for advanced notifications, with custom templates,
-images, and other flexible elements. To send those notifications (from either the
-main process or the renderer process), use the userland module
-[electron-windows-notifications](https://github.com/felixrieseberg/electron-windows-notifications),
+To quickly bootstrap notifications during development, adding
+`node_modules\electron\dist\electron.exe` to your Start Menu also does the
+trick. Navigate to the file in Explorer, right-click and 'Pin to Start Menu'.
+Then, call `app.setAppUserModelId(process.execPath)` in the main process to see notifications.
+
+:::
+
+#### Use advanced notifications
+
+Windows also allow for advanced notifications with custom templates, images, and other flexible
+elements.
+
+To send those notifications from the main process, you can use the userland module
+[`electron-windows-notifications`](https://github.com/felixrieseberg/electron-windows-notifications),
 which uses native Node addons to send `ToastNotification` and `TileNotification` objects.
 
 While notifications including buttons work with `electron-windows-notifications`,
@@ -101,41 +111,41 @@ handling replies requires the use of
 which helps with registering the required COM components and calling your
 Electron app with the entered user data.
 
-#### Quiet Hours / Presentation Mode
+#### Query notification state
 
 To detect whether or not you're allowed to send a notification, use the
-userland module [electron-notification-state](https://github.com/felixrieseberg/electron-notification-state).
+userland module [`windows-notification-state`][windows-notification-state].
 
-This allows you to determine ahead of time whether or not Windows will
-silently throw the notification away.
+This module allows you to determine ahead of time whether or not Windows will silently throw the
+notification away.
 
 ### macOS
 
-Notifications are straight-forward on macOS, but you should be aware of
+Notifications are straightforward on macOS, but you should be aware of
 [Apple's Human Interface guidelines regarding notifications][apple-notification-guidelines].
 
 Note that notifications are limited to 256 bytes in size and will be truncated
 if you exceed that limit.
 
-[apple-notification-guidelines]: https://developer.apple.com/macos/human-interface-guidelines/system-capabilities/notifications/
-
-#### Do not disturb / Session State
+#### Query notification state
 
 To detect whether or not you're allowed to send a notification, use the userland module
-[electron-notification-state][electron-notification-state].
+[`macos-notification-state`][macos-notification-state].
 
-This will allow you to detect ahead of time whether or not the notification will be displayed.
-
-[electron-notification-state]: https://github.com/felixrieseberg/electron-notification-state
+This module allows you to detect ahead of time whether or not the notification will be displayed.
 
 ### Linux
 
-Notifications are sent using `libnotify` which can show notifications on any
+Notifications are sent using `libnotify`, which can show notifications on any
 desktop environment that follows [Desktop Notifications
 Specification][notification-spec], including Cinnamon, Enlightenment, Unity,
-GNOME, KDE.
+GNOME, and KDE.
 
 [notification-spec]: https://developer-old.gnome.org/notification-spec/
-[app-user-model-id]: https://msdn.microsoft.com/en-us/library/windows/desktop/dd378459(v=vs.85).aspx
+[app-user-model-id]: https://learn.microsoft.com/en-us/windows/win32/shell/appids
 [set-app-user-model-id]: ../api/app.md#appsetappusermodelidid-windows
 [squirrel-events]: https://github.com/electron/windows-installer/blob/main/README.md#handling-squirrel-events
+[toast-activator-clsid]: https://learn.microsoft.com/en-us/windows/win32/properties/props-system-appusermodel-toastactivatorclsid
+[apple-notification-guidelines]: https://developer.apple.com/macos/human-interface-guidelines/system-capabilities/notifications/
+[windows-notification-state]: https://github.com/felixrieseberg/windows-notification-state
+[macos-notification-state]: https://github.com/felixrieseberg/macos-notification-state

docs/tutorial/offscreen-rendering.md

@@ -8,7 +8,7 @@ The offscreen rendering in Electron uses a similar approach to that of the
 [Chromium Embedded Framework](https://bitbucket.org/chromiumembedded/cef)
 project.
 
-*Notes*:
+_Notes_:
 
 * There are two rendering modes that can be used (see the section below) and only
 the dirty area is passed to the `paint` event to be more efficient.

docs/tutorial/performance.md

@@ -295,13 +295,13 @@ browsers apply to Electron's renderers, too. The two primary tools at your
 disposal  are currently `requestIdleCallback()` for small operations and
 `Web Workers` for long-running operations.
 
-*`requestIdleCallback()`* allows developers to queue up a function to be
+_`requestIdleCallback()`_ allows developers to queue up a function to be
 executed as soon as the process is entering an idle period. It enables you to
 perform low-priority or background work without impacting the user experience.
 For more information about how to use it,
 [check out its documentation on MDN][request-idle-callback].
 
-*Web Workers* are a powerful tool to run code on a separate thread. There are
+_Web Workers_ are a powerful tool to run code on a separate thread. There are
 some caveats to consider – consult Electron's
 [multithreading documentation][multithreading] and the
 [MDN documentation for Web Workers][web-workers]. They're an ideal solution

docs/tutorial/recent-documents.md

@@ -12,11 +12,11 @@ hide_title: true
 Windows and macOS provide access to a list of recent documents opened by
 the application via JumpList or dock menu, respectively.
 
-__JumpList:__
+**JumpList:**
 
 ![JumpList Recent Files][jumplist-image]
 
-__Application dock menu:__
+**Application dock menu:**
 
 ![macOS Dock Menu][dock-menu-image]
 
@@ -138,5 +138,5 @@ of `app` module will be emitted for it.
 [dock-menu-image]: https://cloud.githubusercontent.com/assets/639601/5069610/2aa80758-6e97-11e4-8cfb-c1a414a10774.png
 [addrecentdocument]: ../api/app.md#appaddrecentdocumentpath-macos-windows
 [clearrecentdocuments]: ../api/app.md#appclearrecentdocuments-macos-windows
-[app-registration]: https://msdn.microsoft.com/en-us/library/cc144104(VS.85).aspx
+[app-registration]: https://learn.microsoft.com/en-us/windows/win32/shell/app-registration
 [menu-item-image]: https://user-images.githubusercontent.com/3168941/33003655-ea601c3a-cd70-11e7-97fa-7c062149cfb1.png

docs/tutorial/sandbox.md

@@ -84,7 +84,7 @@ the `sandbox: false` preference in the [`BrowserWindow`][browser-window] constru
 app.whenReady().then(() => {
   const win = new BrowserWindow({
     webPreferences: {
-      sandbox: true
+      sandbox: false
     }
   })
   win.loadURL('https://google.com')

docs/tutorial/security.md

@@ -44,7 +44,7 @@ your responsibility to ensure that the code is not malicious.
 
 It is important to remember that the security of your Electron application is
 the result of the overall security of the framework foundation
-(*Chromium*, *Node.js*), Electron itself, all NPM dependencies and
+(_Chromium_, _Node.js_), Electron itself, all NPM dependencies and
 your code. As such, it is your responsibility to follow a few important best
 practices:
 
@@ -52,7 +52,7 @@ practices:
 When releasing your product, you’re also shipping a bundle composed of Electron,
 Chromium shared library and Node.js. Vulnerabilities affecting these components
 may impact the security of your application. By updating Electron to the latest
-version, you ensure that critical vulnerabilities (such as *nodeIntegration bypasses*)
+version, you ensure that critical vulnerabilities (such as _nodeIntegration bypasses_)
 are already patched and cannot be exploited in your application. For more information,
 see "[Use a current version of Electron](#16-use-a-current-version-of-electron)".
 

docs/tutorial/tutorial-2-first-app.md

@@ -81,10 +81,13 @@ the exact dependency versions to install.
   "version": "1.0.0",
   "description": "Hello World!",
   "main": "main.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
   "author": "Jane Doe",
   "license": "MIT",
   "devDependencies": {
-    "electron": "19.0.0"
+    "electron": "23.1.3"
   }
 }
 ```
@@ -137,13 +140,14 @@ script in the current directory and run it in dev mode.
   "version": "1.0.0",
   "description": "Hello World!",
   "main": "main.js",
+  "scripts": {
+    "start": "electron .",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
   "author": "Jane Doe",
   "license": "MIT",
-  "scripts": {
-    "start": "electron ."
-  },
   "devDependencies": {
-    "electron": "^19.0.0"
+    "electron": "23.1.3"
   }
 }
 ```
@@ -465,7 +469,7 @@ privileged APIs and how to communicate between processes.
 [repl]: ./repl.md
 [webpack]: https://webpack.js.org
 [window-all-closed]: ../api/app.md#event-window-all-closed
-[wsl]: https://docs.microsoft.com/en-us/windows/wsl/about#what-is-wsl-2
+[wsl]: https://learn.microsoft.com/en-us/windows/wsl/about#what-is-wsl-2
 
 <!-- Tutorial links -->
 

docs/tutorial/tutorial-6-publishing-updating.md

@@ -231,7 +231,7 @@ rest of our docs and happy developing! If you have questions, please stop by our
 [new-pat]: https://github.com/settings/tokens/new
 [publish command]: https://www.electronforge.io/cli#publish
 [publisher]: https://www.electronforge.io/config/publishers
-[`publishergithubconfig`]: https://js.electronforge.io/publisher/github/interfaces/publishergithubconfig
+[`publishergithubconfig`]: https://js.electronforge.io/interfaces/_electron_forge_publisher_github.PublisherGitHubConfig.html
 [`update-electron-app`]: https://github.com/electron/update-electron-app
 [update-server]: ./updates.md
 

docs/tutorial/using-native-node-modules.md

@@ -21,17 +21,17 @@ There are several different ways to install native modules:
 ### Installing modules and rebuilding for Electron
 
 You can install modules like other Node projects, and then rebuild the modules
-for Electron with the [`electron-rebuild`][electron-rebuild] package. This
+for Electron with the [`@electron/rebuild`][@electron/rebuild] package. This
 module can automatically determine the version of Electron and handle the
 manual steps of downloading headers and rebuilding native modules for your app.
 If you are using [Electron Forge][electron-forge], this tool is used automatically
 in both development mode and when making distributables.
 
-For example, to install the standalone `electron-rebuild` tool and then rebuild
+For example, to install the standalone `@electron/rebuild` tool and then rebuild
 modules with it via the command line:
 
 ```sh
-npm install --save-dev electron-rebuild
+npm install --save-dev @electron/rebuild
 
 # Every time you run "npm install", run this:
 ./node_modules/.bin/electron-rebuild
@@ -53,8 +53,7 @@ For example, to install all dependencies for Electron:
 ```sh
 # Electron's version.
 export npm_config_target=1.2.3
-# The architecture of Electron, see https://electronjs.org/docs/tutorial/support#supported-platforms
-# for supported architectures.
+# The architecture of your machine
 export npm_config_arch=x64
 export npm_config_target_arch=x64
 # Download headers for Electron.
@@ -98,7 +97,7 @@ npm rebuild --nodedir=/path/to/src/out/Default/gen/node_headers
 If you installed a native module and found it was not working, you need to check
 the following things:
 
-* When in doubt, run `electron-rebuild` first.
+* When in doubt, run `@electron/rebuild` first.
 * Make sure the native module is compatible with the target platform and
   architecture for your Electron app.
 * Make sure `win_delay_load_hook` is not set to `false` in the module's `binding.gyp`.
@@ -110,7 +109,7 @@ On Windows, by default, `node-gyp` links native modules against `node.dll`.
 However, in Electron 4.x and higher, the symbols needed by native modules are
 exported by `electron.exe`, and there is no `node.dll`. In order to load native
 modules on Windows, `node-gyp` installs a [delay-load
-hook](https://msdn.microsoft.com/en-us/library/z9h1h6ty.aspx) that triggers
+hook](https://learn.microsoft.com/en-us/cpp/build/reference/error-handling-and-notification?view=msvc-170#notification-hooks) that triggers
 when the native module is loaded, and redirects the `node.dll` reference to use
 the loading executable instead of looking for `node.dll` in the library search
 path (which would turn up nothing). As such, on Electron 4.x and higher,
@@ -161,14 +160,14 @@ modules with prebuilt binaries, and many popular modules are using it.
 
 Sometimes those modules work fine under Electron, but when there are no
 Electron-specific binaries available, you'll need to build from source.
-Because of this, it is recommended to use `electron-rebuild` for these modules.
+Because of this, it is recommended to use `@electron/rebuild` for these modules.
 
 If you are following the `npm` way of installing modules, you'll need to pass
 `--build-from-source` to `npm`, or set the `npm_config_build_from_source`
 environment variable.
 
 [abi]: https://en.wikipedia.org/wiki/Application_binary_interface
-[electron-rebuild]: https://github.com/electron/electron-rebuild
+[@electron/rebuild]: https://github.com/electron/rebuild
 [electron-forge]: https://electronforge.io/
 [electron-packager]: https://github.com/electron/electron-packager
 [node-pre-gyp]: https://github.com/mapbox/node-pre-gyp

docs/tutorial/windows-arm.md

@@ -88,7 +88,7 @@ After completing all of the above, open your cross-compilation command prompt an
 
 ## Debugging native modules
 
-Debugging native modules can be done with Visual Studio 2017 (running on your development machine) and corresponding [Visual Studio Remote Debugger](https://docs.microsoft.com/en-us/visualstudio/debugger/remote-debugging-cpp?view=vs-2019) running on the target device. To debug:
+Debugging native modules can be done with Visual Studio 2017 (running on your development machine) and corresponding [Visual Studio Remote Debugger](https://learn.microsoft.com/en-us/visualstudio/debugger/remote-debugging-cpp?view=vs-2019) running on the target device. To debug:
 
 1. Launch your app `.exe` on the target device via the _Command Prompt_ (passing `--inspect-brk` to pause it before any native modules are loaded).
 2. Launch Visual Studio 2017 on your development machine.

docs/tutorial/windows-taskbar.md

@@ -89,7 +89,7 @@ app.setUserTasks([])
 > NOTE: The user tasks will still be displayed even after closing your
 application, so the icon and program path specified for a task should exist until your application is uninstalled.
 
-[msdn-jumplist]: https://docs.microsoft.com/en-us/windows/win32/shell/taskbar-extensions#tasks
+[msdn-jumplist]: https://learn.microsoft.com/en-us/windows/win32/shell/taskbar-extensions#tasks
 
 ### Thumbnail Toolbars
 
@@ -156,7 +156,7 @@ const win = new BrowserWindow()
 win.setThumbarButtons([])
 ```
 
-[msdn-thumbnail]: https://docs.microsoft.com/en-us/windows/win32/shell/taskbar-extensions#thumbnail-toolbars
+[msdn-thumbnail]: https://learn.microsoft.com/en-us/windows/win32/shell/taskbar-extensions#thumbnail-toolbars
 
 ### Icon Overlays in Taskbar
 
@@ -196,7 +196,7 @@ const win = new BrowserWindow()
 win.setOverlayIcon('path/to/overlay.png', 'Description for overlay')
 ```
 
-[msdn-icon-overlay]: https://docs.microsoft.com/en-us/windows/win32/shell/taskbar-extensions#icon-overlays
+[msdn-icon-overlay]: https://learn.microsoft.com/en-us/windows/win32/shell/taskbar-extensions#icon-overlays
 
 ### Flash Frame
 
@@ -230,7 +230,7 @@ win.flashFrame(true)
 In the above example, it is called when the window comes into focus,
 but you might use a timeout or some other event to disable it.
 
-[msdn-flash-frame]: https://docs.microsoft.com/en-us/windows/win32/api/winuser/nf-winuser-flashwindow#remarks
+[msdn-flash-frame]: https://learn.microsoft.com/en-us/windows/win32/api/winuser/nf-winuser-flashwindow#remarks
 
 [setthumbarbuttons]: ../api/browser-window.md#winsetthumbarbuttonsbuttons-windows
 [setusertaskstasks]: ../api/app.md#appsetusertaskstasks-windows

filenames.auto.gni

@@ -49,7 +49,6 @@ auto_filenames = {
     "docs/api/share-menu.md",
     "docs/api/shell.md",
     "docs/api/structures",
-    "docs/api/synopsis.md",
     "docs/api/system-preferences.md",
     "docs/api/touch-bar-button.md",
     "docs/api/touch-bar-color-picker.md",
@@ -79,7 +78,6 @@ auto_filenames = {
     "docs/api/structures/custom-scheme.md",
     "docs/api/structures/desktop-capturer-source.md",
     "docs/api/structures/display.md",
-    "docs/api/structures/event.md",
     "docs/api/structures/extension-info.md",
     "docs/api/structures/extension.md",
     "docs/api/structures/file-filter.md",
@@ -209,6 +207,8 @@ auto_filenames = {
     "lib/browser/api/message-channel.ts",
     "lib/browser/api/module-list.ts",
     "lib/browser/api/native-theme.ts",
+    "lib/browser/api/net-client-request.ts",
+    "lib/browser/api/net-fetch.ts",
     "lib/browser/api/net-log.ts",
     "lib/browser/api/net.ts",
     "lib/browser/api/notification.ts",

filenames.gni

@@ -153,7 +153,7 @@ filenames = {
     "shell/browser/notifications/mac/notification_presenter_mac.mm",
     "shell/browser/relauncher_mac.cc",
     "shell/browser/ui/certificate_trust_mac.mm",
-    "shell/browser/ui/cocoa/delayed_native_view_host.cc",
+    "shell/browser/ui/cocoa/delayed_native_view_host.mm",
     "shell/browser/ui/cocoa/delayed_native_view_host.h",
     "shell/browser/ui/cocoa/electron_bundle_mover.h",
     "shell/browser/ui/cocoa/electron_bundle_mover.mm",
@@ -175,8 +175,6 @@ filenames = {
     "shell/browser/ui/cocoa/electron_touch_bar.mm",
     "shell/browser/ui/cocoa/event_dispatching_window.h",
     "shell/browser/ui/cocoa/event_dispatching_window.mm",
-    "shell/browser/ui/cocoa/NSColor+Hex.h",
-    "shell/browser/ui/cocoa/NSColor+Hex.mm",
     "shell/browser/ui/cocoa/NSString+ANSI.h",
     "shell/browser/ui/cocoa/NSString+ANSI.mm",
     "shell/browser/ui/cocoa/root_view_mac.h",
@@ -267,7 +265,6 @@ filenames = {
     "shell/browser/api/electron_api_dialog.cc",
     "shell/browser/api/electron_api_download_item.cc",
     "shell/browser/api/electron_api_download_item.h",
-    "shell/browser/api/electron_api_event.cc",
     "shell/browser/api/electron_api_event_emitter.cc",
     "shell/browser/api/electron_api_event_emitter.h",
     "shell/browser/api/electron_api_global_shortcut.cc",
@@ -320,8 +317,6 @@ filenames = {
     "shell/browser/api/electron_api_web_request.cc",
     "shell/browser/api/electron_api_web_request.h",
     "shell/browser/api/electron_api_web_view_manager.cc",
-    "shell/browser/api/event.cc",
-    "shell/browser/api/event.h",
     "shell/browser/api/frame_subscriber.cc",
     "shell/browser/api/frame_subscriber.h",
     "shell/browser/api/gpu_info_enumerator.cc",
@@ -382,7 +377,6 @@ filenames = {
     "shell/browser/electron_web_contents_utility_handler_impl.h",
     "shell/browser/electron_web_ui_controller_factory.cc",
     "shell/browser/electron_web_ui_controller_factory.h",
-    "shell/browser/event_emitter_mixin.cc",
     "shell/browser/event_emitter_mixin.h",
     "shell/browser/extended_web_contents_observer.h",
     "shell/browser/feature_list.cc",
@@ -586,6 +580,7 @@ filenames = {
     "shell/common/gin_converters/native_window_converter.h",
     "shell/common/gin_converters/net_converter.cc",
     "shell/common/gin_converters/net_converter.h",
+    "shell/common/gin_converters/optional_converter.h",
     "shell/common/gin_converters/serial_port_info_converter.h",
     "shell/common/gin_converters/std_converter.h",
     "shell/common/gin_converters/time_converter.cc",
@@ -606,10 +601,13 @@ filenames = {
     "shell/common/gin_helper/dictionary.h",
     "shell/common/gin_helper/error_thrower.cc",
     "shell/common/gin_helper/error_thrower.h",
-    "shell/common/gin_helper/event_emitter.cc",
+    "shell/common/gin_helper/event.cc",
+    "shell/common/gin_helper/event.h",
     "shell/common/gin_helper/event_emitter.h",
     "shell/common/gin_helper/event_emitter_caller.cc",
     "shell/common/gin_helper/event_emitter_caller.h",
+    "shell/common/gin_helper/event_emitter_template.cc",
+    "shell/common/gin_helper/event_emitter_template.h",
     "shell/common/gin_helper/function_template.cc",
     "shell/common/gin_helper/function_template.h",
     "shell/common/gin_helper/function_template_extensions.h",

filenames.libcxx.gni

@@ -45,6 +45,7 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__algorithm/iter_swap.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/iterator_operations.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/lexicographical_compare.h",
+  "//buildtools/third_party/libc++/trunk/include/__algorithm/lexicographical_compare_three_way.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/lower_bound.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/make_heap.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/make_projected.h",
@@ -184,6 +185,7 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__algorithm/stable_partition.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/stable_sort.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/swap_ranges.h",
+  "//buildtools/third_party/libc++/trunk/include/__algorithm/three_way_comp_ref_type.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/transform.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/uniform_random_bit_generator_adaptor.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/unique.h",
@@ -192,6 +194,20 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__algorithm/unwrap_range.h",
   "//buildtools/third_party/libc++/trunk/include/__algorithm/upper_bound.h",
   "//buildtools/third_party/libc++/trunk/include/__assert",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/aliases.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/atomic.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/atomic_base.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/atomic_flag.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/atomic_init.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/atomic_lock_free.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/atomic_sync.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/check_memory_order.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/contention_t.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/cxx_atomic_impl.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/fence.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/is_always_lock_free.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/kill_dependency.h",
+  "//buildtools/third_party/libc++/trunk/include/__atomic/memory_order.h",
   "//buildtools/third_party/libc++/trunk/include/__availability",
   "//buildtools/third_party/libc++/trunk/include/__bit/bit_cast.h",
   "//buildtools/third_party/libc++/trunk/include/__bit/bit_ceil.h",
@@ -210,11 +226,17 @@ libcxx_headers = [
   "//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/__charconv/chars_format.h",
+  "//buildtools/third_party/libc++/trunk/include/__charconv/from_chars_integral.h",
   "//buildtools/third_party/libc++/trunk/include/__charconv/from_chars_result.h",
   "//buildtools/third_party/libc++/trunk/include/__charconv/tables.h",
+  "//buildtools/third_party/libc++/trunk/include/__charconv/to_chars.h",
   "//buildtools/third_party/libc++/trunk/include/__charconv/to_chars_base_10.h",
+  "//buildtools/third_party/libc++/trunk/include/__charconv/to_chars_floating_point.h",
+  "//buildtools/third_party/libc++/trunk/include/__charconv/to_chars_integral.h",
   "//buildtools/third_party/libc++/trunk/include/__charconv/to_chars_result.h",
+  "//buildtools/third_party/libc++/trunk/include/__charconv/traits.h",
   "//buildtools/third_party/libc++/trunk/include/__chrono/calendar.h",
+  "//buildtools/third_party/libc++/trunk/include/__chrono/concepts.h",
   "//buildtools/third_party/libc++/trunk/include/__chrono/convert_to_timespec.h",
   "//buildtools/third_party/libc++/trunk/include/__chrono/convert_to_tm.h",
   "//buildtools/third_party/libc++/trunk/include/__chrono/day.h",
@@ -273,6 +295,7 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__concepts/semiregular.h",
   "//buildtools/third_party/libc++/trunk/include/__concepts/swappable.h",
   "//buildtools/third_party/libc++/trunk/include/__concepts/totally_ordered.h",
+  "//buildtools/third_party/libc++/trunk/include/__condition_variable/condition_variable.h",
   "//buildtools/third_party/libc++/trunk/include/__config",
   "//buildtools/third_party/libc++/trunk/include/__config_site.in",
   "//buildtools/third_party/libc++/trunk/include/__coroutine/coroutine_handle.h",
@@ -282,6 +305,11 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__debug",
   "//buildtools/third_party/libc++/trunk/include/__debug_utils/randomize_range.h",
   "//buildtools/third_party/libc++/trunk/include/__errc",
+  "//buildtools/third_party/libc++/trunk/include/__exception/exception.h",
+  "//buildtools/third_party/libc++/trunk/include/__exception/exception_ptr.h",
+  "//buildtools/third_party/libc++/trunk/include/__exception/nested_exception.h",
+  "//buildtools/third_party/libc++/trunk/include/__exception/operations.h",
+  "//buildtools/third_party/libc++/trunk/include/__exception/terminate.h",
   "//buildtools/third_party/libc++/trunk/include/__expected/bad_expected_access.h",
   "//buildtools/third_party/libc++/trunk/include/__expected/expected.h",
   "//buildtools/third_party/libc++/trunk/include/__expected/unexpect.h",
@@ -416,6 +444,7 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__mbstate_t.h",
   "//buildtools/third_party/libc++/trunk/include/__memory/addressof.h",
   "//buildtools/third_party/libc++/trunk/include/__memory/align.h",
+  "//buildtools/third_party/libc++/trunk/include/__memory/aligned_alloc.h",
   "//buildtools/third_party/libc++/trunk/include/__memory/allocate_at_least.h",
   "//buildtools/third_party/libc++/trunk/include/__memory/allocation_guard.h",
   "//buildtools/third_party/libc++/trunk/include/__memory/allocator.h",
@@ -448,7 +477,10 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__memory_resource/pool_options.h",
   "//buildtools/third_party/libc++/trunk/include/__memory_resource/synchronized_pool_resource.h",
   "//buildtools/third_party/libc++/trunk/include/__memory_resource/unsynchronized_pool_resource.h",
-  "//buildtools/third_party/libc++/trunk/include/__mutex_base",
+  "//buildtools/third_party/libc++/trunk/include/__mutex/lock_guard.h",
+  "//buildtools/third_party/libc++/trunk/include/__mutex/mutex.h",
+  "//buildtools/third_party/libc++/trunk/include/__mutex/tag_types.h",
+  "//buildtools/third_party/libc++/trunk/include/__mutex/unique_lock.h",
   "//buildtools/third_party/libc++/trunk/include/__node_handle",
   "//buildtools/third_party/libc++/trunk/include/__numeric/accumulate.h",
   "//buildtools/third_party/libc++/trunk/include/__numeric/adjacent_difference.h",
@@ -541,6 +573,7 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__split_buffer",
   "//buildtools/third_party/libc++/trunk/include/__std_stream",
   "//buildtools/third_party/libc++/trunk/include/__string/char_traits.h",
+  "//buildtools/third_party/libc++/trunk/include/__string/constexpr_c_functions.h",
   "//buildtools/third_party/libc++/trunk/include/__string/extern_template_lists.h",
   "//buildtools/third_party/libc++/trunk/include/__support/android/locale_bionic.h",
   "//buildtools/third_party/libc++/trunk/include/__support/fuchsia/xlocale.h",
@@ -621,6 +654,7 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__type_traits/is_destructible.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/is_empty.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/is_enum.h",
+  "//buildtools/third_party/libc++/trunk/include/__type_traits/is_equality_comparable.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/is_final.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/is_floating_point.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/is_function.h",
@@ -685,6 +719,7 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/__type_traits/nat.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/negation.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/noexcept_move_assign_container.h",
+  "//buildtools/third_party/libc++/trunk/include/__type_traits/predicate_traits.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/promote.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/rank.h",
   "//buildtools/third_party/libc++/trunk/include/__type_traits/remove_all_extents.h",
@@ -773,11 +808,8 @@ libcxx_headers = [
   "//buildtools/third_party/libc++/trunk/include/expected",
   "//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/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",

lib/browser/api/base-window.ts

@@ -1,5 +1,6 @@
 import { EventEmitter } from 'events';
 import type { BaseWindow as TLWT } from 'electron/main';
+import * as deprecate from '@electron/internal/common/deprecate';
 const { BaseWindow } = process._linkedBinding('electron_browser_base_window') as { BaseWindow: typeof TLWT };
 
 Object.setPrototypeOf(BaseWindow.prototype, EventEmitter.prototype);
@@ -15,6 +16,25 @@ BaseWindow.prototype._init = function () {
   }
 };
 
+// Deprecation.
+const setTrafficLightPositionDeprecated = deprecate.warnOnce('setTrafficLightPosition', 'setWindowButtonPosition');
+// Converting to any as the methods are defined under BrowserWindow in our docs.
+(BaseWindow as any).prototype.setTrafficLightPosition = function (pos: Electron.Point) {
+  setTrafficLightPositionDeprecated();
+  if (typeof pos === 'object' && pos.x === 0 && pos.y === 0) {
+    this.setWindowButtonPosition(null);
+  } else {
+    this.setWindowButtonPosition(pos);
+  }
+};
+
+const getTrafficLightPositionDeprecated = deprecate.warnOnce('getTrafficLightPosition', 'getWindowButtonPosition');
+(BaseWindow as any).prototype.getTrafficLightPosition = function () {
+  getTrafficLightPositionDeprecated();
+  const pos = this.getWindowButtonPosition();
+  return pos === null ? { x: 0, y: 0 } : pos;
+};
+
 // Properties
 
 Object.defineProperty(BaseWindow.prototype, 'autoHideMenuBar', {

lib/browser/api/browser-window.ts

@@ -1,4 +1,4 @@
-import { BaseWindow, WebContents, Event, BrowserView, TouchBar } from 'electron/main';
+import { BaseWindow, WebContents, BrowserView, TouchBar } from 'electron/main';
 import type { BrowserWindow as BWT } from 'electron/main';
 import * as deprecate from '@electron/internal/common/deprecate';
 const { BrowserWindow } = process._linkedBinding('electron_browser_window') as { BrowserWindow: typeof BWT };
@@ -22,10 +22,10 @@ BrowserWindow.prototype._init = function (this: BWT) {
   };
 
   // Redirect focus/blur event to app instance too.
-  this.on('blur', (event: Event) => {
+  this.on('blur', (event: Electron.Event) => {
     app.emit('browser-window-blur', event, this);
   });
-  this.on('focus', (event: Event) => {
+  this.on('focus', (event: Electron.Event) => {
     app.emit('browser-window-focus', event, this);
   });
 
@@ -68,8 +68,7 @@ BrowserWindow.prototype._init = function (this: BWT) {
   });
 
   // Notify the creation of the window.
-  const event = process._linkedBinding('electron_browser_event').createEmpty();
-  app.emit('browser-window-created', event, this);
+  app.emit('browser-window-created', { preventDefault () {} }, this);
 
   Object.defineProperty(this, 'devToolsWebContents', {
     enumerable: true,

lib/browser/api/menu-item.ts

@@ -1,5 +1,5 @@
 import * as roles from '@electron/internal/browser/api/menu-item-roles';
-import { Menu, Event, BrowserWindow, WebContents } from 'electron/main';
+import { Menu, BrowserWindow, WebContents, KeyboardEvent } from 'electron/main';
 
 let nextCommandId = 0;
 
@@ -53,7 +53,7 @@ const MenuItem = function (this: any, options: any) {
   });
 
   const click = options.click;
-  this.click = (event: Event, focusedWindow: BrowserWindow, focusedWebContents: WebContents) => {
+  this.click = (event: KeyboardEvent, focusedWindow: BrowserWindow, focusedWebContents: WebContents) => {
     // Manually flip the checked flags when clicked.
     if (!roles.shouldOverrideCheckStatus(this.role) &&
         (this.type === 'checkbox' || this.type === 'radio')) {

lib/browser/api/net-client-request.ts

@@ -0,0 +1,537 @@
+import * as url from 'url';
+import { Readable, Writable } from 'stream';
+import { app } from 'electron/main';
+import type { ClientRequestConstructorOptions, UploadProgress } from 'electron/main';
+
+const {
+  isValidHeaderName,
+  isValidHeaderValue,
+  createURLLoader
+} = process._linkedBinding('electron_browser_net');
+const { Session } = process._linkedBinding('electron_browser_session');
+
+const kHttpProtocols = new Set(['http:', 'https:']);
+
+// set of headers that Node.js discards duplicates for
+// see https://nodejs.org/api/http.html#http_message_headers
+const discardableDuplicateHeaders = new Set([
+  'content-type',
+  'content-length',
+  'user-agent',
+  'referer',
+  'host',
+  'authorization',
+  'proxy-authorization',
+  'if-modified-since',
+  'if-unmodified-since',
+  'from',
+  'location',
+  'max-forwards',
+  'retry-after',
+  'etag',
+  'last-modified',
+  'server',
+  'age',
+  'expires'
+]);
+
+class IncomingMessage extends Readable {
+  _shouldPush: boolean = false;
+  _data: (Buffer | null)[] = [];
+  _responseHead: NodeJS.ResponseHead;
+  _resume: (() => void) | null = null;
+
+  constructor (responseHead: NodeJS.ResponseHead) {
+    super();
+    this._responseHead = responseHead;
+  }
+
+  get statusCode () {
+    return this._responseHead.statusCode;
+  }
+
+  get statusMessage () {
+    return this._responseHead.statusMessage;
+  }
+
+  get headers () {
+    const filteredHeaders: Record<string, string | string[]> = {};
+    const { headers, rawHeaders } = this._responseHead;
+    for (const [name, values] of Object.entries(headers)) {
+      filteredHeaders[name] = discardableDuplicateHeaders.has(name) ? values[0] : values.join(', ');
+    }
+    const cookies = rawHeaders.filter(({ key }) => key.toLowerCase() === 'set-cookie').map(({ value }) => value);
+    // keep set-cookie as an array per Node.js rules
+    // see https://nodejs.org/api/http.html#http_message_headers
+    if (cookies.length) { filteredHeaders['set-cookie'] = cookies; }
+    return filteredHeaders;
+  }
+
+  get rawHeaders () {
+    const rawHeadersArr: string[] = [];
+    const { rawHeaders } = this._responseHead;
+    rawHeaders.forEach(header => {
+      rawHeadersArr.push(header.key, header.value);
+    });
+    return rawHeadersArr;
+  }
+
+  get httpVersion () {
+    return `${this.httpVersionMajor}.${this.httpVersionMinor}`;
+  }
+
+  get httpVersionMajor () {
+    return this._responseHead.httpVersion.major;
+  }
+
+  get httpVersionMinor () {
+    return this._responseHead.httpVersion.minor;
+  }
+
+  get rawTrailers () {
+    throw new Error('HTTP trailers are not supported');
+  }
+
+  get trailers () {
+    throw new Error('HTTP trailers are not supported');
+  }
+
+  _storeInternalData (chunk: Buffer | null, resume: (() => void) | null) {
+    // save the network callback for use in _pushInternalData
+    this._resume = resume;
+    this._data.push(chunk);
+    this._pushInternalData();
+  }
+
+  _pushInternalData () {
+    while (this._shouldPush && this._data.length > 0) {
+      const chunk = this._data.shift();
+      this._shouldPush = this.push(chunk);
+    }
+    if (this._shouldPush && this._resume) {
+      // Reset the callback, so that a new one is used for each
+      // batch of throttled data. Do this before calling resume to avoid a
+      // potential race-condition
+      const resume = this._resume;
+      this._resume = null;
+
+      resume();
+    }
+  }
+
+  _read () {
+    this._shouldPush = true;
+    this._pushInternalData();
+  }
+}
+
+/** Writable stream that buffers up everything written to it. */
+class SlurpStream extends Writable {
+  _data: Buffer;
+  constructor () {
+    super();
+    this._data = Buffer.alloc(0);
+  }
+
+  _write (chunk: Buffer, encoding: string, callback: () => void) {
+    this._data = Buffer.concat([this._data, chunk]);
+    callback();
+  }
+
+  data () { return this._data; }
+}
+
+class ChunkedBodyStream extends Writable {
+  _pendingChunk: Buffer | undefined;
+  _downstream?: NodeJS.DataPipe;
+  _pendingCallback?: (error?: Error) => void;
+  _clientRequest: ClientRequest;
+
+  constructor (clientRequest: ClientRequest) {
+    super();
+    this._clientRequest = clientRequest;
+  }
+
+  _write (chunk: Buffer, encoding: string, callback: () => void) {
+    if (this._downstream) {
+      this._downstream.write(chunk).then(callback, callback);
+    } else {
+      // the contract of _write is that we won't be called again until we call
+      // the callback, so we're good to just save a single chunk.
+      this._pendingChunk = chunk;
+      this._pendingCallback = callback;
+
+      // The first write to a chunked body stream begins the request.
+      this._clientRequest._startRequest();
+    }
+  }
+
+  _final (callback: () => void) {
+    this._downstream!.done();
+    callback();
+  }
+
+  startReading (pipe: NodeJS.DataPipe) {
+    if (this._downstream) {
+      throw new Error('two startReading calls???');
+    }
+    this._downstream = pipe;
+    if (this._pendingChunk) {
+      const doneWriting = (maybeError: Error | void) => {
+        // If the underlying request has been aborted, we honestly don't care about the error
+        // all work should cease as soon as we abort anyway, this error is probably a
+        // "mojo pipe disconnected" error (code=9)
+        if (this._clientRequest._aborted) return;
+
+        const cb = this._pendingCallback!;
+        delete this._pendingCallback;
+        delete this._pendingChunk;
+        cb(maybeError || undefined);
+      };
+      this._downstream.write(this._pendingChunk).then(doneWriting, doneWriting);
+    }
+  }
+}
+
+type RedirectPolicy = 'manual' | 'follow' | 'error';
+
+const kAllowNonHttpProtocols = Symbol('kAllowNonHttpProtocols');
+export function allowAnyProtocol (opts: ClientRequestConstructorOptions): ClientRequestConstructorOptions {
+  return {
+    ...opts,
+    [kAllowNonHttpProtocols]: true
+  } as any;
+}
+
+type ExtraURLLoaderOptions = {
+   redirectPolicy: RedirectPolicy;
+   headers: Record<string, { name: string, value: string | string[] }>;
+   allowNonHttpProtocols: boolean;
+}
+function parseOptions (optionsIn: ClientRequestConstructorOptions | string): NodeJS.CreateURLLoaderOptions & ExtraURLLoaderOptions {
+  const options: any = typeof optionsIn === 'string' ? url.parse(optionsIn) : { ...optionsIn };
+
+  let urlStr: string = options.url;
+
+  if (!urlStr) {
+    const urlObj: url.UrlObject = {};
+    const protocol = options.protocol || 'http:';
+    urlObj.protocol = protocol;
+
+    if (options.host) {
+      urlObj.host = options.host;
+    } else {
+      if (options.hostname) {
+        urlObj.hostname = options.hostname;
+      } else {
+        urlObj.hostname = 'localhost';
+      }
+
+      if (options.port) {
+        urlObj.port = options.port;
+      }
+    }
+
+    if (options.path && / /.test(options.path)) {
+      // The actual regex is more like /[^A-Za-z0-9\-._~!$&'()*+,;=/:@]/
+      // with an additional rule for ignoring percentage-escaped characters
+      // but that's a) hard to capture in a regular expression that performs
+      // well, and b) possibly too restrictive for real-world usage. That's
+      // why it only scans for spaces because those are guaranteed to create
+      // an invalid request.
+      throw new TypeError('Request path contains unescaped characters');
+    }
+    const pathObj = url.parse(options.path || '/');
+    urlObj.pathname = pathObj.pathname;
+    urlObj.search = pathObj.search;
+    urlObj.hash = pathObj.hash;
+    urlStr = url.format(urlObj);
+  }
+
+  const redirectPolicy = options.redirect || 'follow';
+  if (!['follow', 'error', 'manual'].includes(redirectPolicy)) {
+    throw new Error('redirect mode should be one of follow, error or manual');
+  }
+
+  if (options.headers != null && typeof options.headers !== 'object') {
+    throw new TypeError('headers must be an object');
+  }
+
+  const urlLoaderOptions: NodeJS.CreateURLLoaderOptions & { redirectPolicy: RedirectPolicy, headers: Record<string, { name: string, value: string | string[] }>, allowNonHttpProtocols: boolean } = {
+    method: (options.method || 'GET').toUpperCase(),
+    url: urlStr,
+    redirectPolicy,
+    headers: {},
+    body: null as any,
+    useSessionCookies: options.useSessionCookies,
+    credentials: options.credentials,
+    origin: options.origin,
+    referrerPolicy: options.referrerPolicy,
+    cache: options.cache,
+    allowNonHttpProtocols: Object.prototype.hasOwnProperty.call(options, kAllowNonHttpProtocols)
+  };
+  const headers: Record<string, string | string[]> = options.headers || {};
+  for (const [name, value] of Object.entries(headers)) {
+    if (!isValidHeaderName(name)) {
+      throw new Error(`Invalid header name: '${name}'`);
+    }
+    if (!isValidHeaderValue(value.toString())) {
+      throw new Error(`Invalid value for header '${name}': '${value}'`);
+    }
+    const key = name.toLowerCase();
+    urlLoaderOptions.headers[key] = { name, value };
+  }
+  if (options.session) {
+    if (!(options.session instanceof Session)) { throw new TypeError('`session` should be an instance of the Session class'); }
+    urlLoaderOptions.session = options.session;
+  } else if (options.partition) {
+    if (typeof options.partition === 'string') {
+      urlLoaderOptions.partition = options.partition;
+    } else {
+      throw new TypeError('`partition` should be a string');
+    }
+  }
+  return urlLoaderOptions;
+}
+
+export class ClientRequest extends Writable implements Electron.ClientRequest {
+  _started: boolean = false;
+  _firstWrite: boolean = false;
+  _aborted: boolean = false;
+  _chunkedEncoding: boolean | undefined;
+  _body: Writable | undefined;
+  _urlLoaderOptions: NodeJS.CreateURLLoaderOptions & { headers: Record<string, { name: string, value: string | string[] }> };
+  _redirectPolicy: RedirectPolicy;
+  _followRedirectCb?: () => void;
+  _uploadProgress?: { active: boolean, started: boolean, current: number, total: number };
+  _urlLoader?: NodeJS.URLLoader;
+  _response?: IncomingMessage;
+
+  constructor (options: ClientRequestConstructorOptions | string, callback?: (message: IncomingMessage) => void) {
+    super({ autoDestroy: true });
+
+    if (!app.isReady()) {
+      throw new Error('net module can only be used after app is ready');
+    }
+
+    if (callback) {
+      this.once('response', callback);
+    }
+
+    const { redirectPolicy, ...urlLoaderOptions } = parseOptions(options);
+    const urlObj = new URL(urlLoaderOptions.url);
+    if (!urlLoaderOptions.allowNonHttpProtocols && !kHttpProtocols.has(urlObj.protocol)) {
+      throw new Error('ClientRequest only supports http: and https: protocols');
+    }
+    if (urlLoaderOptions.credentials === 'same-origin' && !urlLoaderOptions.origin) { throw new Error('credentials: same-origin requires origin to be set'); }
+    this._urlLoaderOptions = urlLoaderOptions;
+    this._redirectPolicy = redirectPolicy;
+  }
+
+  get chunkedEncoding () {
+    return this._chunkedEncoding || false;
+  }
+
+  set chunkedEncoding (value: boolean) {
+    if (this._started) {
+      throw new Error('chunkedEncoding can only be set before the request is started');
+    }
+    if (typeof this._chunkedEncoding !== 'undefined') {
+      throw new Error('chunkedEncoding can only be set once');
+    }
+    this._chunkedEncoding = !!value;
+    if (this._chunkedEncoding) {
+      this._body = new ChunkedBodyStream(this);
+      this._urlLoaderOptions.body = (pipe: NodeJS.DataPipe) => {
+        (this._body! as ChunkedBodyStream).startReading(pipe);
+      };
+    }
+  }
+
+  setHeader (name: string, value: string) {
+    if (typeof name !== 'string') {
+      throw new TypeError('`name` should be a string in setHeader(name, value)');
+    }
+    if (value == null) {
+      throw new Error('`value` required in setHeader("' + name + '", value)');
+    }
+    if (this._started || this._firstWrite) {
+      throw new Error('Can\'t set headers after they are sent');
+    }
+    if (!isValidHeaderName(name)) {
+      throw new Error(`Invalid header name: '${name}'`);
+    }
+    if (!isValidHeaderValue(value.toString())) {
+      throw new Error(`Invalid value for header '${name}': '${value}'`);
+    }
+
+    const key = name.toLowerCase();
+    this._urlLoaderOptions.headers[key] = { name, value };
+  }
+
+  getHeader (name: string) {
+    if (name == null) {
+      throw new Error('`name` is required for getHeader(name)');
+    }
+
+    const key = name.toLowerCase();
+    const header = this._urlLoaderOptions.headers[key];
+    return header && header.value as any;
+  }
+
+  removeHeader (name: string) {
+    if (name == null) {
+      throw new Error('`name` is required for removeHeader(name)');
+    }
+
+    if (this._started || this._firstWrite) {
+      throw new Error('Can\'t remove headers after they are sent');
+    }
+
+    const key = name.toLowerCase();
+    delete this._urlLoaderOptions.headers[key];
+  }
+
+  _write (chunk: Buffer, encoding: BufferEncoding, callback: () => void) {
+    this._firstWrite = true;
+    if (!this._body) {
+      this._body = new SlurpStream();
+      this._body.on('finish', () => {
+        this._urlLoaderOptions.body = (this._body as SlurpStream).data();
+        this._startRequest();
+      });
+    }
+    // TODO: is this the right way to forward to another stream?
+    this._body.write(chunk, encoding, callback);
+  }
+
+  _final (callback: () => void) {
+    if (this._body) {
+      // TODO: is this the right way to forward to another stream?
+      this._body.end(callback);
+    } else {
+      // end() called without a body, go ahead and start the request
+      this._startRequest();
+      callback();
+    }
+  }
+
+  _startRequest () {
+    this._started = true;
+    const stringifyValues = (obj: Record<string, { name: string, value: string | string[] }>) => {
+      const ret: Record<string, string> = {};
+      for (const k of Object.keys(obj)) {
+        const kv = obj[k];
+        ret[kv.name] = kv.value.toString();
+      }
+      return ret;
+    };
+    this._urlLoaderOptions.referrer = this.getHeader('referer') || '';
+    this._urlLoaderOptions.origin = this._urlLoaderOptions.origin || this.getHeader('origin') || '';
+    this._urlLoaderOptions.hasUserActivation = this.getHeader('sec-fetch-user') === '?1';
+    this._urlLoaderOptions.mode = this.getHeader('sec-fetch-mode') || '';
+    this._urlLoaderOptions.destination = this.getHeader('sec-fetch-dest') || '';
+    const opts = { ...this._urlLoaderOptions, extraHeaders: stringifyValues(this._urlLoaderOptions.headers) };
+    this._urlLoader = createURLLoader(opts);
+    this._urlLoader.on('response-started', (event, finalUrl, responseHead) => {
+      const response = this._response = new IncomingMessage(responseHead);
+      this.emit('response', response);
+    });
+    this._urlLoader.on('data', (event, data, resume) => {
+      this._response!._storeInternalData(Buffer.from(data), resume);
+    });
+    this._urlLoader.on('complete', () => {
+      if (this._response) { this._response._storeInternalData(null, null); }
+    });
+    this._urlLoader.on('error', (event, netErrorString) => {
+      const error = new Error(netErrorString);
+      if (this._response) this._response.destroy(error);
+      this._die(error);
+    });
+
+    this._urlLoader.on('login', (event, authInfo, callback) => {
+      const handled = this.emit('login', authInfo, callback);
+      if (!handled) {
+        // If there were no listeners, cancel the authentication request.
+        callback();
+      }
+    });
+
+    this._urlLoader.on('redirect', (event, redirectInfo, headers) => {
+      const { statusCode, newMethod, newUrl } = redirectInfo;
+      if (this._redirectPolicy === 'error') {
+        this._die(new Error('Attempted to redirect, but redirect policy was \'error\''));
+      } else if (this._redirectPolicy === 'manual') {
+        let _followRedirect = false;
+        this._followRedirectCb = () => { _followRedirect = true; };
+        try {
+          this.emit('redirect', statusCode, newMethod, newUrl, headers);
+        } finally {
+          this._followRedirectCb = undefined;
+          if (!_followRedirect && !this._aborted) {
+            this._die(new Error('Redirect was cancelled'));
+          }
+        }
+      } else if (this._redirectPolicy === 'follow') {
+        // Calling followRedirect() when the redirect policy is 'follow' is
+        // allowed but does nothing. (Perhaps it should throw an error
+        // though...? Since the redirect will happen regardless.)
+        try {
+          this._followRedirectCb = () => {};
+          this.emit('redirect', statusCode, newMethod, newUrl, headers);
+        } finally {
+          this._followRedirectCb = undefined;
+        }
+      } else {
+        this._die(new Error(`Unexpected redirect policy '${this._redirectPolicy}'`));
+      }
+    });
+
+    this._urlLoader.on('upload-progress', (event, position, total) => {
+      this._uploadProgress = { active: true, started: true, current: position, total };
+      this.emit('upload-progress', position, total); // Undocumented, for now
+    });
+
+    this._urlLoader.on('download-progress', (event, current) => {
+      if (this._response) {
+        this._response.emit('download-progress', current); // Undocumented, for now
+      }
+    });
+  }
+
+  followRedirect () {
+    if (this._followRedirectCb) {
+      this._followRedirectCb();
+    } else {
+      throw new Error('followRedirect() called, but was not waiting for a redirect');
+    }
+  }
+
+  abort () {
+    if (!this._aborted) {
+      process.nextTick(() => { this.emit('abort'); });
+    }
+    this._aborted = true;
+    this._die();
+  }
+
+  _die (err?: Error) {
+    // Node.js assumes that any stream which is ended is no longer capable of emitted events
+    // which is a faulty assumption for the case of an object that is acting like a stream
+    // (our urlRequest). If we don't emit here, this causes errors since we *do* expect
+    // that error events can be emitted after urlRequest.end().
+    if ((this as any)._writableState.destroyed && err) {
+      this.emit('error', err);
+    }
+
+    this.destroy(err);
+    if (this._urlLoader) {
+      this._urlLoader.cancel();
+      if (this._response) this._response.destroy(err);
+    }
+  }
+
+  getUploadProgress (): UploadProgress {
+    return this._uploadProgress ? { ...this._uploadProgress } : { active: false, started: false, current: 0, total: 0 };
+  }
+}