chore: cherry-pick 3 changes from Release-5-M120 (#41014)

* chore: [27-x-y] cherry-pick 3 changes from Release-5-M120

* 46cb67e3b296 from v8
* c1cda70a433a from chromium
* 78dd4b31847a from v8

* chore: update patches

---------

Co-authored-by: PatchUp <73610968+patchup[bot]@users.noreply.github.com>

.circleci/config/base.yml

@@ -80,12 +80,14 @@ executors:
     machine: true
 
   linux-arm:
-    resource_class: electronjs/linux-arm
-    machine: true
+    resource_class: electronjs/aks-linux-arm-test
+    docker:
+      - image: ghcr.io/electron/test:arm32v7-8e0f85b708fa58e28e4824954d6fd55adfda5e9e
 
   linux-arm64:
-    resource_class: electronjs/linux-arm64
-    machine: true
+    resource_class: electronjs/aks-linux-arm-test
+    docker:
+      - image: ghcr.io/electron/test:arm64v8-76d5d29e247972da3855a01c2d8cf72c5998233a
 
 # The config expects the following environment variables to be set:
 #  - "SLACK_WEBHOOK" Slack hook URL to send notifications.
@@ -660,6 +662,7 @@ step-nodejs-headers-build: &step-nodejs-headers-build
 step-electron-publish: &step-electron-publish
   run:
     name: Publish Electron Dist
+    no_output_timeout: 30m
     command: |
       if [ "`uname`" == "Darwin" ]; then
         rm -rf src/out/Default/obj
@@ -754,8 +757,8 @@ step-show-goma-stats: &step-show-goma-stats
     command: |
       set +e
       set +o pipefail
-      $GOMA_DIR/goma_ctl.py stat
-      $GOMA_DIR/diagnose_goma_log.py
+      python3 $GOMA_DIR/goma_ctl.py stat
+      python3 $GOMA_DIR/diagnose_goma_log.py
       true
     when: always
     background: true
@@ -1655,17 +1658,15 @@ commands:
               export LLVM_SYMBOLIZER_PATH=$PWD/third_party/llvm-build/Release+Asserts/bin/llvm-symbolizer
               export MOCHA_TIMEOUT=180000
               echo "Piping output to ASAN_SYMBOLIZE ($ASAN_SYMBOLIZE)"
-              (cd electron && (circleci tests glob "spec/*-spec.ts" | circleci tests run --command="xargs node script/yarn test --runners=main --trace-uncaught --enable-logging --files" --split-by=timings 2>&1)) | $ASAN_SYMBOLIZE
+              (cd electron && (circleci tests glob "spec/*-spec.ts" | xargs -I@ -P4 bash -c "echo $(pwd)/@" | circleci tests run --command="xargs node script/yarn test --runners=main --trace-uncaught --enable-logging --files" --split-by=timings 2>&1)) | $ASAN_SYMBOLIZE
             else
               if [ "$TARGET_ARCH" == "arm" ] || [ "$TARGET_ARCH" == "arm64" ]; then
                 export ELECTRON_SKIP_NATIVE_MODULE_TESTS=true
-                (cd electron && node script/yarn test --runners=main --trace-uncaught --enable-logging)
-              else
-                if [ "$TARGET_ARCH" == "ia32" ]; then
-                  npm_config_arch=x64 node electron/node_modules/dugite/script/download-git.js
-                fi
-                (cd electron && (circleci tests glob "spec/*-spec.ts" | circleci tests run --command="xargs node script/yarn test --runners=main --trace-uncaught --enable-logging --files" --split-by=timings))
               fi
+              if [ "$TARGET_ARCH" == "ia32" ]; then
+                npm_config_arch=x64 node electron/node_modules/dugite/script/download-git.js
+              fi
+              (cd electron && (circleci tests glob "spec/*-spec.ts" | xargs -I@ -P4 bash -c "echo $(pwd)/@" | circleci tests run --command="xargs node script/yarn test --runners=main --trace-uncaught --enable-logging --files" --split-by=timings))
             fi
       - store_test_results:
           path: src/junit
@@ -2295,6 +2296,7 @@ jobs:
       <<: *env-global
       <<: *env-headless-testing
       <<: *env-stack-dumping
+    parallelism: 3
     steps:
       - electron-tests:
           artifact-key: linux-arm
@@ -2306,6 +2308,7 @@ jobs:
       <<: *env-global
       <<: *env-headless-testing
       <<: *env-stack-dumping
+    parallelism: 3
     steps:
       - electron-tests:
           artifact-key: linux-arm64

BUILD.gn

@@ -103,14 +103,26 @@ branding = read_file("shell/app/BRANDING.json", "json")
 electron_project_name = branding.project_name
 electron_product_name = branding.product_name
 electron_mac_bundle_id = branding.mac_bundle_id
-electron_version = exec_script("script/print-version.py",
-                               [],
-                               "trim string",
-                               [
-                                 ".git/packed-refs",
-                                 ".git/HEAD",
-                                 "script/lib/get-version.js",
-                               ])
+
+if (override_electron_version != "") {
+  electron_version = override_electron_version
+} else {
+  # When building from source code tarball there is no git tag available and
+  # builders must explicitly pass override_electron_version in gn args.
+  # This read_file call will assert if there is no git information, without it
+  # gn will generate a malformed build configuration and ninja will get into
+  # infinite loop.
+  read_file(".git/packed-refs", "string")
+
+  # Set electron version from git tag.
+  electron_version = exec_script("script/get-git-version.py",
+                                 [],
+                                 "trim string",
+                                 [
+                                   ".git/packed-refs",
+                                   ".git/HEAD",
+                                 ])
+}
 
 if (is_mas_build) {
   assert(is_mac,
@@ -787,6 +799,7 @@ if (is_mac) {
       "buildflags",
       "shell/common/api:mojo",
       "//base",
+      "//content/public/browser",
       "//skia",
       "//third_party/electron_node:node_lib",
       "//third_party/webrtc_overrides:webrtc_component",

DEPS

@@ -2,7 +2,7 @@ gclient_gn_args_from = 'src'
 
 vars = {
   'chromium_version':
-    '118.0.5993.18',
+    '118.0.5993.159',
   'node_version':
     'v18.17.1',
   'nan_version':

buildflags/buildflags.gni

@@ -18,4 +18,9 @@ declare_args() {
 
   # Enable Spellchecker support
   enable_builtin_spellchecker = true
+
+  # The version of Electron.
+  # Packagers and vendor builders should set this in gn args to avoid running
+  # the script that reads git tag.
+  override_electron_version = ""
 }

chromium_src/BUILD.gn

@@ -323,6 +323,34 @@ static_library("chrome") {
         "//components/pdf/renderer",
       ]
     }
+  } else {
+    # These are required by the webRequest module.
+    sources += [
+      "//extensions/browser/api/declarative_net_request/request_action.cc",
+      "//extensions/browser/api/declarative_net_request/request_action.h",
+      "//extensions/browser/api/web_request/form_data_parser.cc",
+      "//extensions/browser/api/web_request/form_data_parser.h",
+      "//extensions/browser/api/web_request/upload_data_presenter.cc",
+      "//extensions/browser/api/web_request/upload_data_presenter.h",
+      "//extensions/browser/api/web_request/web_request_api_constants.cc",
+      "//extensions/browser/api/web_request/web_request_api_constants.h",
+      "//extensions/browser/api/web_request/web_request_info.cc",
+      "//extensions/browser/api/web_request/web_request_info.h",
+      "//extensions/browser/api/web_request/web_request_resource_type.cc",
+      "//extensions/browser/api/web_request/web_request_resource_type.h",
+      "//extensions/browser/extension_api_frame_id_map.cc",
+      "//extensions/browser/extension_api_frame_id_map.h",
+      "//extensions/browser/extension_navigation_ui_data.cc",
+      "//extensions/browser/extension_navigation_ui_data.h",
+      "//extensions/browser/extensions_browser_client.cc",
+      "//extensions/browser/extensions_browser_client.h",
+      "//extensions/browser/guest_view/web_view/web_view_renderer_state.cc",
+      "//extensions/browser/guest_view/web_view/web_view_renderer_state.h",
+    ]
+
+    public_deps += [
+      "//extensions/browser/api/declarative_net_request/flat:extension_ruleset",
+    ]
   }
 
   if (!is_mas_build) {
@@ -357,6 +385,7 @@ if (is_mac) {
 
     deps = [
       "//base",
+      "//content/public/browser",
       "//skia",
       "//third_party/electron_node:node_lib",
       "//third_party/webrtc_overrides:webrtc_component",

docs/api/accelerator.md

@@ -15,7 +15,7 @@ Shortcuts are registered with the [`globalShortcut`](global-shortcut.md) module
 using the [`register`](global-shortcut.md#globalshortcutregisteraccelerator-callback)
 method, i.e.
 
-```javascript
+```js
 const { app, globalShortcut } = require('electron')
 
 app.whenReady().then(() => {

docs/api/app.md

@@ -1134,11 +1134,11 @@ indicates success while any other value indicates failure according to Chromium
     resolver will attempt to use the system's DNS settings to do DNS lookups
     itself. Enabled by default on macOS, disabled by default on Windows and
     Linux.
-  * `secureDnsMode` string (optional) - Can be "off", "automatic" or "secure".
-    Configures the DNS-over-HTTP mode. When "off", no DoH lookups will be
-    performed. When "automatic", DoH lookups will be performed first if DoH is
+  * `secureDnsMode` string (optional) - Can be 'off', 'automatic' or 'secure'.
+    Configures the DNS-over-HTTP mode. When 'off', no DoH lookups will be
+    performed. When 'automatic', DoH lookups will be performed first if DoH is
     available, and insecure DNS lookups will be performed as a fallback. When
-    "secure", only DoH lookups will be performed. Defaults to "automatic".
+    'secure', only DoH lookups will be performed. Defaults to 'automatic'.
   * `secureDnsServers` string[] (optional) - A list of DNS-over-HTTP
     server templates. See [RFC8484 § 3][] for details on the template format.
     Most servers support the POST method; the template for such servers is

docs/api/browser-view.md

@@ -16,7 +16,7 @@ module is emitted.
 
 ### Example
 
-```javascript
+```js
 // In the main process.
 const { app, BrowserView, BrowserWindow } = require('electron')
 

docs/api/browser-window.md

@@ -7,7 +7,7 @@ Process: [Main](../glossary.md#main-process)
 This module cannot be used until the `ready` event of the `app`
 module is emitted.
 
-```javascript
+```js
 // In the main process.
 const { BrowserWindow } = require('electron')
 
@@ -38,7 +38,7 @@ While loading the page, the `ready-to-show` event will be emitted when the rende
 process has rendered the page for the first time if the window has not been shown yet. Showing
 the window after this event will have no visual flash:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({ show: false })
 win.once('ready-to-show', () => {
@@ -59,7 +59,7 @@ For a complex app, the `ready-to-show` event could be emitted too late, making
 the app feel slow. In this case, it is recommended to show the window
 immediately, and use a `backgroundColor` close to your app's background:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const win = new BrowserWindow({ backgroundColor: '#2e2c29' })
@@ -85,7 +85,7 @@ For more information about these color types see valid options in [win.setBackgr
 
 By using `parent` option, you can create child windows:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const top = new BrowserWindow()
@@ -101,7 +101,7 @@ The `child` window will always show on top of the `top` window.
 A modal window is a child window that disables parent window, to create a modal
 window, you have to set both `parent` and `modal` options:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const top = new BrowserWindow()
@@ -188,7 +188,7 @@ window should be closed, which will also be called when the window is
 reloaded. In Electron, returning any value other than `undefined` would cancel the
 close. For example:
 
-```javascript
+```js
 window.onbeforeunload = (e) => {
   console.log('I do not want to be closed')
 
@@ -351,7 +351,7 @@ Commands are lowercased, underscores are replaced with hyphens, and the
 `APPCOMMAND_` prefix is stripped off.
 e.g. `APPCOMMAND_BROWSER_BACKWARD` is emitted as `browser-backward`.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 win.on('app-command', (e, cmd) => {
@@ -486,7 +486,7 @@ Returns `BrowserWindow | null` - The window with the given `id`.
 
 Objects created with `new BrowserWindow` have the following properties:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 // In this example `win` is our instance
 const win = new BrowserWindow({ width: 800, height: 600 })
@@ -505,6 +505,10 @@ events.
 
 A `Integer` property representing the unique ID of the window. Each ID is unique among all `BrowserWindow` instances of the entire Electron application.
 
+#### `win.tabbingIdentifier` _macOS_ _Readonly_
+
+A `string` (optional) property that is equal to the `tabbingIdentifier` passed to the `BrowserWindow` constructor or `undefined` if none was set.
+
 #### `win.autoHideMenuBar`
 
 A `boolean` property that determines whether the window menu bar should hide itself automatically. Once set, the menu bar will only show when users press the single `Alt` key.
@@ -806,7 +810,7 @@ Closes the currently open [Quick Look][quick-look] panel.
 
 Resizes and moves the window to the supplied bounds. Any properties that are not supplied will default to their current values.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 
@@ -1061,7 +1065,7 @@ Changes the attachment point for sheets on macOS. By default, sheets are
 attached just below the window frame, but you may want to display them beneath
 a HTML-rendered toolbar. For example:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 
@@ -1204,7 +1208,7 @@ To ensure that file URLs are properly formatted, it is recommended to use
 Node's [`url.format`](https://nodejs.org/api/url.html#url_url_format_urlobject)
 method:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 
@@ -1220,7 +1224,7 @@ win.loadURL(url)
 You can load a URL using a `POST` request with URL-encoded data by doing
 the following:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 

docs/api/client-request.md

@@ -65,7 +65,7 @@ strictly follow the Node.js model as described in the
 
 For instance, we could have created the same request to 'github.com' as follows:
 
-```javascript
+```js
 const request = net.request({
   method: 'GET',
   protocol: 'https:',
@@ -104,7 +104,7 @@ The `callback` function is expected to be called back with user credentials:
 * `username` string
 * `password` string
 
-```javascript @ts-type={request:Electron.ClientRequest}
+```js @ts-type={request:Electron.ClientRequest}
 request.on('login', (authInfo, callback) => {
   callback('username', 'password')
 })
@@ -113,7 +113,7 @@ request.on('login', (authInfo, callback) => {
 Providing empty credentials will cancel the request and report an authentication
 error on the response object:
 
-```javascript @ts-type={request:Electron.ClientRequest}
+```js @ts-type={request:Electron.ClientRequest}
 request.on('response', (response) => {
   console.log(`STATUS: ${response.statusCode}`)
   response.on('error', (error) => {

docs/api/clipboard.md

@@ -7,7 +7,7 @@ Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer
 On Linux, there is also a `selection` clipboard. To manipulate it
 you need to pass `selection` to each method:
 
-```javascript
+```js
 const { clipboard } = require('electron')
 
 clipboard.writeText('Example string', 'selection')

docs/api/command-line-switches.md

@@ -6,7 +6,7 @@ You can use [app.commandLine.appendSwitch][append-switch] to append them in
 your app's main script before the [ready][ready] event of the [app][app] module
 is emitted:
 
-```javascript
+```js
 const { app } = require('electron')
 app.commandLine.appendSwitch('remote-debugging-port', '8315')
 app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1')
@@ -185,7 +185,7 @@ list of hosts. This flag has an effect only if used in tandem with
 
 For example:
 
-```javascript
+```js
 const { app } = require('electron')
 app.commandLine.appendSwitch('proxy-bypass-list', '<local>;*.google.com;*foo.com;1.2.3.4:5678')
 ```

docs/api/command-line.md

@@ -7,7 +7,7 @@ _This class is not exported from the `'electron'` module. It is only available a
 
 The following example shows how to check if the `--disable-gpu` flag is set.
 
-```javascript
+```js
 const { app } = require('electron')
 app.commandLine.hasSwitch('disable-gpu')
 ```

docs/api/content-tracing.md

@@ -10,7 +10,7 @@ This module does not include a web interface. To view recorded traces, use
 **Note:** You should not use this module until the `ready` event of the app
 module is emitted.
 
-```javascript
+```js
 const { app, contentTracing } = require('electron')
 
 app.whenReady().then(() => {

docs/api/context-bridge.md

@@ -6,7 +6,7 @@ Process: [Renderer](../glossary.md#renderer-process)
 
 An example of exposing an API to a renderer from an isolated preload script is given below:
 
-```javascript
+```js
 // Preload (Isolated World)
 const { contextBridge, ipcRenderer } = require('electron')
 
@@ -18,7 +18,7 @@ contextBridge.exposeInMainWorld(
 )
 ```
 
-```javascript @ts-nocheck
+```js @ts-nocheck
 // Renderer (Main World)
 
 window.electron.doThing()
@@ -64,7 +64,7 @@ the API become immutable and updates on either side of the bridge do not result
 
 An example of a complex API is shown below:
 
-```javascript
+```js
 const { contextBridge, ipcRenderer } = require('electron')
 
 contextBridge.exposeInMainWorld(
@@ -92,7 +92,7 @@ contextBridge.exposeInMainWorld(
 
 An example of `exposeInIsolatedWorld` is shown below:
 
-```javascript
+```js
 const { contextBridge, ipcRenderer } = require('electron')
 
 contextBridge.exposeInIsolatedWorld(
@@ -104,7 +104,7 @@ contextBridge.exposeInIsolatedWorld(
 )
 ```
 
-```javascript @ts-nocheck
+```js @ts-nocheck
 // Renderer (In isolated world id1004)
 
 window.electron.doThing()
@@ -145,7 +145,7 @@ The table of supported types described above also applies to Node APIs that you
 Please note that many Node APIs grant access to local system resources.
 Be very cautious about which globals and APIs you expose to untrusted remote content.
 
-```javascript
+```js
 const { contextBridge } = require('electron')
 const crypto = require('node:crypto')
 contextBridge.exposeInMainWorld('nodeCrypto', {

docs/api/cookies.md

@@ -10,7 +10,7 @@ a `Session`.
 
 For example:
 
-```javascript
+```js
 const { session } = require('electron')
 
 // Query all cookies.

docs/api/crash-reporter.md

@@ -7,7 +7,7 @@ Process: [Main](../glossary.md#main-process), [Renderer](../glossary.md#renderer
 The following is an example of setting up Electron to automatically submit
 crash reports to a remote server:
 
-```javascript
+```js
 const { crashReporter } = require('electron')
 
 crashReporter.start({ submitURL: 'https://your-domain.com/url-to-submit' })

docs/api/debugger.md

@@ -8,7 +8,7 @@ _This class is not exported from the `'electron'` module. It is only available a
 Chrome Developer Tools has a [special binding][rdp] available at JavaScript
 runtime that allows interacting with pages and instrumenting them.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 

docs/api/desktop-capturer.md

@@ -8,7 +8,7 @@ Process: [Main](../glossary.md#main-process)
 The following example shows how to capture video from a desktop window whose
 title is `Electron`:
 
-```javascript
+```js
 // In the main process.
 const { BrowserWindow, desktopCapturer } = require('electron')
 
@@ -24,7 +24,7 @@ desktopCapturer.getSources({ types: ['window', 'screen'] }).then(async sources =
 })
 ```
 
-```javascript @ts-nocheck
+```js @ts-nocheck
 // In the preload script.
 const { ipcRenderer } = require('electron')
 
@@ -68,7 +68,7 @@ To capture both audio and video from the entire desktop the constraints passed
 to [`navigator.mediaDevices.getUserMedia`][] must include `chromeMediaSource: 'desktop'`,
 for both `audio` and `video`, but should not include a `chromeMediaSourceId` constraint.
 
-```javascript
+```js
 const constraints = {
   audio: {
     mandatory: {

docs/api/dialog.md

@@ -6,7 +6,7 @@ Process: [Main](../glossary.md#main-process)
 
 An example of showing a dialog to select multiple files:
 
-```javascript
+```js
 const { dialog } = require('electron')
 console.log(dialog.showOpenDialog({ properties: ['openFile', 'multiSelections'] }))
 ```
@@ -52,7 +52,7 @@ The `browserWindow` argument allows the dialog to attach itself to a parent wind
 The `filters` specifies an array of file types that can be displayed or
 selected when you want to limit the user to a specific type. For example:
 
-```javascript
+```js
 {
   filters: [
     { name: 'Images', extensions: ['jpg', 'png', 'gif'] },
@@ -119,7 +119,7 @@ The `browserWindow` argument allows the dialog to attach itself to a parent wind
 The `filters` specifies an array of file types that can be displayed or
 selected when you want to limit the user to a specific type. For example:
 
-```javascript
+```js
 {
   filters: [
     { name: 'Images', extensions: ['jpg', 'png', 'gif'] },

docs/api/dock.md

@@ -7,7 +7,7 @@ _This class is not exported from the `'electron'` module. It is only available a
 
 The following example shows how to bounce your icon on the dock.
 
-```javascript
+```js
 const { app } = require('electron')
 app.dock.bounce()
 ```

docs/api/download-item.md

@@ -9,7 +9,7 @@ _This class is not exported from the `'electron'` module. It is only available a
 It is used in `will-download` event of `Session` class, and allows users to
 control the download item.
 
-```javascript
+```js
 // In the main process.
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()

docs/api/environment-variables.md

@@ -59,7 +59,7 @@ geolocation webservice. To enable this feature, acquire a
 and place the following code in your main process file, before opening any
 browser windows that will make geolocation requests:
 
-```javascript
+```js
 process.env.GOOGLE_API_KEY = 'YOUR_KEY_HERE'
 ```
 

docs/api/global-shortcut.md

@@ -12,7 +12,7 @@ shortcuts.
 not have the keyboard focus. This module cannot be used before the `ready`
 event of the app module is emitted.
 
-```javascript
+```js
 const { app, globalShortcut } = require('electron')
 
 app.whenReady().then(() => {

docs/api/incoming-message.md

@@ -89,7 +89,7 @@ tuples. So, the even-numbered offsets are key values, and the odd-numbered
 offsets are the associated values. Header names are not lowercased, and
 duplicates are not merged.
 
-```javascript @ts-type={response:Electron.IncomingMessage}
+```js @ts-type={response:Electron.IncomingMessage}
 // Prints something like:
 //
 // [ 'user-agent',

docs/api/ipc-renderer.md

@@ -101,7 +101,7 @@ The main process should listen for `channel` with
 
 For example:
 
-```javascript @ts-type={someArgument:unknown} @ts-type={doSomeWork:(arg:unknown)=>Promise<unknown>}
+```js @ts-type={someArgument:unknown} @ts-type={doSomeWork:(arg:unknown)=>Promise<unknown>}
 // Renderer process
 ipcRenderer.invoke('some-name', someArgument).then((result) => {
   // ...

docs/api/menu.md

@@ -151,7 +151,7 @@ can have a submenu.
 
 An example of creating the application menu with the simple template API:
 
-```javascript @ts-expect-error=[107]
+```js @ts-expect-error=[107]
 const { app, Menu } = require('electron')
 
 const isMac = process.platform === 'darwin'
@@ -353,7 +353,7 @@ By default, items will be inserted in the order they exist in the template unles
 
 Template:
 
-```javascript
+```js
 [
   { id: '1', label: 'one' },
   { id: '2', label: 'two' },
@@ -373,7 +373,7 @@ Menu:
 
 Template:
 
-```javascript
+```js
 [
   { id: '1', label: 'one' },
   { type: 'separator' },
@@ -397,7 +397,7 @@ Menu:
 
 Template:
 
-```javascript
+```js
 [
   { id: '1', label: 'one', after: ['3'] },
   { id: '2', label: 'two', before: ['1'] },

docs/api/native-image.md

@@ -10,7 +10,7 @@ In Electron, for the APIs that take images, you can pass either file paths or
 For example, when creating a tray or setting a window's icon, you can pass an
 image file path as a `string`:
 
-```javascript
+```js
 const { BrowserWindow, Tray } = require('electron')
 
 const appIcon = new Tray('/Users/somebody/images/icon.png')
@@ -20,7 +20,7 @@ console.log(appIcon, win)
 
 Or read the image from the clipboard, which returns a `NativeImage`:
 
-```javascript
+```js
 const { clipboard, Tray } = require('electron')
 const image = clipboard.readImage()
 const appIcon = new Tray(image)
@@ -71,7 +71,7 @@ images/
 └── icon@3x.png
 ```
 
-```javascript
+```js
 const { Tray } = require('electron')
 const appIcon = new Tray('/Users/somebody/images/icon.png')
 console.log(appIcon)
@@ -138,7 +138,7 @@ Creates a new `NativeImage` instance from a file located at `path`. This method
 returns an empty image if the `path` does not exist, cannot be read, or is not
 a valid image.
 
-```javascript
+```js
 const nativeImage = require('electron').nativeImage
 
 const image = nativeImage.createFromPath('/Users/somebody/images/icon.png')

docs/api/net-log.md

@@ -4,7 +4,7 @@
 
 Process: [Main](../glossary.md#main-process)
 
-```javascript
+```js
 const { app, netLog } = require('electron')
 
 app.whenReady().then(async () => {

docs/api/net.md

@@ -26,7 +26,7 @@ Node.js.
 
 Example usage:
 
-```javascript
+```js
 const { app } = require('electron')
 app.whenReady().then(() => {
   const { net } = require('electron')

docs/api/notification.md

@@ -85,6 +85,8 @@ Emitted when the notification is closed by manual intervention from the user.
 This event is not guaranteed to be emitted in all cases where the notification
 is closed.
 
+On Windows, the `close` event can be emitted in one of three ways: programmatic dismissal with `notification.close()`, by the user closing the notification, or via system timeout. If a notification is in the Action Center after the initial `close` event is emitted, a call to `notification.close()` will remove the notification from the action center but the `close` event will not be emitted again.
+
 #### Event: 'reply' _macOS_
 
 Returns:
@@ -127,6 +129,8 @@ shown notification and create a new one with identical properties.
 
 Dismisses the notification.
 
+On Windows, calling `notification.close()` while the notification is visible on screen will dismiss the notification and remove it from the Action Center. If `notification.close()` is called after the notification is no longer visible on screen, calling `notification.close()` will try remove it from the Action Center.
+
 ### Instance Properties
 
 #### `notification.title`

docs/api/power-save-blocker.md

@@ -6,7 +6,7 @@ Process: [Main](../glossary.md#main-process)
 
 For example:
 
-```javascript
+```js
 const { powerSaveBlocker } = require('electron')
 
 const id = powerSaveBlocker.start('prevent-display-sleep')

docs/api/protocol.md

@@ -7,7 +7,7 @@ Process: [Main](../glossary.md#main-process)
 An example of implementing a protocol that has the same effect as the
 `file://` protocol:
 
-```javascript
+```js
 const { app, protocol, net } = require('electron')
 
 app.whenReady().then(() => {
@@ -31,7 +31,7 @@ a different session and your custom protocol will not work if you just use
 To have your custom protocol work in combination with a custom session, you need
 to register it to that session explicitly.
 
-```javascript
+```js
 const { app, BrowserWindow, net, protocol, session } = require('electron')
 const path = require('node:path')
 const url = require('url')
@@ -61,13 +61,14 @@ The `protocol` module has the following methods:
 module gets emitted and can be called only once.
 
 Registers the `scheme` as standard, secure, bypasses content security policy for
-resources, allows registering ServiceWorker, supports fetch API, and streaming
-video/audio. Specify a privilege with the value of `true` to enable the capability.
+resources, allows registering ServiceWorker, supports fetch API, streaming
+video/audio, and V8 code cache. Specify a privilege with the value of `true` to
+enable the capability.
 
 An example of registering a privileged scheme, that bypasses Content Security
 Policy:
 
-```javascript
+```js
 const { protocol } = require('electron')
 protocol.registerSchemesAsPrivileged([
   { scheme: 'foo', privileges: { bypassCSP: true } }
@@ -212,7 +213,7 @@ property.
 
 Example:
 
-```javascript
+```js
 protocol.registerBufferProtocol('atom', (request, callback) => {
   callback({ mimeType: 'text/html', data: Buffer.from('<h5>Response</h5>') })
 })
@@ -267,7 +268,7 @@ has the `data` property.
 
 Example:
 
-```javascript
+```js
 const { protocol } = require('electron')
 const { PassThrough } = require('stream')
 
@@ -292,7 +293,7 @@ protocol.registerStreamProtocol('atom', (request, callback) => {
 It is possible to pass any object that implements the readable stream API (emits
 `data`/`end`/`error` events). For example, here's how a file could be returned:
 
-```javascript
+```js
 protocol.registerStreamProtocol('atom', (request, callback) => {
   callback(fs.createReadStream('index.html'))
 })

docs/api/push-notifications.md

@@ -6,7 +6,7 @@ Process: [Main](../glossary.md#main-process)
 
 For example, when registering for push notifications via Apple push notification services (APNS):
 
-```javascript
+```js
 const { pushNotifications, Notification } = require('electron')
 
 pushNotifications.registerForAPNSNotifications().then((token) => {

docs/api/screen.md

@@ -14,20 +14,32 @@ property, so writing `let { screen } = require('electron')` will not work.
 
 An example of creating a window that fills the whole screen:
 
-```javascript fiddle='docs/fiddles/screen/fit-screen'
-const { app, BrowserWindow, screen } = require('electron')
+```fiddle docs/fiddles/screen/fit-screen
+// Retrieve information about screen size, displays, cursor position, etc.
+//
+// For more info, see:
+// https://www.electronjs.org/docs/latest/api/screen
+
+const { app, BrowserWindow } = require('electron')
+
+let mainWindow = null
 
-let win
 app.whenReady().then(() => {
-  const { width, height } = screen.getPrimaryDisplay().workAreaSize
-  win = new BrowserWindow({ width, height })
-  win.loadURL('https://github.com')
+  // We cannot require the screen module until the app is ready.
+  const { screen } = require('electron')
+
+  // Create a window that fills the screen's available work area.
+  const primaryDisplay = screen.getPrimaryDisplay()
+  const { width, height } = primaryDisplay.workAreaSize
+
+  mainWindow = new BrowserWindow({ width, height })
+  mainWindow.loadURL('https://electronjs.org')
 })
 ```
 
 Another example of creating a window in the external display:
 
-```javascript
+```js
 const { app, BrowserWindow, screen } = require('electron')
 
 let win

docs/api/service-workers.md

@@ -10,7 +10,7 @@ a `Session`.
 
 For example:
 
-```javascript
+```js
 const { session } = require('electron')
 
 // Get all service workers.

docs/api/session.md

@@ -9,7 +9,7 @@ The `session` module can be used to create new `Session` objects.
 You can also access the `session` of existing pages by using the `session`
 property of [`WebContents`](web-contents.md), or from the `session` module.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const win = new BrowserWindow({ width: 800, height: 600 })
@@ -75,7 +75,7 @@ _This class is not exported from the `'electron'` module. It is only available a
 
 You can create a `Session` object in the `session` module:
 
-```javascript
+```js
 const { session } = require('electron')
 const ses = session.fromPartition('persist:name')
 console.log(ses.getUserAgent())
@@ -98,7 +98,7 @@ Emitted when Electron is about to download `item` in `webContents`.
 Calling `event.preventDefault()` will cancel the download and `item` will not be
 available from next tick of the process.
 
-```javascript @ts-expect-error=[4]
+```js @ts-expect-error=[4]
 const { session } = require('electron')
 session.defaultSession.on('will-download', (event, item, webContents) => {
   event.preventDefault()
@@ -214,7 +214,7 @@ cancel the request.  Additionally, permissioning on `navigator.hid` can
 be further managed by using [`ses.setPermissionCheckHandler(handler)`](#sessetpermissioncheckhandlerhandler)
 and [`ses.setDevicePermissionHandler(handler)`](#sessetdevicepermissionhandlerhandler).
 
-```javascript @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
+```js @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
 const { app, BrowserWindow } = require('electron')
 
 let win = null
@@ -266,7 +266,7 @@ Returns:
 
 * `event` Event
 * `details` Object
-  * `device` [HIDDevice[]](structures/hid-device.md)
+  * `device` [HIDDevice](structures/hid-device.md)
   * `frame` [WebFrameMain](web-frame-main.md)
 
 Emitted after `navigator.hid.requestDevice` has been called and
@@ -281,7 +281,7 @@ Returns:
 
 * `event` Event
 * `details` Object
-  * `device` [HIDDevice[]](structures/hid-device.md)
+  * `device` [HIDDevice](structures/hid-device.md)
   * `frame` [WebFrameMain](web-frame-main.md)
 
 Emitted after `navigator.hid.requestDevice` has been called and
@@ -296,7 +296,7 @@ Returns:
 
 * `event` Event
 * `details` Object
-  * `device` [HIDDevice[]](structures/hid-device.md)
+  * `device` [HIDDevice](structures/hid-device.md)
   * `origin` string (optional) - The origin that the device has been revoked from.
 
 Emitted after `HIDDevice.forget()` has been called.  This event can be used
@@ -320,7 +320,7 @@ cancel the request.  Additionally, permissioning on `navigator.serial` can
 be managed by using [ses.setPermissionCheckHandler(handler)](#sessetpermissioncheckhandlerhandler)
 with the `serial` permission.
 
-```javascript @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
+```js @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
 const { app, BrowserWindow } = require('electron')
 
 let win = null
@@ -463,7 +463,7 @@ cancel the request.  Additionally, permissioning on `navigator.usb` can
 be further managed by using [`ses.setPermissionCheckHandler(handler)`](#sessetpermissioncheckhandlerhandler)
 and [`ses.setDevicePermissionHandler(handler)`](#sessetdevicepermissionhandlerhandler).
 
-```javascript @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)} @ts-type={updateGrantedDevices:(devices:Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)=>void}
+```js @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)} @ts-type={updateGrantedDevices:(devices:Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)=>void}
 const { app, BrowserWindow } = require('electron')
 
 let win = null
@@ -754,7 +754,7 @@ Sets download saving directory. By default, the download directory will be the
 
 Emulates network with the given configuration for the `session`.
 
-```javascript
+```js
 const win = new BrowserWindow()
 
 // To emulate a GPRS connection with 50kbps throughput and 500 ms latency.
@@ -785,7 +785,7 @@ Returns `Promise<void>` - Resolves when all connections are closed.
 #### `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)
+* `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).
 
@@ -868,7 +868,7 @@ calling `callback(-2)` rejects it.
 Calling `setCertificateVerifyProc(null)` will revert back to default certificate
 verify proc.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 
@@ -901,6 +901,7 @@ win.webContents.session.setCertificateVerifyProc((request, callback) => {
     * `midiSysex` - Request the use of system exclusive messages in the [Web MIDI API](https://developer.mozilla.org/en-US/docs/Web/API/Web_MIDI_API).
     * `notifications` - Request notification creation and the ability to display them in the user's system tray using the [Notifications API](https://developer.mozilla.org/en-US/docs/Web/API/notification)
     * `pointerLock` - Request to directly interpret mouse movements as an input method via the [Pointer Lock API](https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API). These requests always appear to originate from the main frame.
+    * `keyboardLock` - Request capture of keypresses for any or all of the keys on the physical keyboard via the [Keyboard Lock API](https://developer.mozilla.org/en-US/docs/Web/API/Keyboard/lock). These requests always appear to originate from the main frame.
     * `openExternal` - Request to open links in external applications.
     * `window-management` - Request access to enumerate screens using the [`getScreenDetails`](https://developer.chrome.com/en/articles/multi-screen-window-placement/) API.
     * `unknown` - An unrecognized permission request.
@@ -920,7 +921,7 @@ To clear the handler, call `setPermissionRequestHandler(null)`.  Please note tha
 you must also implement `setPermissionCheckHandler` to get complete permission handling.
 Most web APIs do a permission check and then make a permission request if the check is denied.
 
-```javascript
+```js
 const { session } = require('electron')
 session.fromPartition('some-partition').setPermissionRequestHandler((webContents, permission, callback) => {
   if (webContents.getURL() === 'some-host' && permission === 'notifications') {
@@ -966,7 +967,7 @@ you must also implement `setPermissionRequestHandler` to get complete permission
 Most web APIs do a permission check and then make a permission request if the check is denied.
 To clear the handler, call `setPermissionCheckHandler(null)`.
 
-```javascript
+```js
 const { session } = require('electron')
 const url = require('url')
 session.fromPartition('some-partition').setPermissionCheckHandler((webContents, permission, requestingOrigin) => {
@@ -1011,7 +1012,7 @@ via the `navigator.mediaDevices.getDisplayMedia` API. Use the
 [desktopCapturer](desktop-capturer.md) API to choose which stream(s) to grant
 access to.
 
-```javascript
+```js
 const { session, desktopCapturer } = require('electron')
 
 session.defaultSession.setDisplayMediaRequestHandler((request, callback) => {
@@ -1025,7 +1026,7 @@ session.defaultSession.setDisplayMediaRequestHandler((request, callback) => {
 Passing a [WebFrameMain](web-frame-main.md) object as a video or audio stream
 will capture the video or audio stream from that frame.
 
-```javascript
+```js
 const { session } = require('electron')
 
 session.defaultSession.setDisplayMediaRequestHandler((request, callback) => {
@@ -1054,7 +1055,7 @@ Additionally, the default behavior of Electron is to store granted device permis
 If longer term storage is needed, a developer can store granted device
 permissions (eg when handling the `select-hid-device` event) and then read from that storage with `setDevicePermissionHandler`.
 
-```javascript @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
+```js @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
 const { app, BrowserWindow } = require('electron')
 
 let win = null
@@ -1136,7 +1137,7 @@ The return value for the handler is a string array of USB classes which should b
 Returning an empty string array from the handler will allow all USB classes; returning the passed in array will maintain the default list of protected USB classes (this is also the default behavior if a handler is not defined).
 To clear the handler, call `setUSBProtectedClassesHandler(null)`.
 
-```javascript
+```js
 const { app, BrowserWindow } = require('electron')
 
 let win = null
@@ -1191,7 +1192,7 @@ that requires additional validation will be automatically cancelled.
 macOS does not require a handler because macOS handles the pairing
 automatically.  To clear the handler, call `setBluetoothPairingHandler(null)`.
 
-```javascript
+```js
 const { app, BrowserWindow, session } = require('electron')
 const path = require('node:path')
 
@@ -1237,7 +1238,7 @@ Clears the host resolver cache.
 Dynamically sets whether to always send credentials for HTTP NTLM or Negotiate
 authentication.
 
-```javascript
+```js
 const { session } = require('electron')
 // consider any url ending with `example.com`, `foobar.com`, `baz`
 // for integrated authentication.
@@ -1355,6 +1356,10 @@ registered.
 Sets the directory to store the generated JS [code cache](https://v8.dev/blog/code-caching-for-devs) for this session. The directory is not required to be created by the user before this call, the runtime will create if it does not exist otherwise will use the existing directory. If directory cannot be created, then code cache will not be used and all operations related to code cache will fail silently inside the runtime. By default, the directory will be `Code Cache` under the
 respective user data folder.
 
+Note that by default code cache is only enabled for http(s) URLs, to enable code
+cache for custom protocols, `codeCache: true` and `standard: true` must be
+specified when registering the protocol.
+
 #### `ses.clearCodeCaches(options)`
 
 * `options` Object
@@ -1542,7 +1547,7 @@ A [`WebRequest`](web-request.md) object for this session.
 
 A [`Protocol`](protocol.md) object for this session.
 
-```javascript
+```js
 const { app, session } = require('electron')
 const path = require('node:path')
 
@@ -1561,7 +1566,7 @@ app.whenReady().then(() => {
 
 A [`NetLog`](net-log.md) object for this session.
 
-```javascript
+```js
 const { app, session } = require('electron')
 
 app.whenReady().then(async () => {

docs/api/shell.md

@@ -8,7 +8,7 @@ The `shell` module provides functions related to desktop integration.
 
 An example of opening a URL in the user's default browser:
 
-```javascript
+```js
 const { shell } = require('electron')
 
 shell.openExternal('https://github.com')

docs/api/structures/custom-scheme.md

@@ -9,3 +9,5 @@
   * `supportFetchAPI` boolean (optional) - Default false.
   * `corsEnabled` boolean (optional) - Default false.
   * `stream` boolean (optional) - Default false.
+  * `codeCache` boolean (optional) - Enable V8 code cache for the scheme, only
+    works when `standard` is also set to true. Default false.

docs/api/structures/printer-info.md

@@ -14,7 +14,7 @@ The number represented by `status` means different things on different platforms
 Below is an example of some of the additional options that may be set which
 may be different on each platform.
 
-```javascript
+```js
 {
   name: 'Austin_4th_Floor_Printer___C02XK13BJHD4',
   displayName: 'Austin 4th Floor Printer @ C02XK13BJHD4',

docs/api/system-preferences.md

@@ -4,7 +4,7 @@
 
 Process: [Main](../glossary.md#main-process)
 
-```javascript
+```js
 const { systemPreferences } = require('electron')
 console.log(systemPreferences.isAeroGlassEnabled())
 ```
@@ -189,7 +189,7 @@ enabled, and `false` otherwise.
 An example of using it to determine if you should create a transparent window or
 not (transparent windows won't work correctly when DWM composition is disabled):
 
-```javascript
+```js
 const { BrowserWindow, systemPreferences } = require('electron')
 const browserOptions = { width: 1000, height: 800 }
 
@@ -348,7 +348,7 @@ Returns `boolean` - whether or not this device has the ability to use Touch ID.
 
 Returns `Promise<void>` - resolves if the user has successfully authenticated with Touch ID.
 
-```javascript
+```js
 const { systemPreferences } = require('electron')
 
 systemPreferences.promptTouchID('To get consent for a Security-Gated Thing').then(success => {
@@ -401,6 +401,10 @@ Returns an object with system animation settings.
 
 ## Properties
 
+### `systemPreferences.accessibilityDisplayShouldReduceTransparency()` _macOS_
+
+A `boolean` property which determines whether the app avoids using semitransparent backgrounds. This maps to [NSWorkspace.accessibilityDisplayShouldReduceTransparency](https://developer.apple.com/documentation/appkit/nsworkspace/1533006-accessibilitydisplayshouldreduce)
+
 ### `systemPreferences.effectiveAppearance` _macOS_ _Readonly_
 
 A `string` property that can be `dark`, `light` or `unknown`.

docs/api/touch-bar.md

@@ -79,7 +79,7 @@ immediately updates the escape item in the touch bar.
 Below is an example of a simple slot machine touch bar game with a button
 and some labels.
 
-```javascript
+```js
 const { app, BrowserWindow, TouchBar } = require('electron')
 
 const { TouchBarLabel, TouchBarButton, TouchBarSpacer } = TouchBar

docs/api/tray.md

@@ -8,7 +8,7 @@ Process: [Main](../glossary.md#main-process)
 
 `Tray` is an [EventEmitter][event-emitter].
 
-```javascript
+```js
 const { app, Menu, Tray } = require('electron')
 
 let tray = null
@@ -39,7 +39,7 @@ app.whenReady().then(() => {
 * In order for changes made to individual `MenuItem`s to take effect,
   you have to call `setContextMenu` again. For example:
 
-```javascript
+```js
 const { app, Menu, Tray } = require('electron')
 
 let appIcon = null

docs/api/utility-process.md

@@ -29,7 +29,7 @@ Process: [Main](../glossary.md#main-process)<br />
     * `inherit`: equivalent to \['ignore', 'inherit', 'inherit']
   * `serviceName` string (optional) - Name of the process that will appear in `name` property of
     [`child-process-gone` event of `app`](app.md#event-child-process-gone).
-    Default is `node.mojom.NodeService`.
+    Default is `Node Utility Process`.
   * `allowLoadingUnsignedLibraries` boolean (optional) _macOS_ - With this flag, the utility process will be
     launched via the `Electron Helper (Plugin).app` helper executable on macOS, which can be
     codesigned with `com.apple.security.cs.disable-library-validation` and

docs/api/web-contents.md

@@ -9,7 +9,7 @@ It is responsible for rendering and controlling a web page and is a property of
 the [`BrowserWindow`](browser-window.md) object. An example of accessing the
 `webContents` object:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const win = new BrowserWindow({ width: 800, height: 1500 })
@@ -53,7 +53,7 @@ If you want to also observe navigations in `<iframe>`s, use [`will-frame-navigat
 
 These methods can be accessed from the `webContents` module:
 
-```javascript
+```js
 const { webContents } = require('electron')
 console.log(webContents)
 ```
@@ -439,7 +439,7 @@ Emitted when a `beforeunload` event handler is attempting to cancel a page unloa
 Calling `event.preventDefault()` will ignore the `beforeunload` event handler
 and allow the page to be unloaded.
 
-```javascript
+```js
 const { BrowserWindow, dialog } = require('electron')
 const win = new BrowserWindow({ width: 800, height: 600 })
 win.webContents.on('will-prevent-unload', (event) => {
@@ -541,7 +541,7 @@ and the menu shortcuts.
 To only prevent the menu shortcuts, use
 [`setIgnoreMenuShortcuts`](#contentssetignoremenushortcutsignore):
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const win = new BrowserWindow({ width: 800, height: 600 })
@@ -842,7 +842,7 @@ Due to the nature of bluetooth, scanning for devices when
 `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'
+```js title='main.js'
 const { app, BrowserWindow } = require('electron')
 
 let win = null
@@ -877,7 +877,7 @@ Returns:
 Emitted when a new frame is generated. Only the dirty area is passed in the
 buffer.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const win = new BrowserWindow({ webPreferences: { offscreen: true } })
@@ -1009,7 +1009,7 @@ Loads the `url` in the window. The `url` must contain the protocol prefix,
 e.g. the `http://` or `file://`. If the load should bypass http cache then
 use the `pragma` header to achieve it.
 
-```javascript
+```js
 const win = new BrowserWindow()
 const options = { extraHeaders: 'pragma: no-cache\n' }
 win.webContents.loadURL('https://github.com', options)
@@ -1059,7 +1059,7 @@ Initiates a download of the resource at `url` without navigating. The
 
 Returns `string` - The URL of the current web page.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({ width: 800, height: 600 })
 win.loadURL('https://github.com').then(() => {
@@ -1211,7 +1211,7 @@ Returns `string` - The user agent for this web page.
 
 * `css` string
 * `options` Object (optional)
-  * `cssOrigin` string (optional) - Can be either 'user' or 'author'. Sets the [cascade origin](https://www.w3.org/TR/css3-cascade/#cascade-origin) of the inserted stylesheet. Default is 'author'.
+  * `cssOrigin` string (optional) - Can be 'user' or 'author'. Sets the [cascade origin](https://www.w3.org/TR/css3-cascade/#cascade-origin) of the inserted stylesheet. Default is 'author'.
 
 Returns `Promise<string>` - A promise that resolves with a key for the inserted CSS that can later be used to remove the CSS via `contents.removeInsertedCSS(key)`.
 
@@ -1508,7 +1508,7 @@ can be obtained by subscribing to [`found-in-page`](web-contents.md#event-found-
 
 Stops any `findInPage` request for the `webContents` with the provided `action`.
 
-```javascript
+```js
 const win = new BrowserWindow()
 win.webContents.on('found-in-page', (event, result) => {
   if (result.finalUpdate) win.webContents.stopFindInPage('clearSelection')
@@ -1627,7 +1627,7 @@ The `landscape` will be ignored if `@page` CSS at-rule is used in the web page.
 
 An example of `webContents.printToPDF`:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const fs = require('node:fs')
 const path = require('node:path')
@@ -1659,7 +1659,7 @@ See [Page.printToPdf](https://chromedevtools.github.io/devtools-protocol/tot/Pag
 Adds the specified path to DevTools workspace. Must be used after DevTools
 creation:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 win.webContents.on('devtools-opened', () => {
@@ -1982,7 +1982,7 @@ the cursor when dragging.
 
 Returns `Promise<void>` - resolves if the page is saved.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 

docs/api/web-frame-main.md

@@ -8,7 +8,7 @@ The `webFrameMain` module can be used to lookup frames across existing
 [`WebContents`](web-contents.md) instances. Navigation events are the common
 use case.
 
-```javascript
+```js
 const { BrowserWindow, webFrameMain } = require('electron')
 
 const win = new BrowserWindow({ width: 800, height: 1500 })
@@ -29,7 +29,7 @@ win.webContents.on(
 You can also access frames of existing pages by using the `mainFrame` property
 of [`WebContents`](web-contents.md).
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 async function main () {

docs/api/web-frame.md

@@ -10,7 +10,7 @@ certain properties and methods (e.g. `webFrame.firstChild`).
 
 An example of zooming current page to 200%.
 
-```javascript
+```js
 const { webFrame } = require('electron')
 
 webFrame.setZoomFactor(2)
@@ -96,7 +96,7 @@ with an array of misspelt words when complete.
 
 An example of using [node-spellchecker][spellchecker] as provider:
 
-```javascript @ts-expect-error=[2,6]
+```js @ts-expect-error=[2,6]
 const { webFrame } = require('electron')
 const spellChecker = require('spellchecker')
 webFrame.setSpellCheckProvider('en-US', {
@@ -113,7 +113,7 @@ webFrame.setSpellCheckProvider('en-US', {
 
 * `css` string
 * `options` Object (optional)
-  * `cssOrigin` string (optional) - Can be either 'user' or 'author'. Sets the [cascade origin](https://www.w3.org/TR/css3-cascade/#cascade-origin) of the inserted stylesheet. Default is 'author'.
+  * `cssOrigin` string (optional) - Can be 'user' or 'author'. Sets the [cascade origin](https://www.w3.org/TR/css3-cascade/#cascade-origin) of the inserted stylesheet. Default is 'author'.
 
 Returns `string` - A key for the inserted CSS that can later be used to remove
 the CSS via `webFrame.removeInsertedCSS(key)`.
@@ -205,14 +205,14 @@ Returns `Object`:
 Returns an object describing usage information of Blink's internal memory
 caches.
 
-```javascript
+```js
 const { webFrame } = require('electron')
 console.log(webFrame.getResourceUsage())
 ```
 
 This will generate:
 
-```javascript
+```js
 {
   images: {
     count: 22,

docs/api/web-request.md

@@ -23,7 +23,7 @@ called with a `response` object when `listener` has done its work.
 
 An example of adding `User-Agent` header for requests:
 
-```javascript
+```js
 const { session } = require('electron')
 
 // Modify the user agent for all requests to the following urls.

docs/api/webview-tag.md

@@ -255,7 +255,7 @@ The `webview` tag has the following methods:
 
 **Example**
 
-```javascript @ts-expect-error=[3]
+```js @ts-expect-error=[3]
 const webview = document.querySelector('webview')
 webview.addEventListener('dom-ready', () => {
   webview.openDevTools()
@@ -801,7 +801,7 @@ Fired when the guest window logs a console message.
 The following example code forwards all log messages to the embedder's console
 without regard for log level or other properties.
 
-```javascript @ts-expect-error=[3]
+```js @ts-expect-error=[3]
 const webview = document.querySelector('webview')
 webview.addEventListener('console-message', (e) => {
   console.log('Guest page logged a message:', e.message)
@@ -822,7 +822,7 @@ Returns:
 Fired when a result is available for
 [`webview.findInPage`](#webviewfindinpagetext-options) request.
 
-```javascript @ts-expect-error=[3,6]
+```js @ts-expect-error=[3,6]
 const webview = document.querySelector('webview')
 webview.addEventListener('found-in-page', (e) => {
   webview.stopFindInPage('keepSelection')
@@ -947,7 +947,7 @@ Fired when the guest page attempts to close itself.
 The following example code navigates the `webview` to `about:blank` when the
 guest attempts to close itself.
 
-```javascript @ts-expect-error=[3]
+```js @ts-expect-error=[3]
 const webview = document.querySelector('webview')
 webview.addEventListener('close', () => {
   webview.src = 'about:blank'
@@ -967,7 +967,7 @@ Fired when the guest page has sent an asynchronous message to embedder page.
 With `sendToHost` method and `ipc-message` event you can communicate
 between guest page and embedder page:
 
-```javascript @ts-expect-error=[4,7]
+```js @ts-expect-error=[4,7]
 // In embedder page.
 const webview = document.querySelector('webview')
 webview.addEventListener('ipc-message', (event) => {
@@ -977,7 +977,7 @@ webview.addEventListener('ipc-message', (event) => {
 webview.send('ping')
 ```
 
-```javascript
+```js
 // In guest page.
 const { ipcRenderer } = require('electron')
 ipcRenderer.on('ping', () => {

docs/api/window-open.md

@@ -80,7 +80,7 @@ window will not close when the opener window closes. The default value is `false
 
 ### Native `Window` example
 
-```javascript
+```js
 // main.js
 const mainWindow = new BrowserWindow()
 
@@ -104,7 +104,7 @@ mainWindow.webContents.setWindowOpenHandler(({ url }) => {
 })
 ```
 
-```javascript
+```js
 // renderer process (mainWindow)
 const childWindow = window.open('', 'modal')
 childWindow.document.write('<h1>Hello</h1>')

docs/breaking-changes.md

@@ -45,6 +45,18 @@ systemPreferences.on('high-contrast-color-scheme-changed', () => { /* ... */ })
 nativeTheme.on('updated', () => { /* ... */ })
 ```
 
+### Removed: Some `window.setVibrancy` options on macOS
+
+The following vibrancy options have been removed:
+
+* 'light'
+* 'medium-light'
+* 'dark'
+* 'ultra-dark'
+* 'appearance-based'
+
+These were previously deprecated and have been removed by Apple in 10.15.
+
 ### Removed: `webContents.getPrinters`
 
 The `webContents.getPrinters` method has been removed. Use
@@ -424,7 +436,7 @@ The `new-window` event of `<webview>` has been removed. There is no direct repla
 webview.addEventListener('new-window', (event) => {})
 ```
 
-```javascript fiddle='docs/fiddles/ipc/webview-new-window'
+```js
 // Replace with
 
 // main.js
@@ -1089,7 +1101,7 @@ module](https://medium.com/@nornagon/electrons-remote-module-considered-harmful-
 
 The APIs are now synchronous and the optional callback is no longer needed.
 
-```javascript
+```js
 // Deprecated
 protocol.unregisterProtocol(scheme, () => { /* ... */ })
 // Replace with
@@ -1118,7 +1130,7 @@ protocol.unregisterProtocol(scheme)
 
 The APIs are now synchronous and the optional callback is no longer needed.
 
-```javascript
+```js
 // Deprecated
 protocol.registerFileProtocol(scheme, handler, () => { /* ... */ })
 // Replace with
@@ -1133,7 +1145,7 @@ until navigation happens.
 This API is deprecated and users should use `protocol.isProtocolRegistered`
 and `protocol.isProtocolIntercepted` instead.
 
-```javascript
+```js
 // Deprecated
 protocol.isProtocolHandled(scheme).then(() => { /* ... */ })
 // Replace with

docs/development/creating-api.md

@@ -164,7 +164,7 @@ An example of the contents of this file can be found [here](https://github.com/e
 
 Add your module to the module list found at `"lib/browser/api/module-list.ts"` like so:
 
-```typescript title='lib/browser/api/module-list.ts' @ts-nocheck
+```ts title='lib/browser/api/module-list.ts' @ts-nocheck
 export const browserModuleList: ElectronInternal.ModuleEntry[] = [
   { name: 'apiName', loader: () => require('./api-name') },
 ];

docs/faq.md

@@ -65,7 +65,7 @@ If you encounter this problem, the following articles may prove helpful:
 If you want a quick fix, you can make the variables global by changing your
 code from this:
 
-```javascript
+```js
 const { app, Tray } = require('electron')
 app.whenReady().then(() => {
   const tray = new Tray('/path/to/icon.png')
@@ -75,7 +75,7 @@ app.whenReady().then(() => {
 
 to this:
 
-```javascript
+```js
 const { app, Tray } = require('electron')
 let tray = null
 app.whenReady().then(() => {
@@ -92,7 +92,7 @@ for some libraries since they want to insert the symbols with the same names.
 
 To solve this, you can turn off node integration in Electron:
 
-```javascript
+```js
 // In the main process.
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({
@@ -141,7 +141,7 @@ Sub-pixel anti-aliasing needs a non-transparent background of the layer containi
 
 To achieve this goal, set the background in the constructor for [BrowserWindow][browser-window]:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({
   backgroundColor: '#fff'

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

@@ -7,14 +7,20 @@ function createWindow () {
     height: 600
   })
 
+  win.setRepresentedFilename(os.homedir())
+  win.setDocumentEdited(true)
+
   win.loadFile('index.html')
 }
 
 app.whenReady().then(() => {
-  const win = new BrowserWindow()
+  createWindow()
 
-  win.setRepresentedFilename(os.homedir())
-  win.setDocumentEdited(true)
+  app.on('activate', () => {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow()
+    }
+  })
 })
 
 app.on('window-all-closed', () => {
@@ -22,9 +28,3 @@ app.on('window-all-closed', () => {
     app.quit()
   }
 })
-
-app.on('activate', () => {
-  if (BrowserWindow.getAllWindows().length === 0) {
-    createWindow()
-  }
-})

docs/tutorial/application-debugging.md

@@ -12,7 +12,7 @@ including instances of `BrowserWindow`, `BrowserView`, and `WebView`. You
 can open them programmatically by calling the `openDevTools()` API on the
 `webContents` of the instance:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const win = new BrowserWindow()

docs/tutorial/asar-archives.md

@@ -41,27 +41,27 @@ $ asar list /path/to/example.asar
 
 Read a file in the ASAR archive:
 
-```javascript
+```js
 const fs = require('node:fs')
 fs.readFileSync('/path/to/example.asar/file.txt')
 ```
 
 List all files under the root of the archive:
 
-```javascript
+```js
 const fs = require('node:fs')
 fs.readdirSync('/path/to/example.asar')
 ```
 
 Use a module from the archive:
 
-```javascript @ts-nocheck
+```js @ts-nocheck
 require('./path/to/example.asar/dir/module.js')
 ```
 
 You can also display a web page in an ASAR archive with `BrowserWindow`:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 
@@ -90,7 +90,7 @@ For some cases like verifying the ASAR archive's checksum, we need to read the
 content of an ASAR archive as a file. For this purpose you can use the built-in
 `original-fs` module which provides original `fs` APIs without `asar` support:
 
-```javascript
+```js
 const originalFs = require('original-fs')
 originalFs.readFileSync('/path/to/example.asar')
 ```
@@ -98,7 +98,7 @@ originalFs.readFileSync('/path/to/example.asar')
 You can also set `process.noAsar` to `true` to disable the support for `asar` in
 the `fs` module:
 
-```javascript
+```js
 const fs = require('node:fs')
 process.noAsar = true
 fs.readFileSync('/path/to/example.asar')

docs/tutorial/automated-testing.md

@@ -22,34 +22,101 @@ There are a few ways that you can set up testing using WebDriver.
 Node.js package for testing with WebDriver. Its ecosystem also includes various plugins
 (e.g. reporter and services) that can help you put together your test setup.
 
+If you already have an existing WebdriverIO setup, it is recommended to update your dependencies and validate your existing configuration with how it is [outlined in the docs](https://webdriver.io/docs/desktop-testing/electron#configuration).
+
 #### Install the test runner
 
-First you need to run the WebdriverIO starter toolkit in your project root directory:
+If you don't use WebdriverIO in your project yet, you can add it by running the starter toolkit in your project root directory:
 
 ```sh npm2yarn
-npx wdio . --yes
+npm init wdio@latest ./
 ```
 
-This installs all necessary packages for you and generates a `wdio.conf.js` configuration file.
+This starts a configuration wizard that helps you put together the right setup, installs all necessary packages, and generates a `wdio.conf.js` configuration file. Make sure to select _"Desktop Testing - of Electron Applications"_ on one of the first questions asking _"What type of testing would you like to do?"_.
 
 #### Connect WDIO to your Electron app
 
-Update the capabilities in your configuration file to point to your Electron app binary:
+After running the configuration wizard, your `wdio.conf.js` should include roughly the following content:
 
-```javascript title='wdio.conf.js'
-exports.config = {
+```js title='wdio.conf.js' @ts-nocheck
+export const config = {
   // ...
+  services: ['electron'],
   capabilities: [{
-    browserName: 'chrome',
-    'goog:chromeOptions': {
-      binary: '/path/to/your/electron/binary', // Path to your Electron binary.
-      args: [/* cli arguments */] // Optional, perhaps 'app=' + /path/to/your/app/
+    browserName: 'electron',
+    'wdio:electronServiceOptions': {
+      // WebdriverIO can automatically find your bundled application
+      // if you use Electron Forge or electron-builder, otherwise you
+      // can define it here, e.g.:
+      // appBinaryPath: './path/to/bundled/application.exe',
+      appArgs: ['foo', 'bar=baz']
     }
   }]
   // ...
 }
 ```
 
+#### Write your tests
+
+Use the [WebdriverIO API](https://webdriver.io/docs/api) to interact with elements on the screen. The framework provides custom "matchers" that make asserting the state of your application easy, e.g.:
+
+```js @ts-nocheck
+import { browser, $, expect } from '@wdio/globals'
+
+describe('keyboard input', () => {
+  it('should detect keyboard input', async () => {
+    await browser.keys(['y', 'o'])
+    await expect($('keypress-count')).toHaveText('YO')
+  })
+})
+```
+
+Furthermore, WebdriverIO allows you to access Electron APIs to get static information about your application:
+
+```js @ts-nocheck
+import { browser, $, expect } from '@wdio/globals'
+
+describe('when the make smaller button is clicked', () => {
+  it('should decrease the window height and width by 10 pixels', async () => {
+    const boundsBefore = await browser.electron.browserWindow('getBounds')
+    expect(boundsBefore.width).toEqual(210)
+    expect(boundsBefore.height).toEqual(310)
+
+    await $('.make-smaller').click()
+    const boundsAfter = await browser.electron.browserWindow('getBounds')
+    expect(boundsAfter.width).toEqual(200)
+    expect(boundsAfter.height).toEqual(300)
+  })
+})
+```
+
+or to retrieve other Electron process information:
+
+```js @ts-nocheck
+import fs from 'node:fs'
+import path from 'node:path'
+import { browser, expect } from '@wdio/globals'
+
+const packageJson = JSON.parse(fs.readFileSync(path.join(__dirname, '..', 'package.json'), { encoding: 'utf-8' }))
+const { name, version } = packageJson
+
+describe('electron APIs', () => {
+  it('should retrieve app metadata through the electron API', async () => {
+    const appName = await browser.electron.app('getName')
+    expect(appName).toEqual(name)
+    const appVersion = await browser.electron.app('getVersion')
+    expect(appVersion).toEqual(version)
+  })
+
+  it('should pass args through to the launched application', async () => {
+    // custom args are set in the wdio.conf.js file as they need to be set before WDIO starts
+    const argv = await browser.electron.mainProcess('argv')
+    expect(argv).toContain('--foo')
+    expect(argv).toContain('--bar=baz')
+  })
+})
+```
+
 #### Run your tests
 
 To run your tests:
@@ -58,6 +125,12 @@ To run your tests:
 $ npx wdio run wdio.conf.js
 ```
 
+WebdriverIO helps launch and shut down the application for you.
+
+#### More documentation
+
+Find more documentation on Mocking Electron APIs and other useful resources in the [official WebdriverIO documentation](https://webdriver.io/docs/desktop-testing/electron).
+
 ### With Selenium
 
 [Selenium](https://www.selenium.dev/) is a web automation framework that

docs/tutorial/context-isolation.md

@@ -16,7 +16,7 @@ Context isolation has been enabled by default since Electron 12, and it is a rec
 
 Exposing APIs from your preload script to a loaded website in the renderer process is a common use-case. With context isolation disabled, your preload script would share a common global `window` object with the renderer. You could then attach arbitrary properties to a preload script:
 
-```javascript title='preload.js' @ts-nocheck
+```js title='preload.js' @ts-nocheck
 // preload with contextIsolation disabled
 window.myAPI = {
   doAThing: () => {}
@@ -25,7 +25,7 @@ window.myAPI = {
 
 The `doAThing()` function could then be used directly in the renderer process:
 
-```javascript title='renderer.js' @ts-nocheck
+```js title='renderer.js' @ts-nocheck
 // use the exposed API in the renderer
 window.myAPI.doAThing()
 ```
@@ -34,7 +34,7 @@ window.myAPI.doAThing()
 
 There is a dedicated module in Electron to help you do this in a painless way. The [`contextBridge`](../api/context-bridge.md) module can be used to **safely** expose APIs from your preload script's isolated context to the context the website is running in. The API will also be accessible from the website on `window.myAPI` just like it was before.
 
-```javascript title='preload.js'
+```js title='preload.js'
 // preload with contextIsolation enabled
 const { contextBridge } = require('electron')
 
@@ -43,7 +43,7 @@ contextBridge.exposeInMainWorld('myAPI', {
 })
 ```
 
-```javascript title='renderer.js' @ts-nocheck
+```js title='renderer.js' @ts-nocheck
 // use the exposed API in the renderer
 window.myAPI.doAThing()
 ```
@@ -54,7 +54,7 @@ Please read the `contextBridge` documentation linked above to fully understand i
 
 Just enabling `contextIsolation` and using `contextBridge` does not automatically mean that everything you do is safe. For instance, this code is **unsafe**.
 
-```javascript title='preload.js'
+```js title='preload.js'
 // ❌ Bad code
 contextBridge.exposeInMainWorld('myAPI', {
   send: ipcRenderer.send
@@ -63,7 +63,7 @@ contextBridge.exposeInMainWorld('myAPI', {
 
 It directly exposes a powerful API without any kind of argument filtering. This would allow any website to send arbitrary IPC messages, which you do not want to be possible. The correct way to expose IPC-based APIs would instead be to provide one method per IPC message.
 
-```javascript title='preload.js'
+```js title='preload.js'
 // ✅ Good code
 contextBridge.exposeInMainWorld('myAPI', {
   loadPreferences: () => ipcRenderer.invoke('load-prefs')
@@ -76,7 +76,7 @@ If you're building your Electron app with TypeScript, you'll want to add types t
 
 For example, given this `preload.ts` script:
 
-```typescript title='preload.ts'
+```ts title='preload.ts'
 contextBridge.exposeInMainWorld('electronAPI', {
   loadPreferences: () => ipcRenderer.invoke('load-prefs')
 })
@@ -84,7 +84,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
 
 You can create a `renderer.d.ts` declaration file and globally augment the `Window` interface:
 
-```typescript title='renderer.d.ts' @ts-noisolate
+```ts title='renderer.d.ts' @ts-noisolate
 export interface IElectronAPI {
   loadPreferences: () => Promise<void>,
 }
@@ -98,7 +98,7 @@ declare global {
 
 Doing so will ensure that the TypeScript compiler will know about the `electronAPI` property on your global `window` object when writing scripts in your renderer process:
 
-```typescript title='renderer.ts'
+```ts title='renderer.ts'
 window.electronAPI.loadPreferences()
 ```
 

docs/tutorial/dark-mode.md

@@ -50,7 +50,7 @@ of this theming, due to the use of the macOS 10.14 SDK.
 This example demonstrates an Electron application that derives its theme colors from the
 `nativeTheme`. Additionally, it provides theme toggle and reset controls using IPC channels.
 
-```javascript fiddle='docs/fiddles/features/dark-mode'
+```fiddle docs/fiddles/features/dark-mode
 
 ```
 

docs/tutorial/debugging-main-process.md

@@ -14,10 +14,10 @@ process:
 
 Electron will listen for V8 inspector protocol messages on the specified `port`,
 an external debugger will need to connect on this port. The default `port` is
-`5858`.
+`9229`.
 
 ```shell
-electron --inspect=5858 your/app
+electron --inspect=9229 your/app
 ```
 
 ### `--inspect-brk=[port]`

docs/tutorial/devices.md

@@ -26,7 +26,7 @@ This example demonstrates an Electron application that automatically selects
 the first available bluetooth device when the `Test Bluetooth` button is
 clicked.
 
-```javascript fiddle='docs/fiddles/features/web-bluetooth'
+```fiddle docs/fiddles/features/web-bluetooth
 
 ```
 
@@ -61,7 +61,7 @@ By default Electron employs the same [blocklist](https://github.com/WICG/webhid/
 used by Chromium.  If you wish to override this behavior, you can do so by
 setting the `disable-hid-blocklist` flag:
 
-```javascript
+```js
 app.commandLine.appendSwitch('disable-hid-blocklist')
 ```
 
@@ -72,7 +72,7 @@ HID devices through [`ses.setDevicePermissionHandler(handler)`](../api/session.m
 and through [`select-hid-device` event on the Session](../api/session.md#event-select-hid-device)
 when the `Test WebHID` button is clicked.
 
-```javascript fiddle='docs/fiddles/features/web-hid'
+```fiddle docs/fiddles/features/web-hid
 
 ```
 
@@ -112,7 +112,7 @@ as well as demonstrating selecting the first available Arduino Uno serial device
 [`select-serial-port` event on the Session](../api/session.md#event-select-serial-port)
 when the `Test Web Serial` button is clicked.
 
-```javascript fiddle='docs/fiddles/features/web-serial'
+```fiddle docs/fiddles/features/web-serial
 
 ```
 
@@ -152,6 +152,6 @@ USB devices (if they are attached) through [`ses.setDevicePermissionHandler(hand
 and through [`select-usb-device` event on the Session](../api/session.md#event-select-usb-device)
 when the `Test WebUSB` button is clicked.
 
-```javascript fiddle='docs/fiddles/features/web-usb'
+```fiddle docs/fiddles/features/web-usb
 
 ```

docs/tutorial/devtools-extension.md

@@ -33,7 +33,7 @@ Using the [React Developer Tools][react-devtools] as an example:
 1. Pass the location of the extension to the [`ses.loadExtension`][load-extension]
    API. For React Developer Tools `v4.9.0`, it looks something like:
 
-   ```javascript
+   ```js
    const { app, session } = require('electron')
    const path = require('node:path')
    const os = require('node:os')

docs/tutorial/electron-timelines.md

@@ -9,12 +9,13 @@ check out our [Electron Versioning](./electron-versioning.md) doc.
 
 | Electron | Alpha | Beta | Stable | EOL | Chrome | Node | Supported |
 | ------- | ----- | ------- | ------ | ------ | ---- | ---- | ---- |
-| 27.0.0 |  2023-Aug-17 | 2023-Sep-13 | 2023-Oct-10 | TBD | M118 | TBD | ✅ |
+| 28.0.0 |  2023-Oct-11 | 2023-Nov-6 | 2023-Dec-5 | TBD | M120 | TBD | ✅ |
+| 27.0.0 |  2023-Aug-17 | 2023-Sep-13 | 2023-Oct-10 | 2024-Apr-16 | M118 | v18.17 | ✅ |
 | 26.0.0 | 2023-Jun-01 | 2023-Jun-27 | 2023-Aug-15 | 2024-Feb-27 | M116 | v18.16 | ✅ |
 | 25.0.0 | 2023-Apr-10 | 2023-May-02 | 2023-May-30 | 2024-Jan-02 | M114 | v18.15 | ✅ |
-| 24.0.0 | 2023-Feb-09 | 2023-Mar-07 | 2023-Apr-04 | 2023-Oct-10 | M112 | v18.14 | ✅ |
+| 24.0.0 | 2023-Feb-09 | 2023-Mar-07 | 2023-Apr-04 | 2023-Oct-10 | M112 | v18.14 | 🚫 |
 | 23.0.0 | 2022-Dec-01 | 2023-Jan-10 | 2023-Feb-07 | 2023-Aug-15 | M110 | v18.12 | 🚫 |
-| 22.0.0 | 2022-Sep-29 | 2022-Oct-25 | 2022-Nov-29 | 2023-Oct-10 | M108 | v16.17 | ✅ |
+| 22.0.0 | 2022-Sep-29 | 2022-Oct-25 | 2022-Nov-29 | 2023-Oct-10 | M108 | v16.17 | 🚫 |
 | 21.0.0 | 2022-Aug-04 | 2022-Aug-30 | 2022-Sep-27 | 2023-Apr-04 | M106 | v16.16 | 🚫 |
 | 20.0.0 | 2022-May-26 | 2022-Jun-21 | 2022-Aug-02 | 2023-Feb-07 | M104 | v16.15 | 🚫 |
 | 19.0.0 | 2022-Mar-31 | 2022-Apr-26 | 2022-May-24 | 2022-Nov-29 | M102 | v16.14 | 🚫 |
@@ -48,12 +49,6 @@ check out our [Electron Versioning](./electron-versioning.md) doc.
 * Since Electron 6, Electron major versions have been targeting every other Chromium major version. Each Electron stable should happen on the same day as Chrome stable ([see blog post](https://www.electronjs.org/blog/12-week-cadence)).
 * Since Electron 16, Electron has been releasing major versions on an 8-week cadence in accordance to Chrome's change to a 4-week release cadence ([see blog post](https://www.electronjs.org/blog/8-week-cadence)).
 
-:::info Chrome release dates
-
-Chromium has the own public release schedule [here](https://chromiumdash.appspot.com/schedule).
-
-:::
-
 ## Version support policy
 
 :::info
@@ -78,6 +73,38 @@ and the version prior to that receives the vast majority of those fixes
 as time and bandwidth warrants. The oldest supported release line will receive
 only security fixes directly.
 
+### Chromium version support
+
+:::info Chromium release schedule
+
+Chromium's public release schedule is [here](https://chromiumdash.appspot.com/schedule).
+
+:::
+
+Electron targets Chromium even-number versions, releasing every 8 weeks in concert
+with Chromium's 4-week release schedule. For example, Electron 26 uses Chromium 116, while Electron 27 uses Chromium 118.
+
+### Node.js version support
+
+Electron upgrades its `main` branch to even-number versions of Node.js when they enter Active LTS. The schedule
+is as follows:
+
+<img src="https://raw.githubusercontent.com/nodejs/Release/main/schedule.svg?sanitize=true" alt="Releases">
+
+As a rule, stable branches of Electron do not receive Node.js upgrades after they have been cut.
+If Electron has recently updated its `main` branch to a new major version of Node.js, the next stable
+branch to be cut will be released with the new version.
+
+Patch upgrades of Node that contain significant security or bug fixes, and are submitted
+more than 2 weeks prior to a stable release date, will be accepted into an Electron alpha
+or beta release branch.
+
+Minor upgrades of Node that contain significant security or bug fixes, and are submitted
+more than 2 weeks prior to a stable release date may be accepted into an Electron alpha or
+beta release branch on a case-by-case basis. These requests will be reviewed and voted on
+by the [Releases Working Group](https://github.com/electron/governance/tree/main/wg-releases),
+to ensure minimal disruption for developers who may be consuming alpha or beta releases.
+
 ### Breaking API changes
 
 When an API is changed or removed in a way that breaks existing functionality, the

docs/tutorial/examples.md

@@ -16,16 +16,7 @@ Once Fiddle is installed, you can press on the "Open in Fiddle" button that you
 will find below code samples like the following one:
 
 ```fiddle docs/fiddles/quick-start
-window.addEventListener('DOMContentLoaded', () => {
-  const replaceText = (selector, text) => {
-    const element = document.getElementById(selector)
-    if (element) element.innerText = text
-  }
 
-  for (const type of ['chrome', 'node', 'electron']) {
-    replaceText(`${type}-version`, process.versions[type])
-  }
-})
 ```
 
 If there is still something that you do not know how to do, please take a look at the [API][app]

docs/tutorial/in-app-purchases.md

@@ -34,7 +34,7 @@ To test In-App Purchase in development with Electron you'll have to change the `
 
 Here is an example that shows how to use In-App Purchases in Electron. You'll have to replace the product ids by the identifiers of the products created with iTunes Connect (the identifier of `com.example.app.product1` is `product1`). Note that you have to listen to the `transactions-updated` event as soon as possible in your app.
 
-```javascript
+```js
 // Main process
 const { inAppPurchase } = require('electron')
 const PRODUCT_IDS = ['id1', 'id2']

docs/tutorial/installation.md

@@ -66,7 +66,7 @@ You can use environment variables to override the base URL, the path at which to
 look for Electron binaries, and the binary filename. The URL used by `@electron/get`
 is composed as follows:
 
-```javascript @ts-nocheck
+```js @ts-nocheck
 url = ELECTRON_MIRROR + ELECTRON_CUSTOM_DIR + '/' + ELECTRON_CUSTOM_FILENAME
 ```
 

docs/tutorial/ipc.md

@@ -50,7 +50,7 @@ sections.
 
 In the main process, set an IPC listener on the `set-title` channel with the `ipcMain.on` API:
 
-```javascript {6-10,22} title='main.js (Main Process)'
+```js {6-10,22} title='main.js (Main Process)'
 const { app, BrowserWindow, ipcMain } = require('electron')
 const path = require('node:path')
 
@@ -96,7 +96,7 @@ you need to choose which APIs to expose from your preload script using the `cont
 In your preload script, add the following code, which will expose a global `window.electronAPI`
 variable to your renderer process.
 
-```javascript title='preload.js (Preload Script)'
+```js title='preload.js (Preload Script)'
 const { contextBridge, ipcRenderer } = require('electron')
 
 contextBridge.exposeInMainWorld('electronAPI', {
@@ -138,7 +138,7 @@ To make these elements interactive, we'll be adding a few lines of code in the i
 `renderer.js` file that leverages the `window.electronAPI` functionality exposed from the preload
 script:
 
-```javascript title='renderer.js (Renderer Process)' @ts-expect-error=[4,5]
+```js title='renderer.js (Renderer Process)' @ts-expect-error=[4,5]
 const setButton = document.getElementById('btn')
 const titleInput = document.getElementById('title')
 setButton.addEventListener('click', () => {
@@ -181,7 +181,7 @@ provided to the renderer process. Please refer to
 [#24427](https://github.com/electron/electron/issues/24427) for details.
 :::
 
-```javascript {6-13,25} title='main.js (Main Process)'
+```js {6-13,25} title='main.js (Main Process)'
 const { app, BrowserWindow, dialog, ipcMain } = require('electron')
 const path = require('node:path')
 
@@ -225,7 +225,7 @@ In the preload script, we expose a one-line `openFile` function that calls and r
 `ipcRenderer.invoke('dialog:openFile')`. We'll be using this API in the next step to call the
 native dialog from our renderer's user interface.
 
-```javascript title='preload.js (Preload Script)'
+```js title='preload.js (Preload Script)'
 const { contextBridge, ipcRenderer } = require('electron')
 
 contextBridge.exposeInMainWorld('electronAPI', {
@@ -263,7 +263,7 @@ The UI consists of a single `#btn` button element that will be used to trigger o
 a `#filePath` element that will be used to display the path of the selected file. Making these
 pieces work will take a few lines of code in the renderer process script:
 
-```javascript title='renderer.js (Renderer Process)' @ts-expect-error=[5]
+```js title='renderer.js (Renderer Process)' @ts-expect-error=[5]
 const btn = document.getElementById('btn')
 const filePathElement = document.getElementById('filePath')
 
@@ -299,7 +299,7 @@ The `ipcRenderer.send` API that we used for single-way communication can also be
 perform two-way communication. This was the recommended way for asynchronous two-way communication
 via IPC prior to Electron 7.
 
-```javascript title='preload.js (Preload Script)'
+```js title='preload.js (Preload Script)'
 // You can also put expose this code to the renderer
 // process with the `contextBridge` API
 const { ipcRenderer } = require('electron')
@@ -310,7 +310,7 @@ ipcRenderer.on('asynchronous-reply', (_event, arg) => {
 ipcRenderer.send('asynchronous-message', 'ping')
 ```
 
-```javascript title='main.js (Main Process)'
+```js title='main.js (Main Process)'
 ipcMain.on('asynchronous-message', (event, arg) => {
   console.log(arg) // prints "ping" in the Node console
   // works like `send`, but returning a message back
@@ -332,7 +332,7 @@ channels, you would need to add additional app code to track each call and respo
 The `ipcRenderer.sendSync` API sends a message to the main process and waits _synchronously_ for a
 response.
 
-```javascript title='main.js (Main Process)'
+```js title='main.js (Main Process)'
 const { ipcMain } = require('electron')
 ipcMain.on('synchronous-message', (event, arg) => {
   console.log(arg) // prints "ping" in the Node console
@@ -340,7 +340,7 @@ ipcMain.on('synchronous-message', (event, arg) => {
 })
 ```
 
-```javascript title='preload.js (Preload Script)'
+```js title='preload.js (Preload Script)'
 // You can also put expose this code to the renderer
 // process with the `contextBridge` API
 const { ipcRenderer } = require('electron')
@@ -376,7 +376,7 @@ For this demo, we'll need to first build a custom menu in the main process using
 module that uses the `webContents.send` API to send an IPC message from the main process to the
 target renderer.
 
-```javascript {11-26} title='main.js (Main Process)'
+```js {11-26} title='main.js (Main Process)'
 const { app, BrowserWindow, Menu, ipcMain } = require('electron')
 const path = require('node:path')
 
@@ -412,7 +412,7 @@ function createWindow () {
 For the purposes of the tutorial, it's important to note that the `click` handler
 sends a message (either `1` or `-1`) to the renderer process through the `update-counter` channel.
 
-```javascript @ts-type={mainWindow:Electron.BrowserWindow}
+```js @ts-type={mainWindow:Electron.BrowserWindow}
 click: () => mainWindow.webContents.send('update-counter', -1)
 ```
 
@@ -425,7 +425,7 @@ Make sure you're loading the `index.html` and `preload.js` entry points for the
 Like in the previous renderer-to-main example, we use the `contextBridge` and `ipcRenderer`
 modules in the preload script to expose IPC functionality to the renderer process:
 
-```javascript title='preload.js (Preload Script)'
+```js title='preload.js (Preload Script)'
 const { contextBridge, ipcRenderer } = require('electron')
 
 contextBridge.exposeInMainWorld('electronAPI', {
@@ -445,7 +445,7 @@ limit the renderer's access to Electron APIs as much as possible.
 In the case of this minimal example, you can call `ipcRenderer.on` directly in the preload script
 rather than exposing it over the context bridge.
 
-```javascript title='preload.js (Preload Script)'
+```js title='preload.js (Preload Script)'
 const { ipcRenderer } = require('electron')
 
 window.addEventListener('DOMContentLoaded', () => {
@@ -486,7 +486,7 @@ To tie it all together, we'll create an interface in the loaded HTML file that c
 Finally, to make the values update in the HTML document, we'll add a few lines of DOM manipulation
 so that the value of the `#counter` element is updated whenever we fire an `update-counter` event.
 
-```javascript title='renderer.js (Renderer Process)' @ts-window-type={electronAPI:{onUpdateCounter:(callback:(event:Electron.IpcRendererEvent,value:number)=>void)=>void}}
+```js title='renderer.js (Renderer Process)' @ts-window-type={electronAPI:{onUpdateCounter:(callback:(event:Electron.IpcRendererEvent,value:number)=>void)=>void}}
 const counter = document.getElementById('counter')
 
 window.electronAPI.onUpdateCounter((_event, value) => {
@@ -509,7 +509,7 @@ We can demonstrate this with slight modifications to the code from the previous
 renderer process, use the `event` parameter to send a reply back to the main process through the
 `counter-value` channel.
 
-```javascript title='renderer.js (Renderer Process)' @ts-window-type={electronAPI:{onUpdateCounter:(callback:(event:Electron.IpcRendererEvent,value:number)=>void)=>void}}
+```js title='renderer.js (Renderer Process)' @ts-window-type={electronAPI:{onUpdateCounter:(callback:(event:Electron.IpcRendererEvent,value:number)=>void)=>void}}
 const counter = document.getElementById('counter')
 
 window.electronAPI.onUpdateCounter((event, value) => {
@@ -522,7 +522,7 @@ window.electronAPI.onUpdateCounter((event, value) => {
 
 In the main process, listen for `counter-value` events and handle them appropriately.
 
-```javascript title='main.js (Main Process)'
+```js title='main.js (Main Process)'
 // ...
 ipcMain.on('counter-value', (_event, value) => {
   console.log(value) // will print value to Node console

docs/tutorial/keyboard-shortcuts.md

@@ -14,11 +14,19 @@ To configure a local keyboard shortcut, you need to specify an [`accelerator`][]
 property when creating a [MenuItem][] within the [Menu][] module.
 
 Starting with a working application from the
-[Quick Start Guide](quick-start.md), update the `main.js` file with the
-following lines:
+[Quick Start Guide](quick-start.md), update the `main.js` to be:
 
-```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/local'
-const { Menu, MenuItem } = require('electron')
+```fiddle docs/fiddles/features/keyboard-shortcuts/local
+const { app, BrowserWindow, Menu, MenuItem } = require('electron')
+
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600
+  })
+
+  win.loadFile('index.html')
+}
 
 const menu = new Menu()
 menu.append(new MenuItem({
@@ -31,6 +39,20 @@ menu.append(new MenuItem({
 }))
 
 Menu.setApplicationMenu(menu)
+
+app.whenReady().then(createWindow)
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow()
+  }
+})
 ```
 
 > NOTE: In the code above, you can see that the accelerator differs based on the
@@ -53,17 +75,37 @@ module to detect keyboard events even when the application does not have
 keyboard focus.
 
 Starting with a working application from the
-[Quick Start Guide](quick-start.md), update the `main.js` file with the
-following lines:
+[Quick Start Guide](quick-start.md), update the `main.js` to be:
 
-```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/global' @ts-type={createWindow:()=>void}
-const { app, globalShortcut } = require('electron')
+```fiddle docs/fiddles/features/keyboard-shortcuts/global
+const { app, BrowserWindow, globalShortcut } = require('electron')
+
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600
+  })
+
+  win.loadFile('index.html')
+}
 
 app.whenReady().then(() => {
   globalShortcut.register('Alt+CommandOrControl+I', () => {
     console.log('Electron loves global shortcuts!')
   })
 }).then(createWindow)
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow()
+  }
+})
 ```
 
 > NOTE: In the code above, the `CommandOrControl` combination uses `Command`
@@ -81,8 +123,8 @@ If you want to handle keyboard shortcuts within a [BrowserWindow][], you can
 listen for the `keyup` and `keydown` [DOM events][dom-events] inside the
 renderer process using the [addEventListener() API][addEventListener-api].
 
-```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/web-apis|focus=renderer.js'
-const handleKeyPress = (event) => {
+```fiddle docs/fiddles/features/keyboard-shortcuts/web-apis|focus=renderer.js
+function handleKeyPress (event) {
   // You can put code here to handle the keypress.
   document.getElementById('last-keypress').innerText = event.key
   console.log(`You pressed ${event.key}`)
@@ -105,7 +147,7 @@ Starting with a working application from the
 [Quick Start Guide](quick-start.md), update the `main.js` file with the
 following lines:
 
-```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/interception-from-main'
+```fiddle docs/fiddles/features/keyboard-shortcuts/interception-from-main
 const { app, BrowserWindow } = require('electron')
 
 app.whenReady().then(() => {

docs/tutorial/launch-app-from-url-in-another-app.md

@@ -25,14 +25,14 @@ we will use will be "`electron-fiddle://`".
 First, we will import the required modules from `electron`. These modules help
 control our application lifecycle and create a native browser window.
 
-```javascript
+```js
 const { app, BrowserWindow, shell } = require('electron')
 const path = require('node:path')
 ```
 
 Next, we will proceed to register our application to handle all "`electron-fiddle://`" protocols.
 
-```javascript
+```js
 if (process.defaultApp) {
   if (process.argv.length >= 2) {
     app.setAsDefaultProtocolClient('electron-fiddle', process.execPath, [path.resolve(process.argv[1])])
@@ -44,7 +44,7 @@ if (process.defaultApp) {
 
 We will now define the function in charge of creating our browser window and load our application's `index.html` file.
 
-```javascript
+```js
 let mainWindow
 
 const createWindow = () => {
@@ -67,7 +67,7 @@ This code will be different in Windows and Linux compared to MacOS. This is due
 
 #### Windows and Linux code:
 
-```javascript @ts-type={mainWindow:Electron.BrowserWindow} @ts-type={createWindow:()=>void}
+```js @ts-type={mainWindow:Electron.BrowserWindow} @ts-type={createWindow:()=>void}
 const gotTheLock = app.requestSingleInstanceLock()
 
 if (!gotTheLock) {
@@ -92,7 +92,7 @@ if (!gotTheLock) {
 
 #### MacOS code:
 
-```javascript @ts-type={createWindow:()=>void}
+```js @ts-type={createWindow:()=>void}
 // This method will be called when Electron has finished
 // initialization and is ready to create browser windows.
 // Some APIs can only be used after this event occurs.
@@ -108,7 +108,7 @@ app.on('open-url', (event, url) => {
 
 Finally, we will add some additional code to handle when someone closes our application.
 
-```javascript
+```js
 // Quit when all windows are closed, except on macOS. There, it's common
 // for applications and their menu bar to stay active until the user quits
 // explicitly with Cmd + Q.
@@ -167,7 +167,7 @@ If you're using Electron Packager's API, adding support for protocol handlers is
 Electron Forge is handled, except
 `protocols` is part of the Packager options passed to the `packager` function.
 
-```javascript @ts-nocheck
+```js @ts-nocheck
 const packager = require('electron-packager')
 
 packager({

docs/tutorial/macos-dock.md

@@ -23,10 +23,10 @@ To set your custom dock menu, you need to use the
 [`app.dock.setMenu`](../api/dock.md#docksetmenumenu-macos) API,
 which is only available on macOS.
 
-```javascript fiddle='docs/fiddles/features/macos-dock-menu'
+```fiddle docs/fiddles/features/macos-dock-menu
 const { app, BrowserWindow, Menu } = require('electron')
 
-const createWindow = () => {
+function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600

docs/tutorial/multithreading.md

@@ -9,7 +9,7 @@ It is possible to use Node.js features in Electron's Web Workers, to do
 so the `nodeIntegrationInWorker` option should be set to `true` in
 `webPreferences`.
 
-```javascript
+```js
 const win = new BrowserWindow({
   webPreferences: {
     nodeIntegrationInWorker: true
@@ -42,7 +42,7 @@ safe.
 The only way to load a native module safely for now, is to make sure the app
 loads no native modules after the Web Workers get started.
 
-```javascript @ts-expect-error=[1]
+```js @ts-expect-error=[1]
 process.dlopen = () => {
   throw new Error('Load native module is not safe')
 }

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

@@ -44,7 +44,7 @@ Add a draggable element to `index.html`, and reference your renderer script:
 
 In `renderer.js` set up the renderer process to handle drag events by calling the method you added via the [`contextBridge`][] above.
 
-```javascript @ts-expect-error=[3]
+```js @ts-expect-error=[3]
 document.getElementById('drag').ondragstart = (event) => {
   event.preventDefault()
   window.electron.startDrag('drag-and-drop.md')
@@ -56,15 +56,55 @@ document.getElementById('drag').ondragstart = (event) => {
 In the Main process (`main.js` file), expand the received event with a path to the file that is
 being dragged and an icon:
 
-```javascript fiddle='docs/fiddles/features/drag-and-drop'
-const { ipcMain } = require('electron')
+```fiddle docs/fiddles/features/drag-and-drop
+const { app, BrowserWindow, ipcMain } = require('electron')
+const path = require('node:path')
+const fs = require('node:fs')
+const https = require('node:https')
+
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600,
+    webPreferences: {
+      preload: path.join(__dirname, 'preload.js')
+    }
+  })
+
+  win.loadFile('index.html')
+}
+
+const iconName = path.join(__dirname, 'iconForDragAndDrop.png')
+const icon = fs.createWriteStream(iconName)
+
+// Create a new file to copy - you can also copy existing files.
+fs.writeFileSync(path.join(__dirname, 'drag-and-drop-1.md'), '# First file to test drag and drop')
+fs.writeFileSync(path.join(__dirname, 'drag-and-drop-2.md'), '# Second file to test drag and drop')
+
+https.get('https://img.icons8.com/ios/452/drag-and-drop.png', (response) => {
+  response.pipe(icon)
+})
+
+app.whenReady().then(createWindow)
 
 ipcMain.on('ondragstart', (event, filePath) => {
   event.sender.startDrag({
-    file: filePath,
-    icon: '/path/to/icon.png'
+    file: path.join(__dirname, filePath),
+    icon: iconName
   })
 })
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow()
+  }
+})
 ```
 
 After launching the Electron application, try dragging and dropping

docs/tutorial/notifications.md

@@ -30,16 +30,38 @@ new Notification({
 
 Here's a full example that you can open with Electron Fiddle:
 
-```javascript fiddle='docs/fiddles/features/notifications/main'
-const { Notification } = require('electron')
+```fiddle docs/fiddles/features/notifications/main
+const { app, BrowserWindow, Notification } = require('electron')
+
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600
+  })
+
+  win.loadFile('index.html')
+}
 
 const NOTIFICATION_TITLE = 'Basic Notification'
 const NOTIFICATION_BODY = 'Notification from the Main process'
 
-new Notification({
-  title: NOTIFICATION_TITLE,
-  body: NOTIFICATION_BODY
-}).show()
+function showNotification () {
+  new Notification({ title: NOTIFICATION_TITLE, body: NOTIFICATION_BODY }).show()
+}
+
+app.whenReady().then(createWindow).then(showNotification)
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
+})
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow()
+  }
+})
 ```
 
 ### Show notifications in the renderer process
@@ -59,14 +81,13 @@ new Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY }).onclick =
 
 Here's a full example that you can open with Electron Fiddle:
 
-```javascript fiddle='docs/fiddles/features/notifications/renderer'
+```fiddle docs/fiddles/features/notifications/renderer|focus=renderer.js
 const NOTIFICATION_TITLE = 'Title'
-const NOTIFICATION_BODY =
-  'Notification from the Renderer process. Click to log to console.'
-const CLICK_MESSAGE = 'Notification clicked'
+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)
+new window.Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY })
+  .onclick = () => { document.getElementById('output').innerText = CLICK_MESSAGE }
 ```
 
 ## Platform considerations

docs/tutorial/offscreen-rendering.md

@@ -39,22 +39,44 @@ To enable this mode, GPU acceleration has to be disabled by calling the
 
 ## Example
 
-```javascript fiddle='docs/fiddles/features/offscreen-rendering'
+```fiddle docs/fiddles/features/offscreen-rendering
 const { app, BrowserWindow } = require('electron')
 const fs = require('node:fs')
+const path = require('node:path')
 
 app.disableHardwareAcceleration()
 
-let win
-
-app.whenReady().then(() => {
-  win = new BrowserWindow({ webPreferences: { offscreen: true } })
+function createWindow () {
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600,
+    webPreferences: {
+      offscreen: true
+    }
+  })
 
   win.loadURL('https://github.com')
   win.webContents.on('paint', (event, dirty, image) => {
     fs.writeFileSync('ex.png', image.toPNG())
   })
   win.webContents.setFrameRate(60)
+  console.log(`The screenshot has been successfully saved to ${path.join(process.cwd(), 'ex.png')}`)
+}
+
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', () => {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow()
+    }
+  })
+})
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit()
+  }
 })
 ```
 

docs/tutorial/progress-bar.md

@@ -50,12 +50,12 @@ See the [API documentation for more options and modes][setprogressbar].
 In this example, we add a progress bar to the main window that increments over time
 using Node.js timers.
 
-```javascript fiddle='docs/fiddles/features/progress-bar'
+```fiddle docs/fiddles/features/progress-bar
 const { app, BrowserWindow } = require('electron')
 
 let progressInterval
 
-const createWindow = () => {
+function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600
@@ -73,8 +73,11 @@ const createWindow = () => {
     win.setProgressBar(c)
 
     // increment or reset progress bar
-    if (c < 2) c += INCREMENT
-    else c = 0
+    if (c < 2) {
+      c += INCREMENT
+    } else {
+      c = (-INCREMENT * 5) // reset to a bit less than 0 to show reset state
+    }
   }, INTERVAL_DELAY)
 }
 

docs/tutorial/recent-documents.md

@@ -24,12 +24,12 @@ the application via JumpList or dock menu, respectively.
 
 ### Managing recent documents
 
-```javascript fiddle='docs/fiddles/features/recent-documents'
+```fiddle docs/fiddles/features/recent-documents
 const { app, BrowserWindow } = require('electron')
 const fs = require('node:fs')
 const path = require('node:path')
 
-const createWindow = () => {
+function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600
@@ -116,7 +116,7 @@ following code snippet to your menu template:
 Make sure the application menu is added after the [`'ready'`](../api/app.md#event-ready)
 event and not before, or the menu item will be disabled:
 
-```javascript
+```js
 const { app, Menu } = require('electron')
 
 const template = [

docs/tutorial/represented-file.md

@@ -27,22 +27,30 @@ To set the represented file of window, you can use the
 
 ## Example
 
-```javascript fiddle='docs/fiddles/features/represented-file'
+```fiddle docs/fiddles/features/represented-file
 const { app, BrowserWindow } = require('electron')
 const os = require('node:os')
 
-const createWindow = () => {
+function createWindow () {
   const win = new BrowserWindow({
     width: 800,
     height: 600
   })
-}
-
-app.whenReady().then(() => {
-  const win = new BrowserWindow()
 
   win.setRepresentedFilename(os.homedir())
   win.setDocumentEdited(true)
+
+  win.loadFile('index.html')
+}
+
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', () => {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow()
+    }
+  })
 })
 
 app.on('window-all-closed', () => {
@@ -50,12 +58,6 @@ app.on('window-all-closed', () => {
     app.quit()
   }
 })
-
-app.on('activate', () => {
-  if (BrowserWindow.getAllWindows().length === 0) {
-    createWindow()
-  }
-})
 ```
 
 After launching the Electron application, click on the title with `Command` or

docs/tutorial/security.md

@@ -375,7 +375,7 @@ which can be set using Electron's
 [`webRequest.onHeadersReceived`](../api/web-request.md#webrequestonheadersreceivedfilter-listener)
 handler:
 
-```javascript title='main.js (Main Process)'
+```js title='main.js (Main Process)'
 const { session } = require('electron')
 
 session.defaultSession.webRequest.onHeadersReceived((details, callback) => {

docs/tutorial/snapcraft.md

@@ -91,14 +91,14 @@ version: '0.1'
 summary: Hello World Electron app
 description: |
   Simple Hello World Electron app as an example
-base: core18
+base: core22
 confinement: strict
 grade: stable
 
 apps:
   electron-packager-hello-world:
     command: electron-quick-start/electron-quick-start --no-sandbox
-    extensions: [gnome-3-34]
+    extensions: [gnome]
     plugs:
     - browser-support
     - network
@@ -237,6 +237,34 @@ apps:
     desktop: usr/share/applications/desktop.desktop
 ```
 
+## Optional: Enabling desktop capture
+
+Capturing the desktop requires PipeWire library in some Linux configurations that use
+the Wayland protocol. To bundle PipeWire with your application, ensure that the base
+snap is set to `core22` or newer. Next, create a part called `pipewire` and add it to
+the `after` section of your application:
+
+```yaml
+  pipewire:
+    plugin: nil
+    build-packages: [libpipewire-0.3-dev]
+    stage-packages: [pipewire]
+    prime:
+      - usr/lib/*/pipewire-*
+      - usr/lib/*/spa-*
+      - usr/lib/*/libpipewire*.so*
+      - usr/share/pipewire
+```
+
+Finally, configure your application's environment for PipeWire:
+
+```yaml
+    environment:
+      SPA_PLUGIN_DIR: $SNAP/usr/lib/$CRAFT_ARCH_TRIPLET/spa-0.2
+      PIPEWIRE_CONFIG_NAME: $SNAP/usr/share/pipewire/pipewire.conf
+      PIPEWIRE_MODULE_DIR: $SNAP/usr/lib/$CRAFT_ARCH_TRIPLET/pipewire-0.3
+```
+
 [snapcraft-syntax]: https://docs.snapcraft.io/build-snaps/syntax
 [electron-packager]: https://github.com/electron/electron-packager
 [electron-forge]: https://github.com/electron/forge

docs/tutorial/updates.md

@@ -81,14 +81,14 @@ You can use the [app.isPackaged](../api/app.md#appispackaged-readonly) API to ch
 
 :::
 
-```javascript title='main.js'
+```js title='main.js'
 const { app, autoUpdater, dialog } = require('electron')
 ```
 
 Next, construct the URL of the update server feed and tell
 [autoUpdater](../api/auto-updater.md) about it:
 
-```javascript title='main.js'
+```js title='main.js'
 const server = 'https://your-deployment-url.com'
 const url = `${server}/update/${process.platform}/${app.getVersion()}`
 
@@ -97,7 +97,7 @@ autoUpdater.setFeedURL({ url })
 
 As the final step, check for updates. The example below will check every minute:
 
-```javascript title='main.js'
+```js title='main.js'
 setInterval(() => {
   autoUpdater.checkForUpdates()
 }, 60000)
@@ -113,7 +113,7 @@ Now that you've configured the basic update mechanism for your application, you
 need to ensure that the user will get notified when there's an update. This
 can be achieved using the [autoUpdater API events](../api/auto-updater.md#events):
 
-```javascript title="main.js" @ts-expect-error=[11]
+```js title="main.js" @ts-expect-error=[11]
 autoUpdater.on('update-downloaded', (event, releaseNotes, releaseName) => {
   const dialogOpts = {
     type: 'info',
@@ -134,7 +134,7 @@ Also make sure that errors are
 [being handled](../api/auto-updater.md#event-error). Here's an example
 for logging them to `stderr`:
 
-```javascript title="main.js"
+```js title="main.js"
 autoUpdater.on('error', (message) => {
   console.error('There was a problem updating the application')
   console.error(message)

docs/tutorial/window-customization.md

@@ -14,7 +14,7 @@ that are not a part of the web page.
 To create a frameless window, you need to set `frame` to `false` in the `BrowserWindow`
 constructor.
 
-```javascript title='main.js'
+```js title='main.js'
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({ frame: false })
 ```
@@ -28,7 +28,7 @@ option in the `BrowserWindow` constructor.
 Applying the `hidden` title bar style results in a hidden title bar and a full-size
 content window.
 
-```javascript title='main.js'
+```js title='main.js'
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({ titleBarStyle: 'hidden' })
 ```
@@ -44,7 +44,7 @@ The `customButtonsOnHover` title bar style will hide the traffic lights until yo
 over them. This is useful if you want to create custom traffic lights in your HTML but still
 use the native UI to control the window.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({ titleBarStyle: 'customButtonsOnHover' })
 ```
@@ -57,7 +57,7 @@ options available.
 Applying `hiddenInset` title bar style will shift the vertical inset of the traffic lights
 by a fixed amount.
 
-```javascript title='main.js'
+```js title='main.js'
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({ titleBarStyle: 'hiddenInset' })
 ```
@@ -66,7 +66,7 @@ If you need more granular control over the positioning of the traffic lights, yo
 a set of coordinates to the `trafficLightPosition` option in the `BrowserWindow`
 constructor.
 
-```javascript title='main.js'
+```js title='main.js'
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({
   titleBarStyle: 'hidden',
@@ -80,7 +80,7 @@ You can also show and hide the traffic lights programmatically from the main pro
 The `win.setWindowButtonVisibility` forces traffic lights to be show or hidden depending
 on the value of its boolean parameter.
 
-```javascript title='main.js'
+```js title='main.js'
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 // hides the traffic lights
@@ -106,7 +106,7 @@ The `titleBarOverlay` option accepts two different value formats.
 Specifying `true` on either platform will result in an overlay region with default
 system colors:
 
-```javascript title='main.js'
+```js title='main.js'
 // on macOS or Windows
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({
@@ -119,7 +119,7 @@ On either platform `titleBarOverlay` can also be an object. On both macOS and Wi
 
 If a color option is not specified, the color will default to its system color for the window control buttons. Similarly, if the height option is not specified it will default to the default height:
 
-```javascript title='main.js'
+```js title='main.js'
 // on Windows
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({
@@ -140,7 +140,7 @@ const win = new BrowserWindow({
 
 By setting the `transparent` option to `true`, you can make a fully transparent window.
 
-```javascript title='main.js'
+```js title='main.js'
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow({ transparent: true })
 ```
@@ -169,7 +169,7 @@ To create a click-through window, i.e. making the window ignore all mouse
 events, you can call the [win.setIgnoreMouseEvents(ignore)][ignore-mouse-events]
 API:
 
-```javascript title='main.js'
+```js title='main.js'
 const { BrowserWindow } = require('electron')
 const win = new BrowserWindow()
 win.setIgnoreMouseEvents(true)
@@ -182,7 +182,7 @@ meaning that mouse movement events will not be emitted. On Windows and macOS, an
 optional parameter can be used to forward mouse move messages to the web page,
 allowing events such as `mouseleave` to be emitted:
 
-```javascript title='main.js'
+```js title='main.js'
 const { BrowserWindow, ipcMain } = require('electron')
 const path = require('node:path')
 
@@ -198,7 +198,7 @@ ipcMain.on('set-ignore-mouse-events', (event, ignore, options) => {
 })
 ```
 
-```javascript title='preload.js'
+```js title='preload.js'
 window.addEventListener('DOMContentLoaded', () => {
   const el = document.getElementById('clickThroughElement')
   el.addEventListener('mouseenter', () => {

docs/tutorial/windows-taskbar.md

@@ -60,7 +60,7 @@ Starting with a working application from the
 [Quick Start Guide](quick-start.md), update the `main.js` file with the
 following lines:
 
-```javascript
+```js
 const { app } = require('electron')
 
 app.setUserTasks([
@@ -80,7 +80,7 @@ app.setUserTasks([
 To clear your tasks list, you need to call `app.setUserTasks` with an empty
 array in the `main.js` file.
 
-```javascript
+```js
 const { app } = require('electron')
 
 app.setUserTasks([])
@@ -124,7 +124,7 @@ Starting with a working application from the
 [Quick Start Guide](quick-start.md), update the `main.js` file with the
 following lines:
 
-```javascript
+```js
 const { BrowserWindow, nativeImage } = require('electron')
 const path = require('node:path')
 
@@ -149,7 +149,7 @@ win.setThumbarButtons([
 To clear thumbnail toolbar buttons, you need to call
 `BrowserWindow.setThumbarButtons` with an empty array in the `main.js` file.
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const win = new BrowserWindow()
@@ -188,7 +188,7 @@ Starting with a working application from the
 [Quick Start Guide](quick-start.md), update the `main.js` file with the
 following lines:
 
-```javascript
+```js
 const { BrowserWindow, nativeImage } = require('electron')
 
 const win = new BrowserWindow()
@@ -217,7 +217,7 @@ Starting with a working application from the
 [Quick Start Guide](quick-start.md), update the `main.js` file with the
 following lines:
 
-```javascript
+```js
 const { BrowserWindow } = require('electron')
 
 const win = new BrowserWindow()

filenames.gni

@@ -167,6 +167,8 @@ filenames = {
     "shell/common/language_util_mac.mm",
     "shell/common/mac/main_application_bundle.h",
     "shell/common/mac/main_application_bundle.mm",
+    "shell/common/mac/codesign_util.cc",
+    "shell/common/mac/codesign_util.h",
     "shell/common/node_bindings_mac.cc",
     "shell/common/node_bindings_mac.h",
     "shell/common/platform_util_mac.mm",
@@ -627,6 +629,7 @@ filenames = {
     "shell/common/node_includes.h",
     "shell/common/node_util.cc",
     "shell/common/node_util.h",
+    "shell/common/node_util_mac.mm",
     "shell/common/options_switches.cc",
     "shell/common/options_switches.h",
     "shell/common/platform_util.cc",
@@ -676,6 +679,8 @@ filenames = {
   ]
 
   lib_sources_extensions = [
+    "shell/browser/extensions/api/extension_action/extension_action_api.cc",
+    "shell/browser/extensions/api/extension_action/extension_action_api.h",
     "shell/browser/extensions/api/management/electron_management_api_delegate.cc",
     "shell/browser/extensions/api/management/electron_management_api_delegate.h",
     "shell/browser/extensions/api/resources_private/resources_private_api.cc",

lib/browser/api/app.ts

@@ -114,5 +114,11 @@ for (const name of events) {
 }
 
 // Deprecation.
-deprecate.event(app, 'gpu-process-crashed', 'child-process-gone');
-deprecate.event(app, 'renderer-process-crashed', 'render-process-gone');
+deprecate.event(app, 'gpu-process-crashed', 'child-process-gone', () => {
+  // the old event is still emitted by App::OnGpuProcessCrashed()
+  return undefined;
+});
+
+deprecate.event(app, 'renderer-process-crashed', 'render-process-gone', (event: Electron.Event, webContents: Electron.WebContents, details: Electron.RenderProcessGoneDetails) => {
+  return [event, webContents, details.reason === 'killed'];
+});

lib/browser/api/web-contents.ts

@@ -337,49 +337,53 @@ WebContents.prototype.printToPDF = async function (options) {
 // TODO(codebytere): deduplicate argument sanitization by moving rest of
 // print param logic into new file shared between printToPDF and print
 WebContents.prototype.print = function (options: ElectronInternal.WebContentsPrintOptions, callback) {
-  if (typeof options === 'object') {
-    const pageSize = options.pageSize ?? 'A4';
-    if (typeof pageSize === 'object') {
-      if (!pageSize.height || !pageSize.width) {
-        throw new Error('height and width properties are required for pageSize');
-      }
+  if (typeof options !== 'object') {
+    throw new Error('webContents.print(): Invalid print settings specified.');
+  }
 
-      // Dimensions in Microns - 1 meter = 10^6 microns
-      const height = Math.ceil(pageSize.height);
-      const width = Math.ceil(pageSize.width);
-      if (!isValidCustomPageSize(width, height)) {
-        throw new Error('height and width properties must be minimum 352 microns.');
-      }
+  const printSettings: Record<string, any> = { ...options };
 
-      options.mediaSize = {
-        name: 'CUSTOM',
-        custom_display_name: 'Custom',
-        height_microns: height,
-        width_microns: width,
-        imageable_area_left_microns: 0,
-        imageable_area_bottom_microns: 0,
-        imageable_area_right_microns: width,
-        imageable_area_top_microns: height
-      };
-    } else if (typeof pageSize === 'string' && PDFPageSizes[pageSize]) {
-      const mediaSize = PDFPageSizes[pageSize];
-      options.mediaSize = {
-        ...mediaSize,
-        imageable_area_left_microns: 0,
-        imageable_area_bottom_microns: 0,
-        imageable_area_right_microns: mediaSize.width_microns,
-        imageable_area_top_microns: mediaSize.height_microns
-      };
-    } else {
-      throw new Error(`Unsupported pageSize: ${pageSize}`);
+  const pageSize = options.pageSize ?? 'A4';
+  if (typeof pageSize === 'object') {
+    if (!pageSize.height || !pageSize.width) {
+      throw new Error('height and width properties are required for pageSize');
     }
+
+    // Dimensions in Microns - 1 meter = 10^6 microns
+    const height = Math.ceil(pageSize.height);
+    const width = Math.ceil(pageSize.width);
+    if (!isValidCustomPageSize(width, height)) {
+      throw new Error('height and width properties must be minimum 352 microns.');
+    }
+
+    printSettings.mediaSize = {
+      name: 'CUSTOM',
+      custom_display_name: 'Custom',
+      height_microns: height,
+      width_microns: width,
+      imageable_area_left_microns: 0,
+      imageable_area_bottom_microns: 0,
+      imageable_area_right_microns: width,
+      imageable_area_top_microns: height
+    };
+  } else if (typeof pageSize === 'string' && PDFPageSizes[pageSize]) {
+    const mediaSize = PDFPageSizes[pageSize];
+    printSettings.mediaSize = {
+      ...mediaSize,
+      imageable_area_left_microns: 0,
+      imageable_area_bottom_microns: 0,
+      imageable_area_right_microns: mediaSize.width_microns,
+      imageable_area_top_microns: mediaSize.height_microns
+    };
+  } else {
+    throw new Error(`Unsupported pageSize: ${pageSize}`);
   }
 
   if (this._print) {
     if (callback) {
-      this._print(options, callback);
+      this._print(printSettings, callback);
     } else {
-      this._print(options);
+      this._print(printSettings);
     }
   } else {
     console.error('Error: Printing feature is disabled.');
@@ -653,8 +657,8 @@ WebContents.prototype._init = function () {
     ipcMain.emit(channel, event, message);
   });
 
-  this.on('crashed', (event, ...args) => {
-    app.emit('renderer-process-crashed', event, this, ...args);
+  deprecate.event(this, 'crashed', 'render-process-gone', (event: Electron.Event, details: Electron.RenderProcessGoneDetails) => {
+    return [event, details.reason === 'killed'];
   });
 
   this.on('render-process-gone', (event, details) => {

lib/common/deprecate.ts

@@ -66,14 +66,17 @@ export function renameFunction<T extends Function> (fn: T, newName: string): T {
 }
 
 // change the name of an event
-export function event (emitter: NodeJS.EventEmitter, oldName: string, newName: string) {
+export function event (emitter: NodeJS.EventEmitter, oldName: string, newName: string, transformer: (...args: any[]) => any[] | undefined = (...args) => args) {
   const warn = newName.startsWith('-') /* internal event */
     ? warnOnce(`${oldName} event`)
     : warnOnce(`${oldName} event`, `${newName} event`);
   return emitter.on(newName, function (this: NodeJS.EventEmitter, ...args) {
     if (this.listenerCount(oldName) !== 0) {
       warn();
-      this.emit(oldName, ...args);
+      const transformedArgs = transformer(...args);
+      if (transformedArgs) {
+        this.emit(oldName, ...transformedArgs);
+      }
     }
   });
 }

package.json

@@ -89,10 +89,10 @@
     "lint:objc": "node ./script/lint.js --objc",
     "lint:py": "node ./script/lint.js --py",
     "lint:gn": "node ./script/lint.js --gn",
-    "lint:docs": "remark docs -qf && npm run lint:js-in-markdown && npm run create-typescript-definitions && npm run lint:ts-check-js-in-markdown && npm run lint:docs-fiddles && npm run lint:docs-relative-links && npm run lint:markdownlint",
+    "lint:docs": "remark docs -qf && npm run lint:js-in-markdown && npm run create-typescript-definitions && npm run lint:ts-check-js-in-markdown && npm run lint:docs-fiddles && npm run lint:docs-relative-links && npm run lint:markdown",
     "lint:docs-fiddles": "standard \"docs/fiddles/**/*.js\"",
     "lint:docs-relative-links": "electron-lint-markdown-links --root docs \"**/*.md\"",
-    "lint:markdownlint": "electron-markdownlint \"*.md\" \"docs/**/*.md\"",
+    "lint:markdown": "node ./script/lint.js --md",
     "lint:ts-check-js-in-markdown": "electron-lint-markdown-ts-check --root docs \"**/*.md\" --ignore \"breaking-changes.md\"",
     "lint:js-in-markdown": "electron-lint-markdown-standard --root docs \"**/*.md\"",
     "create-api-json": "node script/create-api-json.js",

patches/angle/.patches

@@ -0,0 +1,4 @@
+m120_translator_optimize_field-name-collision_check.patch
+m120_translator_fail_compilation_if_too_many_struct_fields.patch
+m120_translator_limit_private_variable_size_to_64kb.patch
+m120_vulkan_don_t_crash_when_glcopyteximage2d_redefines_itself.patch

patches/angle/m120_translator_fail_compilation_if_too_many_struct_fields.patch

@@ -0,0 +1,215 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Shahbaz Youssefi <syoussefi@chromium.org>
+Date: Thu, 30 Nov 2023 14:12:42 -0500
+Subject: M120: Translator: Fail compilation if too many struct fields
+
+If there are too many struct fields, SPIR-V cannot be produced (as it
+has a hard limit of 16383 fields).  The Nvidia GL driver has also been
+observed to fail when there are too many fields.
+
+Bug: chromium:1505009
+Change-Id: I29fd61d180175e89e7db9ca8ba49ab07585b5f9a
+Reviewed-on: https://chromium-review.googlesource.com/c/angle/angle/+/5143827
+Reviewed-by: Cody Northrop <cnorthrop@google.com>
+
+diff --git a/src/compiler/translator/ParseContext.cpp b/src/compiler/translator/ParseContext.cpp
+index 7c90ea4f1d23a8af0cab1d44124eea021a27a16d..e174725beb764407185e471a9916ffd164493cd8 100644
+--- a/src/compiler/translator/ParseContext.cpp
++++ b/src/compiler/translator/ParseContext.cpp
+@@ -4726,6 +4726,8 @@ TIntermDeclaration *TParseContext::addInterfaceBlock(
+     const TVector<unsigned int> *arraySizes,
+     const TSourceLoc &arraySizesLine)
+ {
++    checkDoesNotHaveTooManyFields(blockName, fieldList, nameLine);
++
+     // Ensure there are no duplicate field names
+     checkDoesNotHaveDuplicateFieldNames(fieldList, nameLine);
+ 
+@@ -6289,6 +6291,21 @@ void TParseContext::checkDoesNotHaveDuplicateFieldNames(const TFieldList *fields
+     }
+ }
+ 
++void TParseContext::checkDoesNotHaveTooManyFields(const ImmutableString &name,
++                                                  const TFieldList *fields,
++                                                  const TSourceLoc &location)
++{
++    // Check that there are not too many fields.  SPIR-V has a limit of 16383 fields, and it would
++    // be reasonable to apply that limit to all outputs.  For example, it was observed that 32768
++    // fields cause the Nvidia GL driver to fail compilation, so such a limit is not too specific to
++    // SPIR-V.
++    constexpr size_t kMaxFieldCount = 16383;
++    if (fields->size() > kMaxFieldCount)
++    {
++        error(location, "Too many fields in the struct (limit is 16383)", name);
++    }
++}
++
+ TFieldList *TParseContext::addStructFieldList(TFieldList *fields, const TSourceLoc &location)
+ {
+     return fields;
+@@ -6392,6 +6409,8 @@ TTypeSpecifierNonArray TParseContext::addStructure(const TSourceLoc &structLine,
+         }
+     }
+ 
++    checkDoesNotHaveTooManyFields(structName, fieldList, structLine);
++
+     // Ensure there are no duplicate field names
+     checkDoesNotHaveDuplicateFieldNames(fieldList, structLine);
+ 
+diff --git a/src/compiler/translator/ParseContext.h b/src/compiler/translator/ParseContext.h
+index b63dbbadd146d1a004513823de72c89240a31929..c83b73271b557ed122668d7e655deae5aa23bc48 100644
+--- a/src/compiler/translator/ParseContext.h
++++ b/src/compiler/translator/ParseContext.h
+@@ -355,6 +355,9 @@ class TParseContext : angle::NonCopyable
+                                             const TVector<unsigned int> *arraySizes);
+ 
+     void checkDoesNotHaveDuplicateFieldNames(const TFieldList *fields, const TSourceLoc &location);
++    void checkDoesNotHaveTooManyFields(const ImmutableString &name,
++                                       const TFieldList *fields,
++                                       const TSourceLoc &location);
+     TFieldList *addStructFieldList(TFieldList *fields, const TSourceLoc &location);
+     TFieldList *combineStructFieldLists(TFieldList *processedFields,
+                                         const TFieldList *newlyAddedFields,
+diff --git a/src/tests/compiler_tests/ExpressionLimit_test.cpp b/src/tests/compiler_tests/ExpressionLimit_test.cpp
+index d399e1792d97edb76d5e0247e4166e094cecb7e5..e17eace1b4b9a4185d6833fb7895f5fd49ae7679 100644
+--- a/src/tests/compiler_tests/ExpressionLimit_test.cpp
++++ b/src/tests/compiler_tests/ExpressionLimit_test.cpp
+@@ -16,12 +16,6 @@ class ExpressionLimitTest : public testing::Test
+     static const int kMaxExpressionComplexity = 16;
+     static const int kMaxCallStackDepth       = 16;
+     static const int kMaxFunctionParameters   = 16;
+-    static const char *kExpressionTooComplex;
+-    static const char *kCallStackTooDeep;
+-    static const char *kHasRecursion;
+-    static const char *kTooManyParameters;
+-    static const char *kTooComplexSwitch;
+-    static const char *kGlobalVariableInit;
+ 
+     virtual void SetUp()
+     {
+@@ -125,9 +119,7 @@ class ExpressionLimitTest : public testing::Test
+ 
+         GenerateDeepFunctionStack(length, &ss);
+ 
+-        ss << "void main() {\n"
+-           << "  gl_FragColor = function" << length << "();\n"
+-           << "}";
++        ss << "void main() {\n" << "  gl_FragColor = function" << length << "();\n" << "}";
+ 
+         return ss.str();
+     }
+@@ -138,9 +130,7 @@ class ExpressionLimitTest : public testing::Test
+ 
+         GenerateDeepFunctionStack(length, &ss);
+ 
+-        ss << "void main() {\n"
+-           << "  gl_FragColor = vec4(0,0,0,0);\n"
+-           << "}";
++        ss << "void main() {\n" << "  gl_FragColor = vec4(0,0,0,0);\n" << "}";
+ 
+         return ss.str();
+     }
+@@ -149,9 +139,7 @@ class ExpressionLimitTest : public testing::Test
+     {
+         std::stringstream ss;
+ 
+-        ss << "precision mediump float;\n"
+-           << "\n"
+-           << "float foo(";
++        ss << "precision mediump float;\n" << "\n" << "float foo(";
+         for (int i = 0; i < parameters; ++i)
+         {
+             ss << "float f" << i;
+@@ -244,15 +232,13 @@ class ExpressionLimitTest : public testing::Test
+     ShBuiltInResources resources;
+ };
+ 
+-const char *ExpressionLimitTest::kExpressionTooComplex = "Expression too complex";
+-const char *ExpressionLimitTest::kCallStackTooDeep     = "Call stack too deep";
+-const char *ExpressionLimitTest::kHasRecursion =
+-    "Recursive function call in the following call chain";
+-const char *ExpressionLimitTest::kTooManyParameters = "Function has too many parameters";
+-const char *ExpressionLimitTest::kTooComplexSwitch =
+-    "too complex expressions inside a switch statement";
+-const char *ExpressionLimitTest::kGlobalVariableInit =
+-    "global variable initializers must be constant expressions";
++constexpr char kExpressionTooComplex[] = "Expression too complex";
++constexpr char kCallStackTooDeep[]     = "Call stack too deep";
++constexpr char kHasRecursion[]         = "Recursive function call in the following call chain";
++constexpr char kTooManyParameters[]    = "Function has too many parameters";
++constexpr char kTooComplexSwitch[]     = "too complex expressions inside a switch statement";
++constexpr char kGlobalVariableInit[] = "global variable initializers must be constant expressions";
++constexpr char kTooManyFields[]      = "Too many fields in the struct";
+ 
+ TEST_F(ExpressionLimitTest, ExpressionComplexity)
+ {
+@@ -632,3 +618,31 @@ TEST_F(ExpressionLimitTest, NestingInsideGlobalInitializer)
+         compileOptions, nullptr));
+     sh::Destruct(compiler);
+ }
++
++TEST_F(ExpressionLimitTest, TooManyStructFields)
++{
++    ShShaderSpec spec     = SH_WEBGL2_SPEC;
++    ShShaderOutput output = SH_ESSL_OUTPUT;
++    ShHandle compiler     = sh::ConstructCompiler(GL_FRAGMENT_SHADER, spec, output, &resources);
++    ShCompileOptions compileOptions = {};
++
++    std::ostringstream fs;
++    fs << R"(#version 300 es
++precision highp float;
++struct TooManyFields
++{
++)";
++    for (uint32_t i = 0; i < (1 << 16); ++i)
++    {
++        fs << "    float field" << i << ";\n";
++    }
++    fs << R"(};
++uniform B { TooManyFields s; };
++out vec4 color;
++void main() {
++    color = vec4(s.field0, 0.0, 0.0, 1.0);
++})";
++
++    EXPECT_TRUE(CheckShaderCompilation(compiler, fs.str().c_str(), compileOptions, kTooManyFields));
++    sh::Destruct(compiler);
++}
+diff --git a/src/tests/gl_tests/GLSLTest.cpp b/src/tests/gl_tests/GLSLTest.cpp
+index 0fa89f59a38165b8d526a99bae60c7b752dec15d..d7eb48eacfe58fc128fc2d24088ac18ea5196c05 100644
+--- a/src/tests/gl_tests/GLSLTest.cpp
++++ b/src/tests/gl_tests/GLSLTest.cpp
+@@ -18168,6 +18168,33 @@ void main() {
+     ANGLE_GL_PROGRAM(program, essl3_shaders::vs::Simple(), fs.str().c_str());
+ }
+ 
++// Test that structs with too many fields are rejected.  In SPIR-V, the instruction that defines the
++// struct lists the fields which means the length of the instruction is a function of the field
++// count.  Since SPIR-V instruction sizes are limited to 16 bits, structs with more fields cannot be
++// represented.
++TEST_P(GLSLTest_ES3, TooManyFieldsInStruct)
++{
++    std::ostringstream fs;
++    fs << R"(#version 300 es
++precision highp float;
++struct TooManyFields
++{
++)";
++    for (uint32_t i = 0; i < (1 << 16); ++i)
++    {
++        fs << "    float field" << i << ";\n";
++    }
++    fs << R"(};
++uniform B { TooManyFields s; };
++out vec4 color;
++void main() {
++    color = vec4(s.field0, 0.0, 0.0, 1.0);
++})";
++
++    GLuint shader = CompileShader(GL_FRAGMENT_SHADER, fs.str().c_str());
++    EXPECT_EQ(0u, shader);
++}
++
+ }  // anonymous namespace
+ 
+ ANGLE_INSTANTIATE_TEST_ES2_AND_ES3(GLSLTest);

patches/angle/m120_translator_limit_private_variable_size_to_64kb.patch

@@ -0,0 +1,416 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Shahbaz Youssefi <syoussefi@chromium.org>
+Date: Thu, 30 Nov 2023 15:42:32 -0500
+Subject: M120: Translator: Limit private variable size to 64KB
+
+This is indirectly fixing an issue where passing large arrays in SPIR-V
+such that an internal cast is needed (such as array inside interface
+block copied to local varaible) causes an overflow of the instruction
+length limit (in the absence of OpCopyLogical).
+
+By limiting the size of private variables to 32KB, this limitation is
+indirectly enforced.  It was observed that all the test shaders added in
+this CL fail on the Nvidia OpenGL drivers, so such a limit seems to be
+reasonble.
+
+Bug: chromium:1505009
+Change-Id: I75a1e40a538120ffc69ae7edafbdba5830c6b0bb
+Reviewed-on: https://chromium-review.googlesource.com/c/angle/angle/+/5143828
+Reviewed-by: Cody Northrop <cnorthrop@google.com>
+
+diff --git a/src/compiler/translator/Compiler.cpp b/src/compiler/translator/Compiler.cpp
+index 1f3a4d52f2f45e7ed10b9b5512f2f92a06877256..c70c419631a1c4d382bcc8ba36c35d0ba06c2c5d 100644
+--- a/src/compiler/translator/Compiler.cpp
++++ b/src/compiler/translator/Compiler.cpp
+@@ -771,11 +771,6 @@ bool TCompiler::checkAndSimplifyAST(TIntermBlock *root,
+         return false;
+     }
+ 
+-    if (shouldLimitTypeSizes() && !ValidateTypeSizeLimitations(root, &mSymbolTable, &mDiagnostics))
+-    {
+-        return false;
+-    }
+-
+     if (!ValidateFragColorAndFragData(mShaderType, mShaderVersion, mSymbolTable, &mDiagnostics))
+     {
+         return false;
+@@ -1056,6 +1051,13 @@ bool TCompiler::checkAndSimplifyAST(TIntermBlock *root,
+         return false;
+     }
+ 
++    // Run after RemoveUnreferencedVariables, validate that the shader does not have excessively
++    // large variables.
++    if (shouldLimitTypeSizes() && !ValidateTypeSizeLimitations(root, &mSymbolTable, &mDiagnostics))
++    {
++        return false;
++    }
++
+     // Built-in function emulation needs to happen after validateLimitations pass.
+     GetGlobalPoolAllocator()->lock();
+     initBuiltInFunctionEmulator(&mBuiltInFunctionEmulator, compileOptions);
+diff --git a/src/compiler/translator/ValidateTypeSizeLimitations.cpp b/src/compiler/translator/ValidateTypeSizeLimitations.cpp
+index f0ff9cb11ac39e62672285300c8f41641f12c617..8f02c65b5ec5fd20b8bcee2bc595cfb278f758b4 100644
+--- a/src/compiler/translator/ValidateTypeSizeLimitations.cpp
++++ b/src/compiler/translator/ValidateTypeSizeLimitations.cpp
+@@ -24,10 +24,11 @@ namespace
+ // Arbitrarily enforce that all types declared with a size in bytes of over 2 GB will cause
+ // compilation failure.
+ //
+-// For local and global variables, the limit is much lower (16MB) as that much memory won't fit in
++// For local and global variables, the limit is much lower (64KB) as that much memory won't fit in
+ // the GPU registers anyway.
+-constexpr size_t kMaxVariableSizeInBytes        = static_cast<size_t>(2) * 1024 * 1024 * 1024;
+-constexpr size_t kMaxPrivateVariableSizeInBytes = static_cast<size_t>(16) * 1024 * 1024;
++constexpr size_t kMaxVariableSizeInBytes             = static_cast<size_t>(2) * 1024 * 1024 * 1024;
++constexpr size_t kMaxPrivateVariableSizeInBytes      = static_cast<size_t>(64) * 1024;
++constexpr size_t kMaxTotalPrivateVariableSizeInBytes = static_cast<size_t>(16) * 1024 * 1024;
+ 
+ // Traverses intermediate tree to ensure that the shader does not
+ // exceed certain implementation-defined limits on the sizes of types.
+@@ -70,43 +71,115 @@ class ValidateTypeSizeLimitationsTraverser : public TIntermTraverser
+                 continue;
+             }
+ 
+-            const TType &variableType = asSymbol->getType();
+-
+-            // Create a ShaderVariable from which to compute
+-            // (conservative) sizing information.
+-            ShaderVariable shaderVar;
+-            setCommonVariableProperties(variableType, variable, &shaderVar);
+-
+-            // Compute the std140 layout of this variable, assuming
+-            // it's a member of a block (which it might not be).
+-            Std140BlockEncoder layoutEncoder;
+-            BlockEncoderVisitor visitor("", "", &layoutEncoder);
+-            // Since the size limit's arbitrary, it doesn't matter
+-            // whether the row-major layout is correctly determined.
+-            bool isRowMajorLayout = false;
+-            TraverseShaderVariable(shaderVar, isRowMajorLayout, &visitor);
+-            if (layoutEncoder.getCurrentOffset() > kMaxVariableSizeInBytes)
++            if (!validateVariableSize(variable, asSymbol->getLine()))
+             {
+-                error(asSymbol->getLine(),
+-                      "Size of declared variable exceeds implementation-defined limit",
+-                      asSymbol->getName());
+                 return false;
+             }
++        }
++
++        return true;
++    }
++
++    void visitFunctionPrototype(TIntermFunctionPrototype *node) override
++    {
++        const TFunction *function = node->getFunction();
++        const size_t paramCount   = function->getParamCount();
++
++        for (size_t paramIndex = 0; paramIndex < paramCount; ++paramIndex)
++        {
++            validateVariableSize(*function->getParam(paramIndex), node->getLine());
++        }
++    }
++
++    bool validateVariableSize(const TVariable &variable, const TSourceLoc &location)
++    {
++        const TType &variableType = variable.getType();
++
++        // Create a ShaderVariable from which to compute
++        // (conservative) sizing information.
++        ShaderVariable shaderVar;
++        setCommonVariableProperties(variableType, variable, &shaderVar);
++
++        // Compute the std140 layout of this variable, assuming
++        // it's a member of a block (which it might not be).
++        Std140BlockEncoder layoutEncoder;
++        BlockEncoderVisitor visitor("", "", &layoutEncoder);
++        // Since the size limit's arbitrary, it doesn't matter
++        // whether the row-major layout is correctly determined.
++        bool isRowMajorLayout = false;
++        TraverseShaderVariable(shaderVar, isRowMajorLayout, &visitor);
++        if (layoutEncoder.getCurrentOffset() > kMaxVariableSizeInBytes)
++        {
++            error(location, "Size of declared variable exceeds implementation-defined limit",
++                  variable.name());
++            return false;
++        }
++
++        // Skip over struct declarations.  As long as they are not used (or if they are used later
++        // in a less-restricted context (such as a UBO or SSBO)), they can be larger than
++        // kMaxPrivateVariableSizeInBytes.
++        if (variable.symbolType() == SymbolType::Empty && variableType.isStructSpecifier())
++        {
++            return true;
++        }
++
++        switch (variableType.getQualifier())
++        {
++            // List of all types that need to be limited (for example because they cause overflows
++            // in drivers, or create trouble for the SPIR-V gen as the number of an instruction's
++            // arguments cannot be more than 64KB (see OutputSPIRVTraverser::cast)).
++
++            // Local/global variables
++            case EvqTemporary:
++            case EvqGlobal:
++            case EvqConst:
++
++            // Function arguments
++            case EvqParamIn:
++            case EvqParamOut:
++            case EvqParamInOut:
++            case EvqParamConst:
++
++            // Varyings
++            case EvqVaryingIn:
++            case EvqVaryingOut:
++            case EvqSmoothOut:
++            case EvqFlatOut:
++            case EvqNoPerspectiveOut:
++            case EvqCentroidOut:
++            case EvqSampleOut:
++            case EvqNoPerspectiveCentroidOut:
++            case EvqNoPerspectiveSampleOut:
++            case EvqSmoothIn:
++            case EvqFlatIn:
++            case EvqNoPerspectiveIn:
++            case EvqCentroidIn:
++            case EvqNoPerspectiveCentroidIn:
++            case EvqNoPerspectiveSampleIn:
++            case EvqVertexOut:
++            case EvqFragmentIn:
++            case EvqGeometryIn:
++            case EvqGeometryOut:
++            case EvqPerVertexIn:
++            case EvqPerVertexOut:
++            case EvqPatchIn:
++            case EvqPatchOut:
++            case EvqTessControlIn:
++            case EvqTessControlOut:
++            case EvqTessEvaluationIn:
++            case EvqTessEvaluationOut:
+ 
+-            const bool isPrivate = variableType.getQualifier() == EvqTemporary ||
+-                                   variableType.getQualifier() == EvqGlobal ||
+-                                   variableType.getQualifier() == EvqConst;
+-            if (isPrivate)
+-            {
+                 if (layoutEncoder.getCurrentOffset() > kMaxPrivateVariableSizeInBytes)
+                 {
+-                    error(asSymbol->getLine(),
++                    error(location,
+                           "Size of declared private variable exceeds implementation-defined limit",
+-                          asSymbol->getName());
++                          variable.name());
+                     return false;
+                 }
+                 mTotalPrivateVariablesSize += layoutEncoder.getCurrentOffset();
+-            }
++                break;
++            default:
++                break;
+         }
+ 
+         return true;
+@@ -115,7 +188,7 @@ class ValidateTypeSizeLimitationsTraverser : public TIntermTraverser
+     void validateTotalPrivateVariableSize()
+     {
+         if (mTotalPrivateVariablesSize.ValueOrDefault(std::numeric_limits<size_t>::max()) >
+-            kMaxPrivateVariableSizeInBytes)
++            kMaxTotalPrivateVariableSizeInBytes)
+         {
+             mDiagnostics->error(
+                 TSourceLoc{},
+diff --git a/src/tests/angle_end2end_tests_expectations.txt b/src/tests/angle_end2end_tests_expectations.txt
+index 91233461298150dff48e4d044eb8535e1bcfb7b6..f1343f8e8ad65b6fa292c630214c66aaf3ff5a64 100644
+--- a/src/tests/angle_end2end_tests_expectations.txt
++++ b/src/tests/angle_end2end_tests_expectations.txt
+@@ -110,6 +110,8 @@ b/273271471 WIN INTEL VULKAN : ShaderAlgorithmTest.rgb_to_hsl_vertex_shader/* =
+ 7872 WIN INTEL OPENGL : VertexAttributeTest.AliasingMatrixAttribLocations/ES2_OpenGL = SKIP
+ 7872 WIN INTEL OPENGL : VertexAttributeTest.ShortUnnormalized/ES2_OpenGL = SKIP
+ 7872 WIN INTEL OPENGL : ViewportTest.DoubleWindowCentered/ES2_OpenGL = SKIP
++8441 WIN INTEL OPENGL : GLSLTest_ES3.LargeInterfaceBlockArray/* = SKIP
++8441 WIN INTEL OPENGL : GLSLTest_ES3.LargeInterfaceBlockNestedArray/* = SKIP
+ 
+ // Linux
+ 6065 LINUX INTEL VULKAN : SimpleStateChangeTestES31.DrawThenUpdateUBOThenDrawThenDrawIndexed/* = SKIP
+@@ -146,6 +148,10 @@ b/273271471 WIN INTEL VULKAN : ShaderAlgorithmTest.rgb_to_hsl_vertex_shader/* =
+ 6977 LINUX NVIDIA OpenGL : MipmapTestES31.GenerateLowerMipsWithDraw/* = SKIP
+ 7301 LINUX NVIDIA OpenGL : CopyTexImageTest.RGBAToRGB/ES2_OpenGL_EmulateCopyTexImage2DFromRenderbuffers/* = SKIP
+ 7371 LINUX NVIDIA OpenGL : FramebufferTest_ES3.SurfaceDimensionsChangeAndFragCoord/* = SKIP
++8441 NVIDIA OPENGL : GLSLTest_ES3.LargeInterfaceBlockArray/* = SKIP
++8441 NVIDIA OPENGL : GLSLTest_ES3.LargeInterfaceBlockNestedArray/* = SKIP
++8441 NVIDIA GLES : GLSLTest_ES3.LargeInterfaceBlockArray/* = SKIP
++8441 NVIDIA GLES : GLSLTest_ES3.LargeInterfaceBlockNestedArray/* = SKIP
+ 
+ // Nvidia Vulkan
+ 7236 NVIDIA VULKAN : GLSLTest_ES31.TessellationControlShaderMatrixCopyBug/* = SKIP
+@@ -1055,6 +1061,8 @@ b/273271471 WIN INTEL VULKAN : ShaderAlgorithmTest.rgb_to_hsl_vertex_shader/* =
+ 7389 MAC OPENGL : Texture2DTest.ManySupersedingTextureUpdates/* = SKIP
+ 
+ 8437 MAC OPENGL : GLSLTest_ES3.LotsOfFieldsInStruct/* = SKIP
++8437 MAC OPENGL : GLSLTest_ES3.LargeInterfaceBlockArray/* = SKIP
++8437 MAC OPENGL : GLSLTest_ES3.LargeInterfaceBlockNestedArray/* = SKIP
+ 
+ // GL, GLES run into issues with cleanup
+ 7495 WIN OpenGL : EGLMultiContextTest.ReuseUnterminatedDisplay/* = SKIP
+diff --git a/src/tests/compiler_tests/RecordConstantPrecision_test.cpp b/src/tests/compiler_tests/RecordConstantPrecision_test.cpp
+index 07923f991423f4ec1ff8cbe81fb822c2b526d149..9446576ac797c0e5db8f9c63d79adff744ea488e 100644
+--- a/src/tests/compiler_tests/RecordConstantPrecision_test.cpp
++++ b/src/tests/compiler_tests/RecordConstantPrecision_test.cpp
+@@ -141,11 +141,11 @@ TEST_F(RecordConstantPrecisionTest, HigherPrecisionConstantInIndex)
+ uniform mediump float u;
+ void main()
+ {
+-    const highp int a = 33000;
+-    mediump float b[34000];
++    const highp int a = 330;
++    mediump float b[340];
+     gl_FragColor = vec4(b[a]);
+ })";
+     compile(shaderString);
+     ASSERT_FALSE(foundInCode("const highp int s"));
+-    ASSERT_TRUE(foundInCode("b[33000]"));
++    ASSERT_TRUE(foundInCode("b[330]"));
+ }
+diff --git a/src/tests/gl_tests/GLSLTest.cpp b/src/tests/gl_tests/GLSLTest.cpp
+index d7eb48eacfe58fc128fc2d24088ac18ea5196c05..f4b7ce6222ff4a29cb20b75bc102e2c8ae478189 100644
+--- a/src/tests/gl_tests/GLSLTest.cpp
++++ b/src/tests/gl_tests/GLSLTest.cpp
+@@ -18195,6 +18195,138 @@ void main() {
+     EXPECT_EQ(0u, shader);
+ }
+ 
++// Test that passing large arrays to functions are compiled correctly.  Regression test for the
++// SPIR-V generator that made a copy of the array to pass to the function, by decomposing and
++// reconstructing it (in the absence of OpCopyLogical), but the reconstruction instruction has a
++// length higher than can fit in SPIR-V.
++TEST_P(GLSLTest_ES3, LargeInterfaceBlockArrayPassedToFunction)
++{
++    constexpr char kFS[] = R"(#version 300 es
++precision highp float;
++uniform Large { float a[65536]; };
++float f(float b[65536])
++{
++    b[0] = 1.0;
++    return b[0] + b[1];
++}
++out vec4 color;
++void main() {
++    color = vec4(f(a), 0.0, 0.0, 1.0);
++})";
++
++    GLuint shader = CompileShader(GL_FRAGMENT_SHADER, kFS);
++    EXPECT_EQ(0u, shader);
++}
++
++// Make sure the shader in LargeInterfaceBlockArrayPassedToFunction works if the large local is
++// avoided.
++TEST_P(GLSLTest_ES3, LargeInterfaceBlockArray)
++{
++    int maxUniformBlockSize = 0;
++    glGetIntegerv(GL_MAX_UNIFORM_BLOCK_SIZE, &maxUniformBlockSize);
++    ANGLE_SKIP_TEST_IF(maxUniformBlockSize < 16384 * 4);
++
++    constexpr char kFS[] = R"(#version 300 es
++precision highp float;
++uniform Large { float a[16384]; };
++out vec4 color;
++void main() {
++    color = vec4(a[0], 0.0, 0.0, 1.0);
++})";
++
++    ANGLE_GL_PROGRAM(program, essl3_shaders::vs::Simple(), kFS);
++}
++
++// Similar to LargeInterfaceBlockArrayPassedToFunction, but the array is nested in a struct.
++TEST_P(GLSLTest_ES3, LargeInterfaceBlockNestedArrayPassedToFunction)
++{
++    constexpr char kFS[] = R"(#version 300 es
++precision highp float;
++struct S { float a[65536]; };
++uniform Large { S s; };
++float f(float b[65536])
++{
++    b[0] = 1.0;
++    return b[0] + b[1];
++}
++out vec4 color;
++void main() {
++    color = vec4(f(s.a), 0.0, 0.0, 1.0);
++})";
++
++    GLuint shader = CompileShader(GL_FRAGMENT_SHADER, kFS);
++    EXPECT_EQ(0u, shader);
++}
++
++// Make sure the shader in LargeInterfaceBlockNestedArrayPassedToFunction works if the large local
++// is avoided.
++TEST_P(GLSLTest_ES3, LargeInterfaceBlockNestedArray)
++{
++    int maxUniformBlockSize = 0;
++    glGetIntegerv(GL_MAX_UNIFORM_BLOCK_SIZE, &maxUniformBlockSize);
++    ANGLE_SKIP_TEST_IF(maxUniformBlockSize < 16384 * 4);
++
++    constexpr char kFS[] = R"(#version 300 es
++precision highp float;
++struct S { float a[16384]; };
++uniform Large { S s; };
++out vec4 color;
++void main() {
++    color = vec4(s.a[0], 0.0, 0.0, 1.0);
++})";
++
++    ANGLE_GL_PROGRAM(program, essl3_shaders::vs::Simple(), kFS);
++}
++
++// Similar to LargeInterfaceBlockArrayPassedToFunction, but the large array is copied to a local
++// variable instead.
++TEST_P(GLSLTest_ES3, LargeInterfaceBlockArrayCopiedToLocal)
++{
++    constexpr char kFS[] = R"(#version 300 es
++precision highp float;
++uniform Large { float a[65536]; };
++out vec4 color;
++void main() {
++    float b[65536] = a;
++    color = vec4(b[0], 0.0, 0.0, 1.0);
++})";
++
++    GLuint shader = CompileShader(GL_FRAGMENT_SHADER, kFS);
++    EXPECT_EQ(0u, shader);
++}
++
++// Similar to LargeInterfaceBlockArrayCopiedToLocal, but the array is nested in a struct
++TEST_P(GLSLTest_ES3, LargeInterfaceBlockNestedArrayCopiedToLocal)
++{
++    constexpr char kFS[] = R"(#version 300 es
++precision highp float;
++struct S { float a[65536]; };
++uniform Large { S s; };
++out vec4 color;
++void main() {
++    S s2 = s;
++    color = vec4(s2.a[0], 0.0, 0.0, 1.0);
++})";
++
++    GLuint shader = CompileShader(GL_FRAGMENT_SHADER, kFS);
++    EXPECT_EQ(0u, shader);
++}
++
++// Test that too large varyings are rejected.
++TEST_P(GLSLTest_ES3, LargeArrayVarying)
++{
++    constexpr char kFS[] = R"(#version 300 es
++precision highp float;
++in float a[65536];
++out vec4 color;
++void main() {
++    color = vec4(a[0], 0.0, 0.0, 1.0);
++})";
++
++    GLuint shader = CompileShader(GL_FRAGMENT_SHADER, kFS);
++    EXPECT_EQ(0u, shader);
++}
++
+ }  // anonymous namespace
+ 
+ ANGLE_INSTANTIATE_TEST_ES2_AND_ES3(GLSLTest);

patches/angle/m120_translator_optimize_field-name-collision_check.patch

@@ -0,0 +1,180 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Shahbaz Youssefi <syoussefi@chromium.org>
+Date: Thu, 30 Nov 2023 13:53:00 -0500
+Subject: M120: Translator: Optimize field-name-collision check
+
+As each field of the struct was encountered, its name was linearly
+checked against previously added fields.  That's O(n^2).
+
+The name collision check is now moved to when the struct is completely
+defined, and is done with an unordered_map.
+
+Bug: chromium:1505009
+Change-Id: I3fbc23493e5a03e61b631af615cffaf9995fd566
+Reviewed-on: https://chromium-review.googlesource.com/c/angle/angle/+/5143826
+Reviewed-by: Cody Northrop <cnorthrop@google.com>
+
+diff --git a/src/compiler/translator/ParseContext.cpp b/src/compiler/translator/ParseContext.cpp
+index 28ac378cab6cb3812a43b6064733d7354ee694bc..7c90ea4f1d23a8af0cab1d44124eea021a27a16d 100644
+--- a/src/compiler/translator/ParseContext.cpp
++++ b/src/compiler/translator/ParseContext.cpp
+@@ -4726,6 +4726,9 @@ TIntermDeclaration *TParseContext::addInterfaceBlock(
+     const TVector<unsigned int> *arraySizes,
+     const TSourceLoc &arraySizesLine)
+ {
++    // Ensure there are no duplicate field names
++    checkDoesNotHaveDuplicateFieldNames(fieldList, nameLine);
++
+     const bool isGLPerVertex = blockName == "gl_PerVertex";
+     // gl_PerVertex is allowed to be redefined and therefore not reserved
+     if (!isGLPerVertex)
+@@ -6269,28 +6272,25 @@ TDeclarator *TParseContext::parseStructArrayDeclarator(const ImmutableString &id
+     return new TDeclarator(identifier, arraySizes, loc);
+ }
+ 
+-void TParseContext::checkDoesNotHaveDuplicateFieldName(const TFieldList::const_iterator begin,
+-                                                       const TFieldList::const_iterator end,
+-                                                       const ImmutableString &name,
+-                                                       const TSourceLoc &location)
++void TParseContext::checkDoesNotHaveDuplicateFieldNames(const TFieldList *fields,
++                                                        const TSourceLoc &location)
+ {
+-    for (auto fieldIter = begin; fieldIter != end; ++fieldIter)
++    TUnorderedMap<ImmutableString, uint32_t, ImmutableString::FowlerNollVoHash<sizeof(size_t)>>
++        fieldNames;
++    for (TField *field : *fields)
+     {
+-        if ((*fieldIter)->name() == name)
++        // Note: operator[] adds this name to the map if it doesn't already exist, and initializes
++        // its value to 0.
++        uint32_t count = ++fieldNames[field->name()];
++        if (count != 1)
+         {
+-            error(location, "duplicate field name in structure", name);
++            error(location, "Duplicate field name in structure", field->name());
+         }
+     }
+ }
+ 
+ TFieldList *TParseContext::addStructFieldList(TFieldList *fields, const TSourceLoc &location)
+ {
+-    for (TFieldList::const_iterator fieldIter = fields->begin(); fieldIter != fields->end();
+-         ++fieldIter)
+-    {
+-        checkDoesNotHaveDuplicateFieldName(fields->begin(), fieldIter, (*fieldIter)->name(),
+-                                           location);
+-    }
+     return fields;
+ }
+ 
+@@ -6298,12 +6298,8 @@ TFieldList *TParseContext::combineStructFieldLists(TFieldList *processedFields,
+                                                    const TFieldList *newlyAddedFields,
+                                                    const TSourceLoc &location)
+ {
+-    for (TField *field : *newlyAddedFields)
+-    {
+-        checkDoesNotHaveDuplicateFieldName(processedFields->begin(), processedFields->end(),
+-                                           field->name(), location);
+-        processedFields->push_back(field);
+-    }
++    processedFields->insert(processedFields->end(), newlyAddedFields->begin(),
++                            newlyAddedFields->end());
+     return processedFields;
+ }
+ 
+@@ -6396,7 +6392,10 @@ TTypeSpecifierNonArray TParseContext::addStructure(const TSourceLoc &structLine,
+         }
+     }
+ 
+-    // ensure we do not specify any storage qualifiers on the struct members
++    // Ensure there are no duplicate field names
++    checkDoesNotHaveDuplicateFieldNames(fieldList, structLine);
++
++    // Ensure we do not specify any storage qualifiers on the struct members
+     for (unsigned int typeListIndex = 0; typeListIndex < fieldList->size(); typeListIndex++)
+     {
+         TField &field              = *(*fieldList)[typeListIndex];
+diff --git a/src/compiler/translator/ParseContext.h b/src/compiler/translator/ParseContext.h
+index 9e1354ef816705fb512b40b329794e0282129807..b63dbbadd146d1a004513823de72c89240a31929 100644
+--- a/src/compiler/translator/ParseContext.h
++++ b/src/compiler/translator/ParseContext.h
+@@ -354,10 +354,7 @@ class TParseContext : angle::NonCopyable
+                                             const TSourceLoc &loc,
+                                             const TVector<unsigned int> *arraySizes);
+ 
+-    void checkDoesNotHaveDuplicateFieldName(const TFieldList::const_iterator begin,
+-                                            const TFieldList::const_iterator end,
+-                                            const ImmutableString &name,
+-                                            const TSourceLoc &location);
++    void checkDoesNotHaveDuplicateFieldNames(const TFieldList *fields, const TSourceLoc &location);
+     TFieldList *addStructFieldList(TFieldList *fields, const TSourceLoc &location);
+     TFieldList *combineStructFieldLists(TFieldList *processedFields,
+                                         const TFieldList *newlyAddedFields,
+diff --git a/src/tests/angle_end2end_tests_expectations.txt b/src/tests/angle_end2end_tests_expectations.txt
+index 04b1a80e4ccabf0043617d90a1a06cff25deab98..91233461298150dff48e4d044eb8535e1bcfb7b6 100644
+--- a/src/tests/angle_end2end_tests_expectations.txt
++++ b/src/tests/angle_end2end_tests_expectations.txt
+@@ -1054,6 +1054,8 @@ b/273271471 WIN INTEL VULKAN : ShaderAlgorithmTest.rgb_to_hsl_vertex_shader/* =
+ 7389 SWIFTSHADER : Texture2DTest.ManySupersedingTextureUpdates/* = SKIP
+ 7389 MAC OPENGL : Texture2DTest.ManySupersedingTextureUpdates/* = SKIP
+ 
++8437 MAC OPENGL : GLSLTest_ES3.LotsOfFieldsInStruct/* = SKIP
++
+ // GL, GLES run into issues with cleanup
+ 7495 WIN OpenGL : EGLMultiContextTest.ReuseUnterminatedDisplay/* = SKIP
+ 7495 WIN GLES : EGLMultiContextTest.ReuseUnterminatedDisplay/* = SKIP
+diff --git a/src/tests/gl_tests/GLSLTest.cpp b/src/tests/gl_tests/GLSLTest.cpp
+index 6443d47740d7f625fde2ebca2ef4a34d512d0883..0fa89f59a38165b8d526a99bae60c7b752dec15d 100644
+--- a/src/tests/gl_tests/GLSLTest.cpp
++++ b/src/tests/gl_tests/GLSLTest.cpp
+@@ -18124,6 +18124,50 @@ void main()
+     EXPECT_PIXEL_COLOR_EQ(0, 0, GLColor::green);
+ }
+ 
++// Test that Metal compiler doesn't inline non-const globals
++TEST_P(WebGLGLSLTest, InvalidGlobalsNotInlined)
++{
++    constexpr char kFS[] = R"(#version 100
++  precision highp float;
++  float v1 = 0.5;
++  float v2 = v1;
++
++  float f1() {
++    return v2;
++  }
++
++  void main() {
++    gl_FragColor = vec4(v1 + f1(),0.0,0.0, 1.0);
++  })";
++    ANGLE_GL_PROGRAM(program, essl1_shaders::vs::Simple(), kFS);
++    ASSERT_GL_NO_ERROR();
++}
++
++// Test that a struct can have lots of fields.  Regression test for an inefficient O(n^2) check for
++// fields having unique names.
++TEST_P(GLSLTest_ES3, LotsOfFieldsInStruct)
++{
++    std::ostringstream fs;
++    fs << R"(#version 300 es
++precision highp float;
++struct LotsOfFields
++{
++)";
++    // Note: 16383 is the SPIR-V limit for struct member count.
++    for (uint32_t i = 0; i < 16383; ++i)
++    {
++        fs << "    float field" << i << ";\n";
++    }
++    fs << R"(};
++uniform B { LotsOfFields s; };
++out vec4 color;
++void main() {
++    color = vec4(s.field0, 0.0, 0.0, 1.0);
++})";
++
++    ANGLE_GL_PROGRAM(program, essl3_shaders::vs::Simple(), fs.str().c_str());
++}
++
+ }  // anonymous namespace
+ 
+ ANGLE_INSTANTIATE_TEST_ES2_AND_ES3(GLSLTest);

patches/angle/m120_vulkan_don_t_crash_when_glcopyteximage2d_redefines_itself.patch

@@ -0,0 +1,135 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Shahbaz Youssefi <syoussefi@chromium.org>
+Date: Tue, 5 Dec 2023 13:36:53 -0500
+Subject: M120: Vulkan: Don't crash when glCopyTexImage2D redefines itself
+
+The Vulkan backend marks a level being redefined as such before doing
+the copy.  If a single-level texture was being redefined, it releases it
+so it can be immediately reallocated.  If the source of the copy is the
+same texture, this causes a crash.
+
+This can be properly supported by using a temp image to do the copy, but
+that is not implemented in this change.
+
+Bug: chromium:1501798
+Change-Id: I3a902b1e9eec41afd385d9c75a8c95dc986070a8
+Reviewed-on: https://chromium-review.googlesource.com/c/angle/angle/+/5143829
+Reviewed-by: Cody Northrop <cnorthrop@google.com>
+
+diff --git a/src/libANGLE/renderer/vulkan/TextureVk.cpp b/src/libANGLE/renderer/vulkan/TextureVk.cpp
+index 54d1184518e1cc6e83157b901a37e4ce1e9b58a5..98f66a1d4b02f78dcb3bdae673d21f4bd087fea7 100644
+--- a/src/libANGLE/renderer/vulkan/TextureVk.cpp
++++ b/src/libANGLE/renderer/vulkan/TextureVk.cpp
+@@ -879,8 +879,28 @@ angle::Result TextureVk::copyImage(const gl::Context *context,
+         gl::GetInternalFormatInfo(internalFormat, GL_UNSIGNED_BYTE);
+     const vk::Format &vkFormat = renderer->getFormat(internalFormatInfo.sizedInternalFormat);
+ 
++    // The texture level being redefined might be the same as the one bound to the framebuffer.
++    // This _could_ be supported by using a temp image before redefining the level (and potentially
++    // discarding the image).  However, this is currently unimplemented.
++    FramebufferVk *framebufferVk = vk::GetImpl(source);
++    RenderTargetVk *colorReadRT  = framebufferVk->getColorReadRenderTarget();
++    vk::ImageHelper *srcImage    = &colorReadRT->getImageForCopy();
++    const bool isCubeMap         = index.getType() == gl::TextureType::CubeMap;
++    gl::LevelIndex levelIndex(getNativeImageIndex(index).getLevelIndex());
++    const uint32_t layerIndex    = index.hasLayer() ? index.getLayerIndex() : 0;
++    const uint32_t redefinedFace = isCubeMap ? layerIndex : 0;
++    const uint32_t sourceFace    = isCubeMap ? colorReadRT->getLayerIndex() : 0;
++    const bool isSelfCopy = mImage == srcImage && levelIndex == colorReadRT->getLevelIndex() &&
++                            redefinedFace == sourceFace;
++
+     ANGLE_TRY(redefineLevel(context, index, vkFormat, newImageSize));
+ 
++    if (isSelfCopy)
++    {
++        UNIMPLEMENTED();
++        return angle::Result::Continue;
++    }
++
+     return copySubImageImpl(context, index, gl::Offset(0, 0, 0), sourceArea, internalFormatInfo,
+                             source);
+ }
+@@ -1949,7 +1969,8 @@ angle::Result TextureVk::redefineLevel(const gl::Context *context,
+                 mImage->getLevelCount() == 1 && mImage->getFirstAllocatedLevel() == levelIndexGL;
+ 
+             // If incompatible, and redefining the single-level image, release it so it can be
+-            // recreated immediately.  This is an optimization to avoid an extra copy.
++            // recreated immediately.  This is needed so that the texture can be reallocated with
++            // the correct format/size.
+             if (!isCompatibleRedefinition && isUpdateToSingleLevelImage)
+             {
+                 releaseImage(contextVk);
+diff --git a/src/tests/angle_end2end_tests_expectations.txt b/src/tests/angle_end2end_tests_expectations.txt
+index f1343f8e8ad65b6fa292c630214c66aaf3ff5a64..e60ea8f9970d14a551128528d18e7be3bc08efcc 100644
+--- a/src/tests/angle_end2end_tests_expectations.txt
++++ b/src/tests/angle_end2end_tests_expectations.txt
+@@ -29,6 +29,8 @@
+ 6989 GLES : BlitFramebufferTestES31.OOBResolve/* = SKIP
+ 7881 VULKAN : MultithreadingTestES3.UnsynchronizedTextureReads/* = SKIP
+ 7881 VULKAN : MultithreadingTestES3.UnsynchronizedTextureReads2/* = SKIP
++// Incorrectly handled pretty much in all backends
++8446 : CopyTexImageTestES3.RedefineSameLevel/* = SKIP
+ 
+ 6743 OPENGL : SimpleStateChangeTestES3.RespecifyBufferAfterBeginTransformFeedback/* = SKIP
+ 6743 GLES : SimpleStateChangeTestES3.RespecifyBufferAfterBeginTransformFeedback/* = SKIP
+diff --git a/src/tests/gl_tests/CopyTexImageTest.cpp b/src/tests/gl_tests/CopyTexImageTest.cpp
+index 3d0cf40ab244a5463c2e4b3d53470d6f932e357b..d6949280ed301fc918e397dad26b9efec1c32f23 100644
+--- a/src/tests/gl_tests/CopyTexImageTest.cpp
++++ b/src/tests/gl_tests/CopyTexImageTest.cpp
+@@ -1262,6 +1262,56 @@ TEST_P(CopyTexImageTestES3, 3DSubImageDrawMismatchedTextureTypes)
+     glBindTexture(GL_TEXTURE_3D, 0);
+ }
+ 
++// Make sure a single-level texture can be redefined through glCopyTexImage2D from a framebuffer
++// bound to the same texture.  Regression test for a bug in the Vulkan backend where the texture was
++// released before the copy.
++TEST_P(CopyTexImageTestES3, RedefineSameLevel)
++{
++    constexpr GLsizei kSize     = 32;
++    constexpr GLsizei kHalfSize = kSize / 2;
++
++    // Create a single-level texture with four colors in different regions.
++    std::vector<GLColor> initData(kSize * kSize);
++    for (GLsizei y = 0; y < kSize; ++y)
++    {
++        const bool isTop = y < kHalfSize;
++        for (GLsizei x = 0; x < kSize; ++x)
++        {
++            const bool isLeft = x < kHalfSize;
++
++            GLColor color           = isLeft && isTop    ? GLColor::red
++                                      : isLeft && !isTop ? GLColor::green
++                                      : !isLeft && isTop ? GLColor::blue
++                                                         : GLColor::yellow;
++            color.A                 = 123;
++            initData[y * kSize + x] = color;
++        }
++    }
++
++    GLTexture tex;
++    glBindTexture(GL_TEXTURE_2D, tex);
++    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, kSize, kSize, 0, GL_RGBA, GL_UNSIGNED_BYTE,
++                 initData.data());
++
++    // Bind the framebuffer to the same texture
++    GLFramebuffer framebuffer;
++    glBindFramebuffer(GL_FRAMEBUFFER, framebuffer);
++    glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_TEXTURE_2D, tex, 0);
++
++    // Redefine the texture
++    glCopyTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, kHalfSize / 2, kHalfSize / 2, kHalfSize, kHalfSize,
++                     0);
++
++    // Verify copy is done correctly.
++    ASSERT_GL_FRAMEBUFFER_COMPLETE(GL_FRAMEBUFFER);
++
++    EXPECT_PIXEL_RECT_EQ(0, 0, kHalfSize / 2, kHalfSize / 2, GLColor::red);
++    EXPECT_PIXEL_RECT_EQ(kHalfSize / 2, 0, kHalfSize / 2, kHalfSize / 2, GLColor::blue);
++    EXPECT_PIXEL_RECT_EQ(0, kHalfSize / 2, kHalfSize / 2, kHalfSize / 2, GLColor::green);
++    EXPECT_PIXEL_RECT_EQ(kHalfSize / 2, kHalfSize / 2, kHalfSize / 2, kHalfSize / 2,
++                         GLColor::yellow);
++}
++
+ ANGLE_INSTANTIATE_TEST(CopyTexImageTest,
+                        ANGLE_ALL_TEST_PLATFORMS_ES2,
+                        ES2_D3D11_PRESENT_PATH_FAST(),

patches/chromium/.patches

@@ -132,3 +132,19 @@ fix_activate_background_material_on_windows.patch
 fix_move_autopipsettingshelper_behind_branding_buildflag.patch
 revert_remove_the_allowaggressivethrottlingwithwebsocket_feature.patch
 revert_same_party_cookie_attribute_removal.patch
+crash_gpu_process_and_clear_shader_cache_when_skia_reports.patch
+scale_rects_properly_in_syncgetfirstrectforrange.patch
+fix_restore_original_resize_performance_on_macos.patch
+feat_allow_code_cache_in_custom_schemes.patch
+fix_font_flooding_in_dev_tools.patch
+cherry-pick-5fde415e06f9.patch
+cherry-pick-8d607d3921b8.patch
+cherry-pick-998e947b265f.patch
+cherry-pick-021598ea43c1.patch
+cherry-pick-76340163a820.patch
+cherry-pick-f15cfb9371c4.patch
+cherry-pick-4ca62c7a8b88.patch
+cherry-pick-5b2fddadaa12.patch
+cherry-pick-50a1bddfca85.patch
+reland_mojom_ts_generator_handle_empty_module_path_identically_to.patch
+cherry-pick-c1cda70a433a.patch

patches/chromium/build_do_not_depend_on_packed_resource_integrity.patch

@@ -33,10 +33,10 @@ index 41ce32113ec2679b76d5a4fd69a7109c832ac7a1..1cd35794bf78f3d92b42634d9494c85a
            "//base",
            "//build:branding_buildflags",
 diff --git a/chrome/browser/BUILD.gn b/chrome/browser/BUILD.gn
-index 9ab6c039d18f8759b8d7db9742d3570a7734f893..ae347df7a1b1a48723160787f71cfd1340f430ef 100644
+index 31bf3d854d9a672e535f747fb8734d66ac0c37e9..cad2387217a73ec5a7533fc121ea7b77cd6995ae 100644
 --- a/chrome/browser/BUILD.gn
 +++ b/chrome/browser/BUILD.gn
-@@ -4725,7 +4725,7 @@ static_library("browser") {
+@@ -4726,7 +4726,7 @@ static_library("browser") {
  
      # On Windows, the hashes are embedded in //chrome:chrome_initial rather
      # than here in :chrome_dll.
@@ -46,7 +46,7 @@ index 9ab6c039d18f8759b8d7db9742d3570a7734f893..ae347df7a1b1a48723160787f71cfd13
        sources += [ "certificate_viewer_stub.cc" ]
      }
 diff --git a/chrome/test/BUILD.gn b/chrome/test/BUILD.gn
-index 8f9b476a538dd5a0e91edc725eed4463b4a92e05..be625ce71f271aa47444fff1dc8d861c6cf2f43a 100644
+index a315f817a8977d36e52b8f7c81d9e6778d3dcca2..dc046a004d6f4b2e9f1ec4b9423f293cfecaff8d 100644
 --- a/chrome/test/BUILD.gn
 +++ b/chrome/test/BUILD.gn
 @@ -6841,7 +6841,6 @@ test("unit_tests") {

patches/chromium/can_create_window.patch

@@ -9,10 +9,10 @@ potentially prevent a window from being created.
 TODO(loc): this patch is currently broken.
 
 diff --git a/content/browser/renderer_host/render_frame_host_impl.cc b/content/browser/renderer_host/render_frame_host_impl.cc
-index ad0d9cd11022f4f35e717efc088593df41d46496..40b63b1fbde84b8b3f854ce763474cd044f6ea96 100644
+index af16b1053e1f42887bf0fde97bba30a377857872..ef79bf0e27bd0c5eb9fe5f0aef1cf6c6a2900e13 100644
 --- a/content/browser/renderer_host/render_frame_host_impl.cc
 +++ b/content/browser/renderer_host/render_frame_host_impl.cc
-@@ -8206,6 +8206,7 @@ void RenderFrameHostImpl::CreateNewWindow(
+@@ -8224,6 +8224,7 @@ void RenderFrameHostImpl::CreateNewWindow(
            last_committed_origin_, params->window_container_type,
            params->target_url, params->referrer.To<Referrer>(),
            params->frame_name, params->disposition, *params->features,

patches/chromium/cherry-pick-021598ea43c1.patch

@@ -0,0 +1,69 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Guido Urdaneta <guidou@chromium.org>
+Date: Mon, 4 Dec 2023 23:00:41 +0000
+Subject: Drop frames received on the wrong task runner
+
+It can happen during transfer that a frame is posted from the
+background media thread to the task runner of the old execution
+context, which can lead to races and UAF.
+
+This CL makes underlying sources drop frames received on the
+wrong task runner to avoid the problem.
+
+(cherry picked from commit 9d042e0d498356185fe9eb33c53b69fab33d06bf)
+
+Bug: 1505708
+Change-Id: I686228d88cb1c48bdf8c0b6bf85edd280a54300a
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5077845
+Commit-Queue: Guido Urdaneta <guidou@chromium.org>
+Reviewed-by: Tony Herre <toprice@chromium.org>
+Cr-Original-Commit-Position: refs/heads/main@{#1231802}
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5082444
+Commit-Queue: Rubber Stamper <rubber-stamper@appspot.gserviceaccount.com>
+Bot-Commit: Rubber Stamper <rubber-stamper@appspot.gserviceaccount.com>
+Auto-Submit: Guido Urdaneta <guidou@chromium.org>
+Cr-Commit-Position: refs/branch-heads/6099@{#1370}
+Cr-Branched-From: e6ee4500f7d6549a9ac1354f8d056da49ef406be-refs/heads/main@{#1217362}
+
+diff --git a/third_party/blink/renderer/modules/peerconnection/rtc_encoded_audio_underlying_source.cc b/third_party/blink/renderer/modules/peerconnection/rtc_encoded_audio_underlying_source.cc
+index b5a2f71bae81bba6e61d8f303d24a9df874ae885..4c7b0b982e3d314749e39178eb0fca706d11bd85 100644
+--- a/third_party/blink/renderer/modules/peerconnection/rtc_encoded_audio_underlying_source.cc
++++ b/third_party/blink/renderer/modules/peerconnection/rtc_encoded_audio_underlying_source.cc
+@@ -58,7 +58,15 @@ void RTCEncodedAudioUnderlyingSource::Trace(Visitor* visitor) const {
+ 
+ void RTCEncodedAudioUnderlyingSource::OnFrameFromSource(
+     std::unique_ptr<webrtc::TransformableAudioFrameInterface> webrtc_frame) {
+-  DCHECK(task_runner_->BelongsToCurrentThread());
++  // It can happen that a frame is posted to the task runner of the old
++  // execution context during a stream transfer to a new context.
++  // TODO(https://crbug.com/1506631): Make the state updates related to the
++  // transfer atomic and turn this into a DCHECK.
++  if (!task_runner_->BelongsToCurrentThread()) {
++    DVLOG(1) << "Dropped frame posted to incorrect task runner. This can "
++                "happen during transfer.";
++    return;
++  }
+   // If the source is canceled or there are too many queued frames,
+   // drop the new frame.
+   if (!disconnect_callback_ || !GetExecutionContext()) {
+diff --git a/third_party/blink/renderer/modules/peerconnection/rtc_encoded_video_underlying_source.cc b/third_party/blink/renderer/modules/peerconnection/rtc_encoded_video_underlying_source.cc
+index 54ca7d1529b1772200c3691b56e847acc42d086d..8fb1d8460e289cd5e6764271f79dada7f121cb1b 100644
+--- a/third_party/blink/renderer/modules/peerconnection/rtc_encoded_video_underlying_source.cc
++++ b/third_party/blink/renderer/modules/peerconnection/rtc_encoded_video_underlying_source.cc
+@@ -58,7 +58,15 @@ void RTCEncodedVideoUnderlyingSource::Trace(Visitor* visitor) const {
+ 
+ void RTCEncodedVideoUnderlyingSource::OnFrameFromSource(
+     std::unique_ptr<webrtc::TransformableVideoFrameInterface> webrtc_frame) {
+-  DCHECK(task_runner_->BelongsToCurrentThread());
++  // It can happen that a frame is posted to the task runner of the old
++  // execution context during a stream transfer to a new context.
++  // TODO(https://crbug.com/1506631): Make the state updates related to the
++  // transfer atomic and turn this into a DCHECK.
++  if (!task_runner_->BelongsToCurrentThread()) {
++    DVLOG(1) << "Dropped frame posted to incorrect task runner. This can "
++                "happen during transfer.";
++    return;
++  }
+   // If the source is canceled or there are too many queued frames,
+   // drop the new frame.
+   if (!disconnect_callback_ || !GetExecutionContext()) {

patches/chromium/cherry-pick-4ca62c7a8b88.patch

@@ -0,0 +1,43 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Vasiliy Telezhnikov <vasilyt@chromium.org>
+Date: Thu, 7 Dec 2023 16:56:57 +0000
+Subject: Check for slugs count before deserializing Slugs in DrawSlugOp
+
+Count is part of serialized data and while we never serialize values
+less then 1, it can be any value when coming over IPC, we should check
+that it's positive before substacting one.
+
+(cherry picked from commit 0527e0d5b08a13d63f4f1eeefa1b86ecfd0cb63b)
+
+Bug: 1506726
+Change-Id: I244f50a682f2e852b22ba88f1e9cddddb0fdfcb9
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5078779
+Reviewed-by: Peng Huang <penghuang@chromium.org>
+Commit-Queue: Vasiliy Telezhnikov <vasilyt@chromium.org>
+Cr-Original-Commit-Position: refs/heads/main@{#1232013}
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5096809
+Bot-Commit: Rubber Stamper <rubber-stamper@appspot.gserviceaccount.com>
+Cr-Commit-Position: refs/branch-heads/6099@{#1428}
+Cr-Branched-From: e6ee4500f7d6549a9ac1354f8d056da49ef406be-refs/heads/main@{#1217362}
+
+diff --git a/cc/paint/paint_op.cc b/cc/paint/paint_op.cc
+index bd39210efa9a4da6f3888dd25ef465a1d0a4cc70..4c88eaa1e57ddae2c7fb0ba94d66b843ab8f63f2 100644
+--- a/cc/paint/paint_op.cc
++++ b/cc/paint/paint_op.cc
+@@ -976,10 +976,12 @@ PaintOp* DrawSlugOp::Deserialize(PaintOpReader& reader, void* output) {
+   reader.Read(&op->flags);
+   unsigned int count = 0;
+   reader.Read(&count);
+-  reader.Read(&op->slug);
+-  op->extra_slugs.resize(count - 1);
+-  for (auto& extra_slug : op->extra_slugs) {
+-    reader.Read(&extra_slug);
++  if (count > 0) {
++    reader.Read(&op->slug);
++    op->extra_slugs.resize(count - 1);
++    for (auto& extra_slug : op->extra_slugs) {
++      reader.Read(&extra_slug);
++    }
+   }
+   return op;
+ }

patches/chromium/cherry-pick-50a1bddfca85.patch

@@ -0,0 +1,117 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Austin Eng <enga@chromium.org>
+Date: Tue, 19 Dec 2023 17:25:51 +0000
+Subject: Use cross thread handles to bind args for async webgpu context
+ creation
+
+(cherry picked from commit 542b278a0c1de7202f4bf5e3e5cbdc2dd6c337d4)
+
+Fixed: 1506923
+Change-Id: I174703cbd993471e3afb39c0cfa4cce2770755f7
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5113019
+Reviewed-by: Corentin Wallez <cwallez@chromium.org>
+Commit-Queue: Austin Eng <enga@chromium.org>
+Reviewed-by: Stephen White <senorblanco@chromium.org>
+Cr-Original-Commit-Position: refs/heads/main@{#1237179}
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5133239
+Cr-Commit-Position: refs/branch-heads/6099@{#1551}
+Cr-Branched-From: e6ee4500f7d6549a9ac1354f8d056da49ef406be-refs/heads/main@{#1217362}
+
+diff --git a/third_party/blink/renderer/modules/webgpu/gpu.cc b/third_party/blink/renderer/modules/webgpu/gpu.cc
+index f2f4e8be0cc73f5b569fd3345bd3b64f4539041d..5752c80fbbfc91d492f497c87f181d3211c71d86 100644
+--- a/third_party/blink/renderer/modules/webgpu/gpu.cc
++++ b/third_party/blink/renderer/modules/webgpu/gpu.cc
+@@ -39,11 +39,13 @@
+ #include "third_party/blink/renderer/platform/graphics/gpu/dawn_control_client_holder.h"
+ #include "third_party/blink/renderer/platform/graphics/gpu/webgpu_callback.h"
+ #include "third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.h"
++#include "third_party/blink/renderer/platform/heap/cross_thread_handle.h"
+ #include "third_party/blink/renderer/platform/heap/garbage_collected.h"
+ #include "third_party/blink/renderer/platform/heap/thread_state.h"
+ #include "third_party/blink/renderer/platform/instrumentation/use_counter.h"
+ #include "third_party/blink/renderer/platform/privacy_budget/identifiability_digest_helpers.h"
+ #include "third_party/blink/renderer/platform/weborigin/kurl.h"
++#include "third_party/blink/renderer/platform/wtf/cross_thread_functional.h"
+ 
+ namespace blink {
+ 
+@@ -300,9 +302,19 @@ void GPU::RequestAdapterImpl(ScriptState* script_state,
+     CreateWebGPUGraphicsContext3DProviderAsync(
+         execution_context->Url(),
+         execution_context->GetTaskRunner(TaskType::kWebGPU),
+-        WTF::BindOnce(
+-            [](GPU* gpu, ExecutionContext* execution_context,
++        CrossThreadBindOnce(
++            [](CrossThreadHandle<GPU> gpu_handle,
++               CrossThreadHandle<ExecutionContext> execution_context_handle,
+                std::unique_ptr<WebGraphicsContext3DProvider> context_provider) {
++              auto unwrap_gpu = MakeUnwrappingCrossThreadHandle(gpu_handle);
++              auto unwrap_execution_context =
++                  MakeUnwrappingCrossThreadHandle(execution_context_handle);
++              if (!unwrap_gpu || !unwrap_execution_context) {
++                return;
++              }
++              auto* gpu = unwrap_gpu.GetOnCreationThread();
++              auto* execution_context =
++                  unwrap_execution_context.GetOnCreationThread();
+               const KURL& url = execution_context->Url();
+               context_provider =
+                   CheckContextProvider(url, std::move(context_provider));
+@@ -324,7 +336,8 @@ void GPU::RequestAdapterImpl(ScriptState* script_state,
+                 std::move(callback).Run();
+               }
+             },
+-            WrapPersistent(this), WrapPersistent(execution_context)));
++            MakeCrossThreadHandle(this),
++            MakeCrossThreadHandle(execution_context)));
+     return;
+   }
+ 
+diff --git a/third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.cc b/third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.cc
+index f859f3e62c54d26453a145321f697c5116c13348..3d9890b9b4a58a30a11e501fdb9297f4a57b601b 100644
+--- a/third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.cc
++++ b/third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.cc
+@@ -121,8 +121,8 @@ CreateWebGPUGraphicsContext3DProvider(const KURL& url) {
+ void CreateWebGPUGraphicsContext3DProviderAsync(
+     const KURL& url,
+     scoped_refptr<base::SingleThreadTaskRunner> current_thread_task_runner,
+-    base::OnceCallback<void(std::unique_ptr<WebGraphicsContext3DProvider>)>
+-        callback) {
++    WTF::CrossThreadOnceFunction<
++        void(std::unique_ptr<WebGraphicsContext3DProvider>)> callback) {
+   if (IsMainThread()) {
+     std::move(callback).Run(
+         Platform::Current()->CreateWebGPUGraphicsContext3DProvider(url));
+@@ -140,8 +140,7 @@ void CreateWebGPUGraphicsContext3DProviderAsync(
+             AccessMainThreadForWebGraphicsContext3DProvider()),
+         FROM_HERE,
+         CrossThreadBindOnce(&CreateWebGPUGraphicsContextOnMainThreadAsync, url,
+-                            current_thread_task_runner,
+-                            CrossThreadBindOnce(std::move(callback))));
++                            current_thread_task_runner, std::move(callback)));
+   }
+ }
+ 
+diff --git a/third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.h b/third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.h
+index 8fcab24bfec2c9b2e9edf9885b66de4f99949b35..8b785cc30acdfffed0f59eb53b073d0cdedc2151 100644
+--- a/third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.h
++++ b/third_party/blink/renderer/platform/graphics/web_graphics_context_3d_provider_util.h
+@@ -10,6 +10,7 @@
+ #include "third_party/blink/public/platform/web_graphics_context_3d_provider.h"
+ #include "third_party/blink/renderer/platform/platform_export.h"
+ #include "third_party/blink/renderer/platform/weborigin/kurl.h"
++#include "third_party/blink/renderer/platform/wtf/functional.h"
+ 
+ namespace blink {
+ 
+@@ -42,8 +43,8 @@ CreateWebGPUGraphicsContext3DProvider(const KURL& url);
+ PLATFORM_EXPORT void CreateWebGPUGraphicsContext3DProviderAsync(
+     const KURL& url,
+     scoped_refptr<base::SingleThreadTaskRunner> current_thread_task_runner,
+-    base::OnceCallback<void(std::unique_ptr<WebGraphicsContext3DProvider>)>
+-        callback);
++    WTF::CrossThreadOnceFunction<
++        void(std::unique_ptr<WebGraphicsContext3DProvider>)> callback);
+ 
+ }  // namespace blink
+ 

patches/chromium/cherry-pick-5b2fddadaa12.patch

@@ -0,0 +1,61 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Hongchan Choi <hongchan@chromium.org>
+Date: Tue, 12 Dec 2023 02:34:29 +0000
+Subject: Clamp the input value correctly before scheduling an AudioParam event
+
+When the AudioParam value is set via the setter, it internally calls
+the setValueAtTime() function to schedule the change. However, the
+current code does not correctly clamp the value within the nominal
+range. This CL fixes the problem.
+
+(cherry picked from commit c97b506c1e32951dd39e11e453e1ecc29cc0b35c)
+
+Bug: 1505086
+Test: Locally confirmed with both negative and positive param values.
+Change-Id: Ibb0aae168161af9ea95c5e11a929b3aa2c621c73
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5100625
+Reviewed-by: Michael Wilson <mjwilson@chromium.org>
+Commit-Queue: Hongchan Choi <hongchan@chromium.org>
+Cr-Original-Commit-Position: refs/heads/main@{#1235028}
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5112838
+Commit-Queue: Rubber Stamper <rubber-stamper@appspot.gserviceaccount.com>
+Bot-Commit: Rubber Stamper <rubber-stamper@appspot.gserviceaccount.com>
+Auto-Submit: Hongchan Choi <hongchan@chromium.org>
+Cr-Commit-Position: refs/branch-heads/6099@{#1497}
+Cr-Branched-From: e6ee4500f7d6549a9ac1354f8d056da49ef406be-refs/heads/main@{#1217362}
+
+diff --git a/third_party/blink/renderer/modules/webaudio/audio_param.cc b/third_party/blink/renderer/modules/webaudio/audio_param.cc
+index 8c7b9d07bb68ec51d21ea2132cc5ecbc39e5cd95..95a40d39c9214fd6555523bd7e7bd91e36d2c6c0 100644
+--- a/third_party/blink/renderer/modules/webaudio/audio_param.cc
++++ b/third_party/blink/renderer/modules/webaudio/audio_param.cc
+@@ -120,12 +120,15 @@ void AudioParam::setValue(float value) {
+ void AudioParam::setValue(float value, ExceptionState& exception_state) {
+   WarnIfOutsideRange("value", value);
+ 
+-  // This is to signal any errors, if necessary, about conflicting
+-  // automations.
+-  setValueAtTime(value, Context()->currentTime(), exception_state);
+-  // This is to change the value so that an immediate query for the
+-  // value returns the expected values.
++  // Change the intrinsic value so that an immediate query for the value
++  // returns the value that the user code provided. It also clamps the value
++  // to the nominal range.
+   Handler().SetValue(value);
++
++  // Use the intrinsic value (after clamping) to schedule the actual
++  // automation event.
++  setValueAtTime(Handler().IntrinsicValue(), Context()->currentTime(),
++                 exception_state);
+ }
+ 
+ float AudioParam::defaultValue() const {
+diff --git a/third_party/blink/web_tests/webaudio/AudioParam/worklet-warnings-expected.txt b/third_party/blink/web_tests/webaudio/AudioParam/worklet-warnings-expected.txt
+index 7bb2d0aec7feaed69424f209a2e3e031c7a9e512..ebe05a2c239d35be4729cc187aa77de6a44f5a41 100644
+--- a/third_party/blink/web_tests/webaudio/AudioParam/worklet-warnings-expected.txt
++++ b/third_party/blink/web_tests/webaudio/AudioParam/worklet-warnings-expected.txt
+@@ -1,5 +1,4 @@
+ CONSOLE WARNING: AudioWorkletNode("noise-generator").amplitude.value 99 outside nominal range [0, 1]; value will be clamped.
+-CONSOLE WARNING: AudioWorkletNode("noise-generator").amplitude.setValueAtTime value 99 outside nominal range [0, 1]; value will be clamped.
+ CONSOLE WARNING: AudioWorkletNode("noise-generator").amplitude.setValueAtTime value -1 outside nominal range [0, 1]; value will be clamped.
+ CONSOLE WARNING: AudioWorkletNode("noise-generator").amplitude.linearRampToValueAtTime value 5 outside nominal range [0, 1]; value will be clamped.
+ This is a testharness.js-based test.

patches/chromium/cherry-pick-5fde415e06f9.patch

@@ -0,0 +1,73 @@
+From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
+From: Guido Urdaneta <guidou@chromium.org>
+Date: Fri, 10 Nov 2023 20:46:57 +0000
+Subject: Use KeepAlive to prevent lifetime race with audio delivery
+
+(cherry picked from commit 186dad16ae69183f02730fb26d84e1d53f9f1b04)
+
+Bug: 1497984
+Change-Id: Ic22729b2ef9690203bbb09555d32238959e93a0f
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5009864
+Reviewed-by: Michael Lippautz <mlippautz@chromium.org>
+Commit-Queue: Guido Urdaneta <guidou@chromium.org>
+Cr-Original-Commit-Position: refs/heads/main@{#1221614}
+Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5018212
+Bot-Commit: Rubber Stamper <rubber-stamper@appspot.gserviceaccount.com>
+Cr-Commit-Position: refs/branch-heads/6099@{#500}
+Cr-Branched-From: e6ee4500f7d6549a9ac1354f8d056da49ef406be-refs/heads/main@{#1217362}
+
+diff --git a/third_party/blink/renderer/modules/breakout_box/media_stream_audio_track_underlying_source.cc b/third_party/blink/renderer/modules/breakout_box/media_stream_audio_track_underlying_source.cc
+index f68c265271b48f92ff67a752cf2bedac183bd2fc..a53053b12925b6aaa4fb201e7de2c00d4203bb2a 100644
+--- a/third_party/blink/renderer/modules/breakout_box/media_stream_audio_track_underlying_source.cc
++++ b/third_party/blink/renderer/modules/breakout_box/media_stream_audio_track_underlying_source.cc
+@@ -142,12 +142,12 @@ bool MediaStreamAudioTrackUnderlyingSource::StartFrameDelivery() {
+     return false;
+   }
+ 
+-  if (added_to_track_) {
++  if (is_connected_to_track_) {
+     return true;
+   }
+ 
+   WebMediaStreamAudioSink::AddToAudioTrack(this, WebMediaStreamTrack(track_));
+-  added_to_track_ = true;
++  is_connected_to_track_ = this;
+   return true;
+ }
+ 
+@@ -159,7 +159,7 @@ void MediaStreamAudioTrackUnderlyingSource::DisconnectFromTrack() {
+ 
+   WebMediaStreamAudioSink::RemoveFromAudioTrack(this,
+                                                 WebMediaStreamTrack(track_));
+-  added_to_track_ = false;
++  is_connected_to_track_.Clear();
+   track_.Clear();
+ }
+ 
+diff --git a/third_party/blink/renderer/modules/breakout_box/media_stream_audio_track_underlying_source.h b/third_party/blink/renderer/modules/breakout_box/media_stream_audio_track_underlying_source.h
+index 334da29c2b210f92e9ee191275651406487601c3..4e7d22959dc8947c12d9ee2bb7acd814cc4db6b3 100644
+--- a/third_party/blink/renderer/modules/breakout_box/media_stream_audio_track_underlying_source.h
++++ b/third_party/blink/renderer/modules/breakout_box/media_stream_audio_track_underlying_source.h
+@@ -13,6 +13,7 @@
+ #include "third_party/blink/renderer/modules/breakout_box/transferred_frame_queue_underlying_source.h"
+ #include "third_party/blink/renderer/modules/modules_export.h"
+ #include "third_party/blink/renderer/platform/heap/prefinalizer.h"
++#include "third_party/blink/renderer/platform/heap/self_keep_alive.h"
+ 
+ namespace blink {
+ 
+@@ -80,10 +81,13 @@ class MODULES_EXPORT MediaStreamAudioTrackUnderlyingSource
+   const Member<ScriptWrappable> media_stream_track_processor_;
+ 
+   Member<MediaStreamComponent> track_;
+-  bool added_to_track_ = false;
+ 
+   std::unique_ptr<AudioBufferPool> buffer_pool_;
+ 
++  // This prevents collection of this object while it is still connected to a
++  // platform MediaStreamTrack.
++  SelfKeepAlive<MediaStreamAudioTrackUnderlyingSource> is_connected_to_track_;
++
+   SEQUENCE_CHECKER(sequence_checker_);
+ };
+