Compare commits

..

1 Commits

Author SHA1 Message Date
Keeley Hammond
8a89ff06c9 fix: revert SameParty cookie attribute removal 2023-09-21 16:25:46 -07:00
639 changed files with 10030 additions and 12519 deletions

View File

@@ -68,8 +68,8 @@ executors:
version:
description: "xcode version"
type: enum
enum: ["15.0.0", "14.0.0"]
default: 15.0.0
enum: ["14.3.0", "14.0.0"]
default: 14.3.0
macos:
xcode: << parameters.version >>
resource_class: << parameters.size >>
@@ -660,7 +660,6 @@ 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
@@ -755,8 +754,8 @@ step-show-goma-stats: &step-show-goma-stats
command: |
set +e
set +o pipefail
python3 $GOMA_DIR/goma_ctl.py stat
python3 $GOMA_DIR/diagnose_goma_log.py
$GOMA_DIR/goma_ctl.py stat
$GOMA_DIR/diagnose_goma_log.py
true
when: always
background: true
@@ -776,7 +775,6 @@ step-mksnapshot-build: &step-mksnapshot-build
fi
sed $SEDOPTION '/.*builtins-pgo/d' out/Default/mksnapshot_args
sed $SEDOPTION '/--turbo-profiling-input/d' out/Default/mksnapshot_args
sed $SEDOPTION '/The gn arg use_goma=true .*/d' out/Default/mksnapshot_args
if [ "`uname`" != "Darwin" ]; then
if [ "$TARGET_ARCH" == "arm" ]; then
electron/script/strip-binaries.py --file $PWD/out/Default/clang_x86_v8_arm/mksnapshot
@@ -1211,7 +1209,7 @@ commands:
build-type: << parameters.build-type >>
- *step-maybe-electron-dist-strip
- step-electron-dist-build:
additional-targets: electron:node_headers third_party/electron_node:overlapped-checker electron:hunspell_dictionaries_zip
additional-targets: shell_browser_ui_unittests electron:node_headers third_party/electron_node:overlapped-checker electron:hunspell_dictionaries_zip
- *step-show-goma-stats
@@ -2165,7 +2163,7 @@ jobs:
<<: *env-ninja-status
<<: *env-macos-build
<<: *env-apple-silicon
GCLIENT_EXTRA_ARGS: '--custom-var=checkout_mac=True --custom-var=host_os=mac --custom-var=host_cpu=arm64'
GCLIENT_EXTRA_ARGS: '--custom-var=checkout_mac=True --custom-var=host_os=mac'
steps:
- electron-build:
persist: true

View File

@@ -2,6 +2,7 @@ name: Bug Report
description: Report an Electron bug
title: "[Bug]: "
labels: "bug :beetle:"
projects: ["electron/90"]
body:
- type: checkboxes
attributes:

View File

@@ -60,50 +60,106 @@ jobs:
done
- name: Generate GitHub App token
if: ${{ steps.check-major-version.outputs.MAJOR }}
uses: electron/github-app-auth-action@384fd19694fe7b6dcc9a684746c6976ad78228ae # v1.1.1
uses: electron/github-app-auth-action@cc6751b3b5e4edc5b9a4ad0a021ac455653b6dc8 # v1.0.0
id: generate-token
with:
creds: ${{ secrets.RELEASE_BOARD_GH_APP_CREDS }}
org: electron
- name: Generate Release Project Board Metadata
if: ${{ steps.check-major-version.outputs.MAJOR }}
uses: actions/github-script@d7906e4ad0b1822421a7e6a35d5ca353c962f410 # v6.4.1
id: generate-project-metadata
with:
script: |
const major = ${{ steps.check-major-version.outputs.MAJOR }}
const nextMajor = major + 1
const prevMajor = major - 1
core.setOutput("major", major)
core.setOutput("next-major", nextMajor)
core.setOutput("prev-major", prevMajor)
core.setOutput("prev-prev-major", prevMajor - 1)
core.setOutput("template-view", JSON.stringify({
major,
"next-major": nextMajor,
"prev-major": prevMajor,
}))
- name: Create Release Project Board
if: ${{ steps.check-major-version.outputs.MAJOR }}
uses: dsanders11/project-actions/copy-project@3a81985616963f32fae17d1d1b406c631f3201a1 # v1.1.0
with:
drafts: true
project-number: 64
# TODO - Set to public once GitHub fixes their GraphQL bug
# public: true
link-to-repository: electron/electron
template-view: ${{ steps.generate-project-metadata.outputs.template-view }}
title: ${{ steps.generate-project-metadata.outputs.major }}-x-y
token: ${{ steps.generate-token.outputs.token }}
- name: Find Previous Release Project Board
if: ${{ steps.check-major-version.outputs.MAJOR }}
uses: dsanders11/project-actions/find-project@3a81985616963f32fae17d1d1b406c631f3201a1 # v1.1.0
id: find-prev-release-board
with:
title: ${{ steps.generate-project-metadata.outputs.prev-prev-major }}-x-y
- name: Close Previous Release Project Board
if: ${{ steps.check-major-version.outputs.MAJOR }}
uses: dsanders11/project-actions/close-project@3a81985616963f32fae17d1d1b406c631f3201a1 # v1.1.0
with:
project-number: ${{ steps.find-prev-release-board.outputs.number }}
env:
GITHUB_TOKEN: ${{ steps.generate-token.outputs.token }}
MAJOR: ${{ steps.check-major-version.outputs.MAJOR }}
ELECTRON_ORG_ID: "O_kgDOAMybxg"
ELECTRON_REPO_ID: "R_kgDOAI8xSw"
TEMPLATE_PROJECT_ID: "PVT_kwDOAMybxs4AQvib"
run: |
# Copy template to create new project board
PROJECT_ID=$(gh api graphql -f query='mutation ($ownerId: ID!, $projectId: ID!, $title: String!) {
copyProjectV2(input: {
includeDraftIssues: true,
ownerId: $ownerId,
projectId: $projectId,
title: $title
}) {
projectV2 {
id
}
}
}' -f ownerId=$ELECTRON_ORG_ID -f projectId=$TEMPLATE_PROJECT_ID -f title="${MAJOR}-x-y" | jq -r '.data.copyProjectV2.projectV2.id')
# Make the new project public
gh api graphql -f query='mutation ($projectId: ID!) {
updateProjectV2(input: {
projectId: $projectId,
public: true,
}) {
projectV2 {
id
}
}
}' -f projectId=$PROJECT_ID
# Link the new project to the Electron repository
gh api graphql -f query='mutation ($projectId: ID!, $repositoryId: ID!) {
linkProjectV2ToRepository(input: {
projectId: $projectId,
repositoryId: $repositoryId
}) {
clientMutationId
}
}' -f projectId=$PROJECT_ID -f repositoryId=$ELECTRON_REPO_ID
# Get all draft issues on the new project board
gh api graphql -f query='query ($id: ID!) {
node(id: $id) {
... on ProjectV2 {
items(first: 100) {
nodes {
... on ProjectV2Item {
id
content {
... on DraftIssue { id title
body
}
}
}
}
}
}
}
}' -f id=$PROJECT_ID > issues.json
PROJECT_ITEMS=$(jq '.data.node.items.nodes[] | select(.content.id != null) | .id' issues.json)
#
# Do template replacement for draft issues
#
echo "{\"major\": $MAJOR, \"next-major\": $((MAJOR + 1)), \"prev-major\": $((MAJOR - 1))}" > variables.json
# npx mustache is annoyingly slow, so install mustache directly
yarn add -D mustache
for PROJECT_ITEM_ID in $PROJECT_ITEMS; do
# These are done with the raw output flag and sent to file to better retain formatting
jq -r ".data.node.items.nodes[] | select(.id == $PROJECT_ITEM_ID) | .content.title" issues.json > title.txt
jq -r ".data.node.items.nodes[] | select(.id == $PROJECT_ITEM_ID) | .content.body" issues.json > body.txt
./node_modules/.bin/mustache variables.json title.txt new_title.txt
./node_modules/.bin/mustache variables.json body.txt new_body.txt
# Only update draft issues which had content change when interpolated
if ! cmp --silent -- new_title.txt title.txt || ! cmp --silent -- new_body.txt body.txt; then
DRAFT_ISSUE_ID=$(jq ".data.node.items.nodes[] | select(.id == $PROJECT_ITEM_ID) | .content.id" issues.json)
gh api graphql -f query='mutation ($draftIssueId: ID!, $title: String!, $body: String!) {
updateProjectV2DraftIssue(input: {
draftIssueId: $draftIssueId,
title: $title,
body: $body
}) {
draftIssue {
id
}
}
}' -f draftIssueId=$DRAFT_ISSUE_ID -f title="$(cat new_title.txt)" -f body="$(cat new_body.txt)"
fi
done

View File

@@ -20,12 +20,14 @@ jobs:
creds: ${{ secrets.ISSUE_TRIAGE_GH_APP_CREDS }}
org: electron
- name: Set status
uses: dsanders11/project-actions/edit-item@a24415515fa60a22f71f9d9d00e36ca82660cde9 # v1.0.1
uses: github/update-project-action@2d475e08804f11f4022df7e21f5816531e97cb64 # v2
with:
token: ${{ steps.generate-token.outputs.token }}
project-number: 90
github_token: ${{ steps.generate-token.outputs.token }}
organization: electron
project_number: 90
content_id: ${{ github.event.issue.node_id }}
field: Status
field-value: 🛑 Blocked
value: 🛑 Blocked
issue-labeled-blocked-need-repro:
name: blocked/need-repro label added
if: github.event.label.name == 'blocked/need-repro'

View File

@@ -1,27 +0,0 @@
name: Issue Opened
on:
issues:
types:
- opened
permissions: {}
jobs:
add-to-issue-triage:
if: ${{ contains(github.event.issue.labels.*.name, 'bug :beetle:') }}
runs-on: ubuntu-latest
steps:
- name: Generate GitHub App token
uses: electron/github-app-auth-action@384fd19694fe7b6dcc9a684746c6976ad78228ae # v1.1.1
id: generate-token
with:
creds: ${{ secrets.ISSUE_TRIAGE_GH_APP_CREDS }}
org: electron
- name: Add to Issue Triage
uses: dsanders11/project-actions/add-item@a24415515fa60a22f71f9d9d00e36ca82660cde9 # v1.0.1
with:
field: Reporter
field-value: ${{ github.event.issue.user.login }}
project-number: 90
token: ${{ steps.generate-token.outputs.token }}

View File

@@ -30,9 +30,11 @@ jobs:
org: electron
- name: Set status
if: ${{ steps.check-for-blocked-labels.outputs.NOT_BLOCKED }}
uses: dsanders11/project-actions/edit-item@a24415515fa60a22f71f9d9d00e36ca82660cde9 # v1.0.1
uses: github/update-project-action@2d475e08804f11f4022df7e21f5816531e97cb64 # v2
with:
token: ${{ steps.generate-token.outputs.token }}
project-number: 90
github_token: ${{ steps.generate-token.outputs.token }}
organization: electron
project_number: 90
content_id: ${{ github.event.issue.node_id }}
field: Status
field-value: 📥 Was Blocked
value: 📥 Was Blocked

View File

@@ -1,26 +1,13 @@
name: Pull Request Labeled
on:
pull_request_target:
pull_request:
types: [labeled]
permissions: {}
permissions:
contents: read
jobs:
pull-request-labeled-backport-requested:
name: backport/requested label added
if: github.event.label.name == 'backport/requested 🗳'
runs-on: ubuntu-latest
steps:
- name: Trigger Slack workflow
uses: slackapi/slack-github-action@e28cf165c92ffef168d23c5c9000cffc8a25e117 # v1.24.0
with:
payload: |
{
"url": "${{ github.event.pull_request.html_url }}"
}
env:
SLACK_WEBHOOK_URL: ${{ secrets.BACKPORT_REQUESTED_SLACK_WEBHOOK_URL }}
pull-request-labeled-deprecation-review-complete:
name: deprecation-review/complete label added
if: github.event.label.name == 'deprecation-review/complete ✅'
@@ -33,9 +20,11 @@ jobs:
creds: ${{ secrets.RELEASE_BOARD_GH_APP_CREDS }}
org: electron
- name: Set status
uses: dsanders11/project-actions/edit-item@a24415515fa60a22f71f9d9d00e36ca82660cde9 # v1.0.1
uses: dsanders11/update-project-action@7ade91760df70df76770a238abee7a4869e01cf8
with:
token: ${{ steps.generate-token.outputs.token }}
project-number: 94
github_token: ${{ steps.generate-token.outputs.token }}
organization: electron
project_number: 94
content_id: ${{ github.event.pull_request.node_id }}
field: Status
field-value: ✅ Reviewed
value: ✅ Reviewed

View File

@@ -1,35 +0,0 @@
name: Check Stable Prep Items
on:
schedule:
- cron: '0 */12 * * *'
workflow_dispatch:
permissions: {}
jobs:
check-stable-prep-items:
name: Check Stable Prep Items
runs-on: ubuntu-latest
steps:
- name: Generate GitHub App token
uses: electron/github-app-auth-action@384fd19694fe7b6dcc9a684746c6976ad78228ae # v1.1.1
id: generate-token
with:
creds: ${{ secrets.RELEASE_BOARD_GH_APP_CREDS }}
org: electron
- name: Find Newest Release Project Board
id: find-project-number
env:
GITHUB_TOKEN: ${{ steps.generate-token.outputs.token }}
run: |
set -eo pipefail
PROJECT_NUMBER=$(gh project list --owner electron --format json | jq -r '.projects | map(select(.title | test("^[0-9]+-x-y$"))) | max_by(.number) | .number')
echo "PROJECT_NUMBER=$PROJECT_NUMBER" >> "$GITHUB_OUTPUT"
- name: Update Completed Stable Prep Items
uses: dsanders11/project-actions/completed-by@a24415515fa60a22f71f9d9d00e36ca82660cde9 # v1.0.1
with:
field: Prep Status
field-value: ✅ Complete
project-number: ${{ steps.find-project-number.outputs.PROJECT_NUMBER }}
token: ${{ steps.generate-token.outputs.token }}

View File

@@ -29,7 +29,6 @@ import("filenames.gni")
import("filenames.hunspell.gni")
import("filenames.libcxx.gni")
import("filenames.libcxxabi.gni")
import("js2c_toolchain.gni")
if (is_mac) {
import("//build/config/mac/rules.gni")
@@ -105,26 +104,14 @@ 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
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",
])
}
electron_version = exec_script("script/print-version.py",
[],
"trim string",
[
".git/packed-refs",
".git/HEAD",
"script/lib/get-version.js",
])
if (is_mas_build) {
assert(is_mac,
@@ -238,7 +225,6 @@ action("electron_js2c") {
":electron_sandboxed_renderer_bundle",
":electron_utility_bundle",
":electron_worker_bundle",
"//third_party/electron_node:node_js2c($electron_js2c_toolchain)",
]
sources = [
@@ -251,17 +237,13 @@ action("electron_js2c") {
"$target_gen_dir/js2c/worker_init.js",
]
inputs = sources
inputs = sources + [ "//third_party/electron_node/tools/js2c.py" ]
outputs = [ "$root_gen_dir/electron_natives.cc" ]
script = "build/js2c.py"
out_dir =
get_label_info(":anything($electron_js2c_toolchain)", "root_out_dir")
args = [
rebase_path("$out_dir/node_js2c"),
rebase_path("$root_gen_dir"),
] + rebase_path(outputs, root_gen_dir) +
rebase_path(sources, root_gen_dir)
args = [ rebase_path("//third_party/electron_node") ] +
rebase_path(outputs, root_build_dir) +
rebase_path(sources, root_build_dir)
}
action("generate_config_gypi") {
@@ -440,7 +422,6 @@ source_set("electron_lib") {
"//chrome/app/resources:platform_locale_settings",
"//components/autofill/core/common:features",
"//components/certificate_transparency",
"//components/compose:buildflags",
"//components/embedder_support:browser_util",
"//components/language/core/browser",
"//components/net_log",
@@ -449,8 +430,6 @@ source_set("electron_lib") {
"//components/network_hints/renderer",
"//components/network_session_configurator/common",
"//components/omnibox/browser:buildflags",
"//components/os_crypt/async/browser",
"//components/os_crypt/async/browser:key_provider_interface",
"//components/os_crypt/sync",
"//components/pref_registry",
"//components/prefs",
@@ -722,7 +701,6 @@ source_set("electron_lib") {
"shell/common/extensions/api",
"shell/common/extensions/api:extensions_features",
"//chrome/browser/resources:component_extension_resources",
"//components/guest_view/common:mojom",
"//components/update_client:update_client",
"//components/zoom",
"//extensions/browser",
@@ -926,7 +904,10 @@ if (is_mac) {
assert(defined(invoker.helper_name_suffix))
output_name = electron_helper_name + invoker.helper_name_suffix
deps = [ ":electron_framework+link" ]
deps = [
":electron_framework+link",
"//base/allocator:early_zone_registration_apple",
]
if (!is_mas_build) {
deps += [ "//sandbox/mac:seatbelt" ]
}
@@ -1087,6 +1068,7 @@ if (is_mac) {
":electron_app_plist",
":electron_app_resources",
":electron_fuses",
"//base/allocator:early_zone_registration_apple",
"//electron/buildflags",
]
if (is_mas_build) {
@@ -1338,6 +1320,25 @@ if (is_mac) {
}
}
test("shell_browser_ui_unittests") {
sources = [
"//electron/shell/browser/ui/accelerator_util_unittests.cc",
"//electron/shell/browser/ui/run_all_unittests.cc",
]
configs += [ ":electron_lib_config" ]
deps = [
":electron_lib",
"//base",
"//base/test:test_support",
"//testing/gmock",
"//testing/gtest",
"//ui/base",
"//ui/strings",
]
}
template("dist_zip") {
_runtime_deps_target = "${target_name}__deps"
_runtime_deps_file =

4
DEPS
View File

@@ -2,9 +2,9 @@ gclient_gn_args_from = 'src'
vars = {
'chromium_version':
'121.0.6147.0',
'119.0.6019.2',
'node_version':
'v20.9.0',
'v18.18.0',
'nan_version':
'e14bdcd1f72d62bca1d541b66da43130384ec213',
'squirrel.mac_version':

View File

@@ -9,8 +9,8 @@ View these docs in other languages on our [Crowdin](https://crowdin.com/project/
The Electron framework lets you write cross-platform desktop applications
using JavaScript, HTML and CSS. It is based on [Node.js](https://nodejs.org/) and
[Chromium](https://www.chromium.org) and is used by the [Visual Studio
Code](https://github.com/Microsoft/vscode/) and many other [apps](https://electronjs.org/apps).
[Chromium](https://www.chromium.org) and is used by the [Atom
editor](https://github.com/atom/atom) and many other [apps](https://electronjs.org/apps).
Follow [@electronjs](https://twitter.com/electronjs) on Twitter for important
announcements.
@@ -41,9 +41,9 @@ Each Electron release provides binaries for macOS, Windows, and Linux.
* macOS (Catalina and up): Electron provides 64-bit Intel and ARM binaries for macOS. Apple Silicon support was added in Electron 11.
* Windows (Windows 10 and up): Electron provides `ia32` (`x86`), `x64` (`amd64`), and `arm64` binaries for Windows. Windows on ARM support was added in Electron 5.0.8. Support for Windows 7, 8 and 8.1 was [removed in Electron 23, in line with Chromium's Windows deprecation policy](https://www.electronjs.org/blog/windows-7-to-8-1-deprecation-notice).
* Linux: The prebuilt binaries of Electron are built on Ubuntu 20.04. They have also been verified to work on:
* Ubuntu 18.04 and newer
* Fedora 32 and newer
* Debian 10 and newer
* Ubuntu 14.04 and newer
* Fedora 24 and newer
* Debian 8 and newer
## Quick start & Electron Fiddle

View File

@@ -6,7 +6,7 @@
version: 1.0.{build}
build_cloud: electronhq-16-core
image: base-bake-image
image: e-112.0.5607.0-vs2022
environment:
GIT_CACHE_PATH: C:\Users\appveyor\libcc_cache
ELECTRON_OUT_DIR: Default

View File

@@ -29,7 +29,7 @@
version: 1.0.{build}
build_cloud: electronhq-16-core
image: e-121.0.6116.0
image: e-119.0.6019.2
environment:
GIT_CACHE_PATH: C:\Users\appveyor\libcc_cache
ELECTRON_OUT_DIR: Default
@@ -156,10 +156,11 @@ for:
- gn gen out/ffmpeg "--args=import(\"//electron/build/args/ffmpeg.gn\") %GN_EXTRA_ARGS%"
- ninja -C out/ffmpeg electron:electron_ffmpeg_zip
- ninja -C out/Default electron:electron_dist_zip
- ninja -C out/Default shell_browser_ui_unittests
- gn desc out/Default v8:run_mksnapshot_default args > out/Default/default_mksnapshot_args
# Remove unused args from mksnapshot_args
- ps: >-
Get-Content out/Default/default_mksnapshot_args | Where-Object { -not $_.Contains('--turbo-profiling-input') -And -not $_.Contains('builtins-pgo') -And -not $_.Contains('The gn arg use_goma=true') } | Set-Content out/Default/mksnapshot_args
Get-Content out/Default/default_mksnapshot_args | Where-Object { -not $_.Contains('--turbo-profiling-input') -And -not $_.Contains('builtins-pgo') } | Set-Content out/Default/mksnapshot_args
- ninja -C out/Default electron:electron_mksnapshot_zip
- cd out\Default
- 7z a mksnapshot.zip mksnapshot_args gen\v8\embedded.S
@@ -172,7 +173,6 @@ for:
Get-CimInstance -Namespace root\cimv2 -Class Win32_product | Select vendor, description, @{l='install_location';e='InstallLocation'}, @{l='install_date';e='InstallDate'}, @{l='install_date_2';e='InstallDate2'}, caption, version, name, @{l='sku_number';e='SKUNumber'} | ConvertTo-Json | Out-File -Encoding utf8 -FilePath .\installed_software.json
- python3 electron/build/profile_toolchain.py --output-json=out/Default/windows_toolchain_profile.json
- 7z a node_headers.zip out\Default\gen\node_headers
- 7z a nan.zip third_party\nan
- ps: >-
if ($env:GN_CONFIG -eq 'release') {
# Needed for msdia140.dll on 64-bit windows
@@ -195,16 +195,13 @@ for:
if ($env:SHOULD_SKIP_ARTIFACT_VALIDATION -eq 'true') {
Write-warning "Skipping artifact validation for doc-only $env:APPVEYOR_PROJECT_NAME"
} else {
$artifacts_to_validate = 'dist.zip','windows_toolchain_profile.json','chromedriver.zip','ffmpeg.zip','node_headers.zip','mksnapshot.zip','electron.lib','hunspell_dictionaries.zip','nan.zip'
$artifacts_to_validate = 'dist.zip','windows_toolchain_profile.json','shell_browser_ui_unittests.exe','chromedriver.zip','ffmpeg.zip','node_headers.zip','mksnapshot.zip','electron.lib','hunspell_dictionaries.zip'
foreach($artifact_name in $artifacts_to_validate) {
if ($artifact_name -eq 'ffmpeg.zip') {
$artifact_file = "out\ffmpeg\ffmpeg.zip"
} elseif (
$artifact_name -eq 'node_headers.zip') {
$artifact_file = $artifact_name
} elseif (
$artifact_name -eq 'nan.zip') {
$artifact_file = $artifact_name
} else {
$artifact_file = "out\Default\$artifact_name"
}
@@ -236,10 +233,10 @@ for:
- cd C:\projects\src
- if exist out\Default\windows_toolchain_profile.json ( appveyor-retry appveyor PushArtifact out\Default\windows_toolchain_profile.json )
- if exist out\Default\dist.zip (appveyor-retry appveyor PushArtifact out\Default\dist.zip)
- if exist out\Default\shell_browser_ui_unittests.exe (appveyor-retry appveyor PushArtifact out\Default\shell_browser_ui_unittests.exe)
- if exist out\Default\chromedriver.zip (appveyor-retry appveyor PushArtifact out\Default\chromedriver.zip)
- if exist out\ffmpeg\ffmpeg.zip (appveyor-retry appveyor PushArtifact out\ffmpeg\ffmpeg.zip)
- if exist node_headers.zip (appveyor-retry appveyor PushArtifact node_headers.zip)
- if exist nan.zip (appveyor-retry appveyor PushArtifact nan.zip)
- if exist out\Default\mksnapshot.zip (appveyor-retry appveyor PushArtifact out\Default\mksnapshot.zip)
- if exist out\Default\hunspell_dictionaries.zip (appveyor-retry appveyor PushArtifact out\Default\hunspell_dictionaries.zip)
- if exist out\Default\electron.lib (appveyor-retry appveyor PushArtifact out\Default\electron.lib)
@@ -275,12 +272,12 @@ for:
# Download build artifacts
$apiUrl = 'https://ci.appveyor.com/api'
$build_info = Invoke-RestMethod -Method Get -Uri "$apiUrl/projects/$env:APPVEYOR_ACCOUNT_NAME/$env:APPVEYOR_PROJECT_SLUG/builds/$env:APPVEYOR_BUILD_ID"
$artifacts_to_download = @('dist.zip','ffmpeg.zip','node_headers.zip','electron.lib', 'nan.zip')
$artifacts_to_download = @('dist.zip','ffmpeg.zip','node_headers.zip','electron.lib')
foreach ($job in $build_info.build.jobs) {
if ($job.name -eq "Build Arm on X64 Windows") {
$jobId = $job.jobId
foreach($artifact_name in $artifacts_to_download) {
if ($artifact_name -eq 'electron.lib') {
if ($artifact_name -eq 'shell_browser_ui_unittests.exe' -Or $artifact_name -eq 'electron.lib') {
$outfile = "src\out\Default\$artifact_name"
} else {
$outfile = $artifact_name
@@ -299,7 +296,6 @@ for:
}
- ps: 7z x -y -osrc\out\ffmpeg ffmpeg.zip
- ps: 7z x -y -osrc node_headers.zip
- ps: 7z x -y -osrc nan.zip
test_script:
# Workaround for https://github.com/appveyor/ci/issues/2420

View File

@@ -29,7 +29,7 @@
version: 1.0.{build}
build_cloud: electronhq-16-core
image: e-121.0.6116.0
image: e-119.0.6019.2
environment:
GIT_CACHE_PATH: C:\Users\appveyor\libcc_cache
ELECTRON_OUT_DIR: Default
@@ -154,10 +154,11 @@ for:
- gn gen out/ffmpeg "--args=import(\"//electron/build/args/ffmpeg.gn\") %GN_EXTRA_ARGS%"
- ninja -C out/ffmpeg electron:electron_ffmpeg_zip
- ninja -C out/Default electron:electron_dist_zip
- ninja -C out/Default shell_browser_ui_unittests
- gn desc out/Default v8:run_mksnapshot_default args > out/Default/default_mksnapshot_args
# Remove unused args from mksnapshot_args
- ps: >-
Get-Content out/Default/default_mksnapshot_args | Where-Object { -not $_.Contains('--turbo-profiling-input') -And -not $_.Contains('builtins-pgo') -And -not $_.Contains('The gn arg use_goma=true') } | Set-Content out/Default/mksnapshot_args
Get-Content out/Default/default_mksnapshot_args | Where-Object { -not $_.Contains('--turbo-profiling-input') -And -not $_.Contains('builtins-pgo') } | Set-Content out/Default/mksnapshot_args
- ninja -C out/Default electron:electron_mksnapshot_zip
- cd out\Default
- 7z a mksnapshot.zip mksnapshot_args gen\v8\embedded.S
@@ -192,7 +193,7 @@ for:
if ($env:SHOULD_SKIP_ARTIFACT_VALIDATION -eq 'true') {
Write-warning "Skipping artifact validation for doc-only $env:APPVEYOR_PROJECT_NAME"
} else {
$artifacts_to_validate = 'dist.zip','windows_toolchain_profile.json','chromedriver.zip','ffmpeg.zip','node_headers.zip','mksnapshot.zip','electron.lib','hunspell_dictionaries.zip'
$artifacts_to_validate = 'dist.zip','windows_toolchain_profile.json','shell_browser_ui_unittests.exe','chromedriver.zip','ffmpeg.zip','node_headers.zip','mksnapshot.zip','electron.lib','hunspell_dictionaries.zip'
foreach($artifact_name in $artifacts_to_validate) {
if ($artifact_name -eq 'ffmpeg.zip') {
$artifact_file = "out\ffmpeg\ffmpeg.zip"
@@ -230,6 +231,7 @@ for:
- cd C:\projects\src
- if exist out\Default\windows_toolchain_profile.json ( appveyor-retry appveyor PushArtifact out\Default\windows_toolchain_profile.json )
- if exist out\Default\dist.zip (appveyor-retry appveyor PushArtifact out\Default\dist.zip)
- if exist out\Default\shell_browser_ui_unittests.exe (appveyor-retry appveyor PushArtifact out\Default\shell_browser_ui_unittests.exe)
- if exist out\Default\chromedriver.zip (appveyor-retry appveyor PushArtifact out\Default\chromedriver.zip)
- if exist out\ffmpeg\ffmpeg.zip (appveyor-retry appveyor PushArtifact out\ffmpeg\ffmpeg.zip)
- if exist node_headers.zip (appveyor-retry appveyor PushArtifact node_headers.zip)
@@ -266,12 +268,12 @@ for:
# Download build artifacts
$apiUrl = 'https://ci.appveyor.com/api'
$build_info = Invoke-RestMethod -Method Get -Uri "$apiUrl/projects/$env:APPVEYOR_ACCOUNT_NAME/$env:APPVEYOR_PROJECT_SLUG/builds/$env:APPVEYOR_BUILD_ID"
$artifacts_to_download = @('dist.zip','chromedriver.zip','ffmpeg.zip','node_headers.zip','mksnapshot.zip','electron.lib')
$artifacts_to_download = @('dist.zip','shell_browser_ui_unittests.exe','chromedriver.zip','ffmpeg.zip','node_headers.zip','mksnapshot.zip','electron.lib')
foreach ($job in $build_info.build.jobs) {
if ($job.name -eq "Build") {
$jobId = $job.jobId
foreach($artifact_name in $artifacts_to_download) {
if ($artifact_name -eq 'electron.lib') {
if ($artifact_name -eq 'shell_browser_ui_unittests.exe' -Or $artifact_name -eq 'electron.lib') {
$outfile = "src\out\Default\$artifact_name"
} else {
$outfile = $artifact_name
@@ -305,6 +307,7 @@ for:
$env:npm_config_arch = "ia32"
}
- echo Running main test suite & node script/yarn test -- --trace-uncaught --runners=main --enable-logging=file --log-file=%cd%\electron.log
- echo Running native test suite & node script/yarn test -- --trace-uncaught --runners=native --enable-logging=file --log-file=%cd%\electron.log
- cd ..
- echo Verifying non proprietary ffmpeg & python electron\script\verify-ffmpeg.py --build-dir out\Default --source-root %cd% --ffmpeg-path out\ffmpeg
- echo "About to verify mksnapshot"

View File

@@ -2,7 +2,7 @@ is_electron_build = true
root_extra_deps = [ "//electron" ]
# Registry of NMVs --> https://github.com/nodejs/node/blob/main/doc/abi_version_registry.json
node_module_version = 119
node_module_version = 118
v8_promise_internal_field_count = 1
v8_embedder_string = "-electron.0"
@@ -60,6 +60,3 @@ enable_dangling_raw_ptr_checks = false
# This flag speeds up the performance of fork/execve on linux systems.
# Ref: https://chromium-review.googlesource.com/c/v8/v8/+/4602858
v8_enable_private_mapping_fork_optimization = true
# Expose public V8 symbols for native modules.
v8_expose_public_symbols = true

View File

@@ -1,4 +1,4 @@
#!/usr/bin/env python3
from __future__ import print_function
import collections
import os

View File

@@ -8,7 +8,5 @@
"node_cli_inspect": "1",
"embedded_asar_integrity_validation": "0",
"only_load_app_from_asar": "0",
"load_browser_process_specific_v8_snapshot": "0",
"grant_file_protocol_extra_privileges": "1",
"same_site_storage_api": "0"
"load_browser_process_specific_v8_snapshot": "0"
}

32
build/js2c.py Normal file → Executable file
View File

@@ -4,14 +4,32 @@ import os
import subprocess
import sys
def main():
js2c = sys.argv[1]
root = sys.argv[2]
natives = sys.argv[3]
js_source_files = sys.argv[4:]
TEMPLATE = """
#include "node_native_module.h"
#include "node_internals.h"
namespace node::native_module {{
{definitions}
void NativeModuleLoader::LoadEmbedderJavaScriptSource() {{
{initializers}
}}
}} // namespace node::native_module
"""
def main():
node_path = os.path.abspath(sys.argv[1])
natives = os.path.abspath(sys.argv[2])
js_source_files = sys.argv[3:]
js2c = os.path.join(node_path, 'tools', 'js2c.py')
subprocess.check_call(
[js2c, natives] + js_source_files + ['--only-js', "--root", root])
[sys.executable, js2c] +
js_source_files +
['--only-js', '--target', natives])
if __name__ == '__main__':
sys.exit(main())
sys.exit(main())

View File

@@ -1,5 +1,5 @@
#!/usr/bin/env python3
from __future__ import print_function
import os
import subprocess
import sys

View File

@@ -1,4 +1,4 @@
#!/usr/bin/env python3
from __future__ import unicode_literals
import contextlib
import sys

View File

@@ -1,11 +1,10 @@
import sys
import os
import subprocess
def main(argv):
os.chdir(argv[1])
p = subprocess.Popen(argv[2:])
return p.wait()
cwd = argv[1]
os.chdir(cwd)
os.execv(sys.executable, [sys.executable] + argv[2:])
if __name__ == '__main__':
sys.exit(main(sys.argv))
main(sys.argv)

View File

@@ -1,5 +1,5 @@
#!/usr/bin/env python3
from __future__ import print_function
import os
import subprocess
import sys

View File

@@ -1,5 +1,5 @@
#!/usr/bin/env python3
from __future__ import print_function
import os
import subprocess
import sys

View File

@@ -18,9 +18,4 @@ 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 = ""
}

View File

@@ -31,8 +31,6 @@ static_library("chrome") {
"//chrome/browser/devtools/devtools_file_system_indexer.cc",
"//chrome/browser/devtools/devtools_file_system_indexer.h",
"//chrome/browser/devtools/devtools_settings.h",
"//chrome/browser/devtools/visual_logging.cc",
"//chrome/browser/devtools/visual_logging.h",
"//chrome/browser/extensions/global_shortcut_listener.cc",
"//chrome/browser/extensions/global_shortcut_listener.h",
"//chrome/browser/icon_loader.cc",
@@ -102,6 +100,8 @@ static_library("chrome") {
"//chrome/browser/ui/ui_features.h",
"//chrome/browser/ui/views/eye_dropper/eye_dropper.cc",
"//chrome/browser/ui/views/eye_dropper/eye_dropper.h",
"//chrome/browser/ui/views/eye_dropper/eye_dropper_view.cc",
"//chrome/browser/ui/views/eye_dropper/eye_dropper_view.h",
"//chrome/browser/ui/views/overlay/back_to_tab_label_button.cc",
"//chrome/browser/ui/views/overlay/close_image_button.cc",
"//chrome/browser/ui/views/overlay/close_image_button.h",
@@ -156,6 +156,15 @@ static_library("chrome") {
sources += [ "//chrome/browser/media/webrtc/window_icon_util_ozone.cc" ]
}
if (use_aura) {
sources += [
"//chrome/browser/platform_util_aura.cc",
"//chrome/browser/ui/views/eye_dropper/eye_dropper_view_aura.cc",
"//ui/views/native_window_tracker_aura.cc",
"//ui/views/native_window_tracker_aura.h",
]
}
public_deps = [
"//chrome/browser:dev_ui_browser_resources",
"//chrome/browser/resources/accessibility:resources",
@@ -180,16 +189,6 @@ static_library("chrome") {
"//ui/views/controls/webview",
]
if (use_aura) {
sources += [
"//chrome/browser/platform_util_aura.cc",
"//chrome/browser/ui/views/eye_dropper/eye_dropper_aura.cc",
"//ui/views/native_window_tracker_aura.cc",
"//ui/views/native_window_tracker_aura.h",
]
deps += [ "//components/eye_dropper" ]
}
if (is_linux) {
sources += [ "//chrome/browser/icon_loader_auralinux.cc" ]
if (use_ozone) {
@@ -205,10 +204,6 @@ static_library("chrome") {
"//chrome/browser/ui/views/status_icons/status_icon_linux_dbus.cc",
"//chrome/browser/ui/views/status_icons/status_icon_linux_dbus.h",
]
sources += [
"//chrome/browser/ui/views/dark_mode_manager_linux.cc",
"//chrome/browser/ui/views/dark_mode_manager_linux.h",
]
public_deps += [
"//components/dbus/menu",
"//components/dbus/thread_linux",
@@ -220,11 +215,7 @@ static_library("chrome") {
"//chrome/browser/win/icon_reader_service.cc",
"//chrome/browser/win/icon_reader_service.h",
]
public_deps += [
"//chrome/browser/web_applications/proto",
"//chrome/services/util_win:lib",
"//components/webapps/common:mojo_bindings",
]
public_deps += [ "//chrome/services/util_win:lib" ]
}
if (is_mac) {
@@ -258,8 +249,6 @@ static_library("chrome") {
sources += [
"//chrome/browser/bad_message.cc",
"//chrome/browser/bad_message.h",
"//chrome/browser/printing/prefs_util.cc",
"//chrome/browser/printing/prefs_util.h",
"//chrome/browser/printing/print_job.cc",
"//chrome/browser/printing/print_job.h",
"//chrome/browser/printing/print_job_manager.cc",
@@ -337,8 +326,6 @@ static_library("chrome") {
"//chrome/browser/pdf/pdf_extension_util.h",
"//chrome/browser/pdf/pdf_frame_util.cc",
"//chrome/browser/pdf/pdf_frame_util.h",
"//chrome/browser/pdf/pdf_viewer_stream_manager.cc",
"//chrome/browser/pdf/pdf_viewer_stream_manager.h",
"//chrome/browser/plugins/pdf_iframe_navigation_throttle.cc",
"//chrome/browser/plugins/pdf_iframe_navigation_throttle.h",
]
@@ -347,34 +334,6 @@ 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) {

View File

@@ -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.
```js
```javascript
const { app, globalShortcut } = require('electron')
app.whenReady().then(() => {

View File

@@ -377,6 +377,35 @@ page.
Emitted whenever there is a GPU info update.
### Event: 'gpu-process-crashed' _Deprecated_
Returns:
* `event` Event
* `killed` boolean
Emitted when the GPU process crashes or is killed.
**Deprecated:** This event is superceded by the `child-process-gone` event
which contains more information about why the child process disappeared. It
isn't always because it crashed. The `killed` boolean can be replaced by
checking `reason === 'killed'` when you switch to that event.
### Event: 'renderer-process-crashed' _Deprecated_
Returns:
* `event` Event
* `webContents` [WebContents](web-contents.md)
* `killed` boolean
Emitted when the renderer process of `webContents` crashes or is killed.
**Deprecated:** This event is superceded by the `render-process-gone` event
which contains more information about why the render process disappeared. It
isn't always because it crashed. The `killed` boolean can be replaced by
checking `reason === 'killed'` when you switch to that event.
### Event: 'render-process-gone'
Returns:
@@ -1105,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[]&#32;(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
@@ -1249,10 +1278,10 @@ Returns `boolean` - Whether the current desktop environment is Unity launcher.
### `app.getLoginItemSettings([options])` _macOS_ _Windows_
* `options` Object (optional)
* `type` string (optional) _macOS_ - Can be one of `mainAppService`, `agentService`, `daemonService`, or `loginItemService`. Defaults to `mainAppService`. Only available on macOS 13 and up. See [app.setLoginItemSettings](app.md#appsetloginitemsettingssettings-macos-windows) for more information about each type.
* `serviceName` string (optional) _macOS_ - The name of the service. Required if `type` is non-default. Only available on macOS 13 and up.
* `path` string (optional) _Windows_ - The executable path to compare against. Defaults to `process.execPath`.
* `args` string[] (optional) _Windows_ - The command-line arguments to compare against. Defaults to an empty array.
* `path` string (optional) _Windows_ - The executable path to compare against.
Defaults to `process.execPath`.
* `args` string[] (optional) _Windows_ - The command-line arguments to compare
against. Defaults to an empty array.
If you provided `path` and `args` options to `app.setLoginItemSettings`, then you
need to pass the same arguments here for `openAtLogin` to be set correctly.
@@ -1260,11 +1289,17 @@ need to pass the same arguments here for `openAtLogin` to be set correctly.
Returns `Object`:
* `openAtLogin` boolean - `true` if the app is set to open at login.
* `openAsHidden` boolean _macOS_ _Deprecated_ - `true` if the app is set to open as hidden at login. This does not work on macOS 13 and up.
* `wasOpenedAtLogin` boolean _macOS_ _Deprecated_ - `true` if the app was opened at login automatically. This setting is not available on [MAS builds][mas-builds] or on macOS 13 and up.
* `wasOpenedAsHidden` boolean _macOS_ _Deprecated_ - `true` if the app was opened as a hidden login item. This indicates that the app should not open any windows at startup. This setting is not available on [MAS builds][mas-builds] or on macOS 13 and up.
* `restoreState` boolean _macOS_ _Deprecated_ - `true` if the app was opened as a login item that should restore the state from the previous session. This indicates that the app should restore the windows that were open the last time the app was closed. This setting is not available on [MAS builds][mas-builds] or on macOS 13 and up.
* `status` string _macOS_ - can be one of `not-registered`, `enabled`, `requires-approval`, or `not-found`.
* `openAsHidden` boolean _macOS_ - `true` if the app is set to open as hidden at login.
This setting is not available on [MAS builds][mas-builds].
* `wasOpenedAtLogin` boolean _macOS_ - `true` if the app was opened at login
automatically. This setting is not available on [MAS builds][mas-builds].
* `wasOpenedAsHidden` boolean _macOS_ - `true` if the app was opened as a hidden login
item. This indicates that the app should not open any windows at startup.
This setting is not available on [MAS builds][mas-builds].
* `restoreState` boolean _macOS_ - `true` if the app was opened as a login item that
should restore the state from the previous session. This indicates that the
app should restore the windows that were open the last time the app was
closed. This setting is not available on [MAS builds][mas-builds].
* `executableWillLaunchAtLogin` boolean _Windows_ - `true` if app is set to open at login and its run key is not deactivated. This differs from `openAtLogin` as it ignores the `args` option, this property will be true if the given executable would be launched at login with **any** arguments.
* `launchItems` Object[] _Windows_
* `name` string _Windows_ - name value of a registry entry.
@@ -1278,14 +1313,10 @@ Returns `Object`:
* `settings` Object
* `openAtLogin` boolean (optional) - `true` to open the app at login, `false` to remove
the app as a login item. Defaults to `false`.
* `openAsHidden` boolean (optional) _macOS_ _Deprecated_ - `true` to open the app as hidden. Defaults to `false`. The user can edit this setting from the System Preferences so `app.getLoginItemSettings().wasOpenedAsHidden` should be checked when the app is opened to know the current value. This setting is not available on [MAS build
s][mas-builds] or on macOS 13 and up.
* `type` string (optional) _macOS_ - The type of service to add as a login item. Defaults to `mainAppService`. Only available on macOS 13 and up.
* `mainAppService` - The primary application.
* `agentService` - The property list name for a launch agent. The property list name must correspond to a property list in the apps `Contents/Library/LaunchAgents` directory.
* `daemonService` string (optional) _macOS_ - The property list name for a launch agent. The property list name must correspond to a property list in the apps `Contents/Library/LaunchDaemons` directory.
* `loginItemService` string (optional) _macOS_ - The property list name for a login item service. The property list name must correspond to a property list in the apps `Contents/Library/LoginItems` directory.
* `serviceName` string (optional) _macOS_ - The name of the service. Required if `type` is non-default. Only available on macOS 13 and up.
* `openAsHidden` boolean (optional) _macOS_ - `true` to open the app as hidden. Defaults to
`false`. The user can edit this setting from the System Preferences so
`app.getLoginItemSettings().wasOpenedAsHidden` should be checked when the app
is opened to know the current value. This setting is not available on [MAS builds][mas-builds].
* `path` string (optional) _Windows_ - The executable to launch at login.
Defaults to `process.execPath`.
* `args` string[] (optional) _Windows_ - The command-line arguments to pass to
@@ -1294,7 +1325,6 @@ s][mas-builds] or on macOS 13 and up.
* `enabled` boolean (optional) _Windows_ - `true` will change the startup approved registry key and `enable / disable` the App in Task Manager and Windows Settings.
Defaults to `true`.
* `name` string (optional) _Windows_ - value name to write into registry. Defaults to the app's AppUserModelId().
Set the app's login item settings.
To work with Electron's `autoUpdater` on Windows, which uses [Squirrel][Squirrel-Windows],
@@ -1319,8 +1349,6 @@ app.setLoginItemSettings({
})
```
For more information about setting different services as login items on macOS 13 and up, see [`SMAppService`](https://developer.apple.com/documentation/servicemanagement/smappservice?language=objc).
### `app.isAccessibilitySupportEnabled()` _macOS_ _Windows_
Returns `boolean` - `true` if Chrome's accessibility support is enabled,
@@ -1514,7 +1542,7 @@ A `boolean` property that returns `true` if the app is packaged, `false` otherw
[tasks]:https://learn.microsoft.com/en-us/windows/win32/shell/taskbar-extensions#tasks
[app-user-model-id]: https://learn.microsoft.com/en-us/windows/win32/shell/appids
[electron-forge]: https://www.electronforge.io/
[electron-packager]: https://github.com/electron/packager
[electron-packager]: https://github.com/electron/electron-packager
[CFBundleURLTypes]: https://developer.apple.com/library/ios/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html#//apple_ref/doc/uid/TP40009249-102207-TPXREF115
[LSCopyDefaultHandlerForURLScheme]: https://developer.apple.com/documentation/coreservices/1441725-lscopydefaulthandlerforurlscheme?language=objc
[handoff]: https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/Handoff/HandoffFundamentals/HandoffFundamentals.html
@@ -1543,6 +1571,19 @@ This is the user agent that will be used when no user agent is set at the
app has the same user agent. Set to a custom value as early as possible
in your app's initialization to ensure that your overridden value is used.
### `app.runningUnderRosettaTranslation` _macOS_ _Readonly_ _Deprecated_
A `boolean` which when `true` indicates that the app is currently running
under the [Rosetta Translator Environment](https://en.wikipedia.org/wiki/Rosetta_(software)).
You can use this property to prompt users to download the arm64 version of
your application when they are running the x64 version under Rosetta
incorrectly.
**Deprecated:** This property is superceded by the `runningUnderARM64Translation`
property which detects when the app is being translated to ARM64 in both macOS
and Windows.
### `app.runningUnderARM64Translation` _Readonly_ _macOS_ _Windows_
A `boolean` which when `true` indicates that the app is currently running under

View File

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

View File

@@ -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.
```js
```javascript
// 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:
```js
```javascript
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:
```js
```javascript
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:
```js
```javascript
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:
```js
```javascript
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:
```js
```javascript
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`.
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
win.on('app-command', (e, cmd) => {
@@ -456,7 +456,7 @@ Returns `BrowserWindow | null` - The window with the given `id`.
Objects created with `new BrowserWindow` have the following properties:
```js
```javascript
const { BrowserWindow } = require('electron')
// In this example `win` is our instance
const win = new BrowserWindow({ width: 800, height: 600 })
@@ -475,10 +475,6 @@ 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.
@@ -780,7 +776,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.
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
@@ -1035,7 +1031,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:
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
@@ -1178,7 +1174,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:
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
@@ -1194,7 +1190,7 @@ win.loadURL(url)
You can load a URL using a `POST` request with URL-encoded data by doing
the following:
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

View File

@@ -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:
```js
```javascript
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
```js @ts-type={request:Electron.ClientRequest}
```javascript @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:
```js @ts-type={request:Electron.ClientRequest}
```javascript @ts-type={request:Electron.ClientRequest}
request.on('response', (response) => {
console.log(`STATUS: ${response.statusCode}`)
response.on('error', (error) => {

View File

@@ -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:
```js
```javascript
const { clipboard } = require('electron')
clipboard.writeText('Example string', 'selection')

View File

@@ -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:
```js
```javascript
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:
```js
```javascript
const { app } = require('electron')
app.commandLine.appendSwitch('proxy-bypass-list', '<local>;*.google.com;*foo.com;1.2.3.4:5678')
```

View File

@@ -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.
```js
```javascript
const { app } = require('electron')
app.commandLine.hasSwitch('disable-gpu')
```

View File

@@ -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.
```js
```javascript
const { app, contentTracing } = require('electron')
app.whenReady().then(() => {

View File

@@ -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:
```js
```javascript
// Preload (Isolated World)
const { contextBridge, ipcRenderer } = require('electron')
@@ -18,7 +18,7 @@ contextBridge.exposeInMainWorld(
)
```
```js @ts-nocheck
```javascript @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:
```js
```javascript
const { contextBridge, ipcRenderer } = require('electron')
contextBridge.exposeInMainWorld(
@@ -92,7 +92,7 @@ contextBridge.exposeInMainWorld(
An example of `exposeInIsolatedWorld` is shown below:
```js
```javascript
const { contextBridge, ipcRenderer } = require('electron')
contextBridge.exposeInIsolatedWorld(
@@ -104,7 +104,7 @@ contextBridge.exposeInIsolatedWorld(
)
```
```js @ts-nocheck
```javascript @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.
```js
```javascript
const { contextBridge } = require('electron')
const crypto = require('node:crypto')
contextBridge.exposeInMainWorld('nodeCrypto', {

View File

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

View File

@@ -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:
```js
```javascript
const { crashReporter } = require('electron')
crashReporter.start({ submitURL: 'https://your-domain.com/url-to-submit' })
@@ -100,7 +100,7 @@ longer than the maximum length will be truncated.
### `crashReporter.getLastCrashReport()`
Returns [`CrashReport | null`](structures/crash-report.md) - The date and ID of the
Returns [`CrashReport`](structures/crash-report.md) - The date and ID of the
last crash report. Only crash reports that have been uploaded will be returned;
even if a crash report is present on disk it will not be returned until it is
uploaded. In the case that there are no uploaded reports, `null` is returned.

View File

@@ -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.
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

View File

@@ -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`:
```js
```javascript
// In the main process.
const { BrowserWindow, desktopCapturer } = require('electron')
@@ -24,7 +24,7 @@ desktopCapturer.getSources({ types: ['window', 'screen'] }).then(async sources =
})
```
```js @ts-nocheck
```javascript @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.
```js
```javascript
const constraints = {
audio: {
mandatory: {

View File

@@ -6,7 +6,7 @@ Process: [Main](../glossary.md#main-process)
An example of showing a dialog to select multiple files:
```js
```javascript
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:
```js
```javascript
{
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:
```js
```javascript
{
filters: [
{ name: 'Images', extensions: ['jpg', 'png', 'gif'] },

View File

@@ -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.
```js
```javascript
const { app } = require('electron')
app.dock.bounce()
```

View File

@@ -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.
```js
```javascript
// In the main process.
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

View File

@@ -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:
```js
```javascript
process.env.GOOGLE_API_KEY = 'YOUR_KEY_HERE'
```

View File

@@ -2,11 +2,6 @@
> Use the HTML5 `File` API to work natively with files on the filesystem.
> **Warning**
> The `path` property that Electron adds to the `File` interface is deprecated
> and **will** be removed in a future Electron release. We recommend you
> use `webUtils.getPathForFile` instead.
The DOM's File interface provides abstraction around native files in order to
let users work on native files directly with the HTML5 file API. Electron has
added a `path` attribute to the `File` interface which exposes the file's real

View File

@@ -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.
```js
```javascript
const { app, globalShortcut } = require('electron')
app.whenReady().then(() => {

View File

@@ -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.
```js @ts-type={response:Electron.IncomingMessage}
```javascript @ts-type={response:Electron.IncomingMessage}
// Prints something like:
//
// [ 'user-agent',

View File

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

View File

@@ -151,7 +151,7 @@ can have a submenu.
An example of creating the application menu with the simple template API:
```js @ts-expect-error=[107]
```javascript @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:
```js
```javascript
[
{ id: '1', label: 'one' },
{ id: '2', label: 'two' },
@@ -373,7 +373,7 @@ Menu:
Template:
```js
```javascript
[
{ id: '1', label: 'one' },
{ type: 'separator' },
@@ -397,7 +397,7 @@ Menu:
Template:
```js
```javascript
[
{ id: '1', label: 'one', after: ['3'] },
{ id: '2', label: 'two', before: ['1'] },

View File

@@ -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`:
```js
```javascript
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`:
```js
```javascript
const { clipboard, Tray } = require('electron')
const image = clipboard.readImage()
const appIcon = new Tray(image)
@@ -71,7 +71,7 @@ images/
└── icon@3x.png
```
```js
```javascript
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.
```js
```javascript
const nativeImage = require('electron').nativeImage
const image = nativeImage.createFromPath('/Users/somebody/images/icon.png')

View File

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

View File

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

View File

@@ -85,8 +85,6 @@ 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:
@@ -129,8 +127,6 @@ 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`

View File

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

View File

@@ -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:
```js
```javascript
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.
```js
```javascript
const { app, BrowserWindow, net, protocol, session } = require('electron')
const path = require('node:path')
const url = require('url')
@@ -67,7 +67,7 @@ video/audio. Specify a privilege with the value of `true` to enable the capabili
An example of registering a privileged scheme, that bypasses Content Security
Policy:
```js
```javascript
const { protocol } = require('electron')
protocol.registerSchemesAsPrivileged([
{ scheme: 'foo', privileges: { bypassCSP: true } }
@@ -122,7 +122,7 @@ Example:
```js
const { app, net, protocol } = require('electron')
const path = require('node:path')
const { join } = require('node:path')
const { pathToFileURL } = require('url')
protocol.registerSchemesAsPrivileged([
@@ -145,19 +145,9 @@ app.whenReady().then(() => {
headers: { 'content-type': 'text/html' }
})
}
// NB, this checks for paths that escape the bundle, e.g.
// NB, this does not check for paths that escape the bundle, e.g.
// app://bundle/../../secret_file.txt
const pathToServe = path.resolve(__dirname, pathname)
const relativePath = path.relative(__dirname, pathToServe)
const isSafe = relativePath && !relativePath.startsWith('..') && !path.isAbsolute(relativePath)
if (!isSafe) {
return new Response('bad', {
status: 400,
headers: { 'content-type': 'text/html' }
})
}
return net.fetch(pathToFileURL(pathToServe).toString())
return net.fetch(pathToFileURL(join(__dirname, pathname)).toString())
} else if (host === 'api') {
return net.fetch('https://api.my-server.com/' + pathname, {
method: req.method,
@@ -222,7 +212,7 @@ property.
Example:
```js
```javascript
protocol.registerBufferProtocol('atom', (request, callback) => {
callback({ mimeType: 'text/html', data: Buffer.from('<h5>Response</h5>') })
})
@@ -277,7 +267,7 @@ has the `data` property.
Example:
```js
```javascript
const { protocol } = require('electron')
const { PassThrough } = require('stream')
@@ -302,7 +292,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:
```js
```javascript
protocol.registerStreamProtocol('atom', (request, callback) => {
callback(fs.createReadStream('index.html'))
})

View File

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

View File

@@ -14,29 +14,20 @@ property, so writing `let { screen } = require('electron')` will not work.
An example of creating a window that fills the whole screen:
```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, screen } = require('electron/main')
let mainWindow = null
```javascript fiddle='docs/fiddles/screen/fit-screen'
const { app, BrowserWindow, screen } = require('electron')
let win
app.whenReady().then(() => {
// 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')
const { width, height } = screen.getPrimaryDisplay().workAreaSize
win = new BrowserWindow({ width, height })
win.loadURL('https://github.com')
})
```
Another example of creating a window in the external display:
```js
```javascript
const { app, BrowserWindow, screen } = require('electron')
let win

View File

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

View File

@@ -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.
```js
```javascript
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:
```js
```javascript
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.
```js @ts-expect-error=[4]
```javascript @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).
```js @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
```javascript @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.
```js @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
```javascript @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).
```js @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)} @ts-type={updateGrantedDevices:(devices:Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)=>void}
```javascript @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`.
```js
```javascript
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) & { bypassCustomProtocolHandlers?: boolean } (optional)
* `init` [RequestInit](https://developer.mozilla.org/en-US/docs/Web/API/fetch#options) (optional)
Returns `Promise<GlobalResponse>` - see [Response](https://developer.mozilla.org/en-US/docs/Web/API/Response).
@@ -868,7 +868,7 @@ calling `callback(-2)` rejects it.
Calling `setCertificateVerifyProc(null)` will revert back to default certificate
verify proc.
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
@@ -901,7 +901,6 @@ 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.
@@ -921,7 +920,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.
```js
```javascript
const { session } = require('electron')
session.fromPartition('some-partition').setPermissionRequestHandler((webContents, permission, callback) => {
if (webContents.getURL() === 'some-host' && permission === 'notifications') {
@@ -967,7 +966,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)`.
```js
```javascript
const { session } = require('electron')
const url = require('url')
session.fromPartition('some-partition').setPermissionCheckHandler((webContents, permission, requestingOrigin) => {
@@ -1012,7 +1011,7 @@ via the `navigator.mediaDevices.getDisplayMedia` API. Use the
[desktopCapturer](desktop-capturer.md) API to choose which stream(s) to grant
access to.
```js
```javascript
const { session, desktopCapturer } = require('electron')
session.defaultSession.setDisplayMediaRequestHandler((request, callback) => {
@@ -1026,7 +1025,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.
```js
```javascript
const { session } = require('electron')
session.defaultSession.setDisplayMediaRequestHandler((request, callback) => {
@@ -1051,11 +1050,11 @@ To clear the handler, call `setDevicePermissionHandler(null)`.
This handler can be used to provide default permissioning to devices without first calling for permission
to devices (eg via `navigator.hid.requestDevice`). If this handler is not defined, the default device
permissions as granted through device selection (eg via `navigator.hid.requestDevice`) will be used.
Additionally, the default behavior of Electron is to store granted device permission in memory.
Additionally, the default behavior of Electron is to store granted device permision in memory.
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`.
```js @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
```javascript @ts-type={fetchGrantedDevices:()=>(Array<Electron.DevicePermissionHandlerHandlerDetails['device']>)}
const { app, BrowserWindow } = require('electron')
let win = null
@@ -1137,7 +1136,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)`.
```js
```javascript
const { app, BrowserWindow } = require('electron')
let win = null
@@ -1192,7 +1191,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)`.
```js
```javascript
const { app, BrowserWindow, session } = require('electron')
const path = require('node:path')
@@ -1238,7 +1237,7 @@ Clears the host resolver cache.
Dynamically sets whether to always send credentials for HTTP NTLM or Negotiate
authentication.
```js
```javascript
const { session } = require('electron')
// consider any url ending with `example.com`, `foobar.com`, `baz`
// for integrated authentication.
@@ -1543,7 +1542,7 @@ A [`WebRequest`](web-request.md) object for this session.
A [`Protocol`](protocol.md) object for this session.
```js
```javascript
const { app, session } = require('electron')
const path = require('node:path')
@@ -1562,7 +1561,7 @@ app.whenReady().then(() => {
A [`NetLog`](net-log.md) object for this session.
```js
```javascript
const { app, session } = require('electron')
app.whenReady().then(async () => {

View File

@@ -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:
```js
```javascript
const { shell } = require('electron')
shell.openExternal('https://github.com')

View File

@@ -1,25 +1,22 @@
# Display Object
* `accelerometerSupport` string - Can be `available`, `unavailable`, `unknown`.
* `bounds` [Rectangle](rectangle.md) - the bounds of the display in DIP points.
* `colorDepth` number - The number of bits per pixel.
* `colorSpace` string - represent a color space (three-dimensional object which contains all realizable color combinations) for the purpose of color conversions.
* `depthPerComponent` number - The number of bits per color component.
* `detected` boolean - `true`` if the display is detected by the system.
* `displayFrequency` number - The display refresh rate.
* `id` number - Unique identifier associated with the display. A value of of -1 means the display is invalid or the correct `id` is not yet known, and a value of -10 means the display is a virtual display assigned to a unified desktop.
* `internal` boolean - `true` for an internal display and `false` for an external display.
* `id` number - Unique identifier associated with the display.
* `label` string - User-friendly label, determined by the platform.
* `maximumCursorSize` [Size](size.md) - Maximum cursor size in native pixels.
* `nativeOrigin` [Point](point.md) - Returns the display's origin in pixel coordinates. Only available on windowing systems like X11 that position displays in pixel coordinates.
* `rotation` number - Can be 0, 90, 180, 270, represents screen rotation in
clock-wise degrees.
* `scaleFactor` number - Output device's pixel scale factor.
* `touchSupport` string - Can be `available`, `unavailable`, `unknown`.
* `monochrome` boolean - Whether or not the display is a monochrome display.
* `accelerometerSupport` string - Can be `available`, `unavailable`, `unknown`.
* `colorSpace` string - represent a color space (three-dimensional object which contains all realizable color combinations) for the purpose of color conversions
* `colorDepth` number - The number of bits per pixel.
* `depthPerComponent` number - The number of bits per color component.
* `displayFrequency` number - The display refresh rate.
* `bounds` [Rectangle](rectangle.md) - the bounds of the display in DIP points.
* `size` [Size](size.md)
* `workArea` [Rectangle](rectangle.md) - the work area of the display in DIP points.
* `workAreaSize` [Size](size.md) - The size of the work area.
* `workAreaSize` [Size](size.md)
* `internal` boolean - `true` for an internal display and `false` for an external display
The `Display` object represents a physical display connected to the system. A
fake `Display` may exist on a headless system, or a `Display` may correspond to

View File

@@ -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.
```js
```javascript
{
name: 'Austin_4th_Floor_Printer___C02XK13BJHD4',
displayName: 'Austin 4th Floor Printer @ C02XK13BJHD4',

View File

@@ -9,4 +9,4 @@
* `array` Array\<unknown>
* `dictionary` Record\<string, unknown>
This type is a helper alias, no object will ever exist of this type.
This type is a helper alias, no object will never exist of this type.

View File

@@ -74,11 +74,7 @@
* `defaultEncoding` string (optional) - Defaults to `ISO-8859-1`.
* `backgroundThrottling` boolean (optional) - Whether to throttle animations and timers
when the page becomes background. This also affects the
[Page Visibility API](../browser-window.md#page-visibility). When at least one
[webContents](../web-contents.md) displayed in a single
[browserWindow](../browser-window.md) has disabled `backgroundThrottling` then
frames will be drawn and swapped for the whole window and other
[webContents](../web-contents.md) displayed by it. Defaults to `true`.
[Page Visibility API](../browser-window.md#page-visibility). Defaults to `true`.
* `offscreen` boolean (optional) - Whether to enable offscreen rendering for the browser
window. Defaults to `false`. See the
[offscreen rendering tutorial](../../tutorial/offscreen-rendering.md) for

View File

@@ -4,7 +4,7 @@
Process: [Main](../glossary.md#main-process)
```js
```javascript
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):
```js
```javascript
const { BrowserWindow, systemPreferences } = require('electron')
const browserOptions = { width: 1000, height: 800 }
@@ -306,7 +306,7 @@ This API is only available on macOS 10.14 Mojave or newer.
* `window-background` - The background of a window.
* `window-frame-text` - The text in the window's titlebar area.
Returns `string` - The system color setting in RGBA hexadecimal form (`#RRGGBBAA`).
Returns `string` - The system color setting in RGB hexadecimal form (`#ABCDEF`).
See the [Windows docs][windows-colors] and the [macOS docs][macos-colors] for more details.
The following colors are only available on macOS 10.14: `find-highlight`, `selected-content-background`, `separator`, `unemphasized-selected-content-background`, `unemphasized-selected-text-background`, and `unemphasized-selected-text`.
@@ -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.
```js
```javascript
const { systemPreferences } = require('electron')
systemPreferences.promptTouchID('To get consent for a Security-Gated Thing').then(success => {

View File

@@ -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.
```js
```javascript
const { app, BrowserWindow, TouchBar } = require('electron')
const { TouchBarLabel, TouchBarButton, TouchBarSpacer } = TouchBar

View File

@@ -8,7 +8,7 @@ Process: [Main](../glossary.md#main-process)
`Tray` is an [EventEmitter][event-emitter].
```js
```javascript
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:
```js
```javascript
const { app, Menu, Tray } = require('electron')
let appIcon = null
@@ -111,15 +111,6 @@ Returns:
Emitted when the tray icon is double clicked.
#### Event: 'middle-click' _Windows_
Returns:
* `event` [KeyboardEvent](structures/keyboard-event.md)
* `bounds` [Rectangle](structures/rectangle.md) - The bounds of tray icon.
Emitted when the tray icon is middle clicked.
#### Event: 'balloon-show' _Windows_
Emitted when the tray balloon shows.
@@ -187,7 +178,7 @@ Returns:
Emitted when the mouse clicks the tray icon.
#### Event: 'mouse-enter' _macOS_ _Windows_
#### Event: 'mouse-enter' _macOS_
Returns:
@@ -196,7 +187,7 @@ Returns:
Emitted when the mouse enters the tray icon.
#### Event: 'mouse-leave' _macOS_ _Windows_
#### Event: 'mouse-leave' _macOS_
Returns:

View File

@@ -28,9 +28,8 @@ Process: [Main](../glossary.md#main-process)<br />
* `ignore`: equivalent to \['ignore', 'ignore', 'ignore']
* `inherit`: equivalent to \['ignore', 'inherit', 'inherit']
* `serviceName` string (optional) - Name of the process that will appear in `name` property of
[`ProcessMetric`](structures/process-metric.md) returned by [`app.getAppMetrics`](app.md#appgetappmetrics)
and [`child-process-gone` event of `app`](app.md#event-child-process-gone).
Default is `Node Utility Process`.
[`child-process-gone` event of `app`](app.md#event-child-process-gone).
Default is `node.mojom.NodeService`.
* `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

View File

@@ -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:
```js
```javascript
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:
```js
```javascript
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.
```js
```javascript
const { BrowserWindow, dialog } = require('electron')
const win = new BrowserWindow({ width: 800, height: 600 })
win.webContents.on('will-prevent-unload', (event) => {
@@ -460,6 +460,20 @@ win.webContents.on('will-prevent-unload', (event) => {
**Note:** This will be emitted for `BrowserViews` but will _not_ be respected - this is because we have chosen not to tie the `BrowserView` lifecycle to its owning BrowserWindow should one exist per the [specification](https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event).
#### Event: 'crashed' _Deprecated_
Returns:
* `event` Event
* `killed` boolean
Emitted when the renderer process crashes or is killed.
**Deprecated:** This event is superceded by the `render-process-gone` event
which contains more information about why the render process disappeared. It
isn't always because it crashed. The `killed` boolean can be replaced by
checking `reason === 'killed'` when you switch to that event.
#### Event: 'render-process-gone'
Returns:
@@ -527,7 +541,7 @@ and the menu shortcuts.
To only prevent the menu shortcuts, use
[`setIgnoreMenuShortcuts`](#contentssetignoremenushortcutsignore):
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ width: 800, height: 600 })
@@ -769,18 +783,9 @@ Returns:
word and spellchecker is enabled.
* `frameCharset` string - The character encoding of the frame on which the
menu was invoked.
* `formControlType` string - The source that the context menu was invoked on.
Possible values include `none`, `button-button`, `field-set`,
`input-button`, `input-checkbox`, `input-color`, `input-date`,
`input-datetime-local`, `input-email`, `input-file`, `input-hidden`,
`input-image`, `input-month`, `input-number`, `input-password`, `input-radio`,
`input-range`, `input-reset`, `input-search`, `input-submit`, `input-telephone`,
`input-text`, `input-time`, `input-url`, `input-week`, `output`, `reset-button`,
`select-list`, `select-list`, `select-multiple`, `select-one`, `submit-button`,
and `text-area`,
* `inputFieldType` string _Deprecated_ - If the context menu was invoked on an
input field, the type of that field. Possible values include `none`,
`plainText`, `password`, `other`.
* `inputFieldType` string - If the context menu was invoked on an input
field, the type of that field. Possible values include `none`, `plainText`,
`password`, `other`.
* `spellcheckEnabled` boolean - If the context is editable, whether or not spellchecking is enabled.
* `menuSourceType` string - Input source that invoked the context menu.
Can be `none`, `mouse`, `keyboard`, `touch`, `touchMenu`, `longPress`, `longTap`, `touchHandle`, `stylus`, `adjustSelection`, or `adjustSelectionReset`.
@@ -837,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.
```js title='main.js'
```javascript title='main.js'
const { app, BrowserWindow } = require('electron')
let win = null
@@ -872,7 +877,7 @@ Returns:
Emitted when a new frame is generated. Only the dirty area is passed in the
buffer.
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ webPreferences: { offscreen: true } })
@@ -1004,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.
```js
```javascript
const win = new BrowserWindow()
const options = { extraHeaders: 'pragma: no-cache\n' }
win.webContents.loadURL('https://github.com', options)
@@ -1054,7 +1059,7 @@ Initiates a download of the resource at `url` without navigating. The
Returns `string` - The URL of the current web page.
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL('https://github.com').then(() => {
@@ -1206,7 +1211,7 @@ Returns `string` - The user agent for this web page.
* `css` string
* `options` Object (optional)
* `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'.
* `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'.
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)`.
@@ -1503,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`.
```js
```javascript
const win = new BrowserWindow()
win.webContents.on('found-in-page', (event, result) => {
if (result.finalUpdate) win.webContents.stopFindInPage('clearSelection')
@@ -1623,7 +1628,7 @@ The `landscape` will be ignored if `@page` CSS at-rule is used in the web page.
An example of `webContents.printToPDF`:
```js
```javascript
const { BrowserWindow } = require('electron')
const fs = require('node:fs')
const path = require('node:path')
@@ -1655,7 +1660,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:
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
win.webContents.on('devtools-opened', () => {
@@ -1978,7 +1983,7 @@ the cursor when dragging.
Returns `Promise<void>` - resolves if the page is saved.
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

View File

@@ -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.
```js
```javascript
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).
```js
```javascript
const { BrowserWindow } = require('electron')
async function main () {

View File

@@ -10,7 +10,7 @@ certain properties and methods (e.g. `webFrame.firstChild`).
An example of zooming current page to 200%.
```js
```javascript
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:
```js @ts-expect-error=[2,6]
```javascript @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 '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 either '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.
```js
```javascript
const { webFrame } = require('electron')
console.log(webFrame.getResourceUsage())
```
This will generate:
```js
```javascript
{
images: {
count: 22,

View File

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

View File

@@ -1,26 +0,0 @@
# webUtils
> A utility layer to interact with Web API objects (Files, Blobs, etc.)
Process: [Renderer](../glossary.md#renderer-process)
## Methods
The `webUtils` module has the following methods:
### `webUtils.getPathForFile(file)`
* `file` File - A web [File](https://developer.mozilla.org/en-US/docs/Web/API/File) object.
Returns `string` - The file system path that this `File` object points to. In the case where the object passed in is not a `File` object an exception is thrown. In the case where the File object passed in was constructed in JS and is not backed by a file on disk an empty string is returned.
This method superceded the previous augmentation to the `File` object with the `path` property. An example is included below.
```js
// Before
const oldPath = document.querySelector('input').files[0].path
// After
const { webUtils } = require('electron')
const newPath = webUtils.getPathForFile(document.querySelector('input').files[0])
```

View File

@@ -255,7 +255,7 @@ The `webview` tag has the following methods:
**Example**
```js @ts-expect-error=[3]
```javascript @ts-expect-error=[3]
const webview = document.querySelector('webview')
webview.addEventListener('dom-ready', () => {
webview.openDevTools()
@@ -802,7 +802,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.
```js @ts-expect-error=[3]
```javascript @ts-expect-error=[3]
const webview = document.querySelector('webview')
webview.addEventListener('console-message', (e) => {
console.log('Guest page logged a message:', e.message)
@@ -823,7 +823,7 @@ Returns:
Fired when a result is available for
[`webview.findInPage`](#webviewfindinpagetext-options) request.
```js @ts-expect-error=[3,6]
```javascript @ts-expect-error=[3,6]
const webview = document.querySelector('webview')
webview.addEventListener('found-in-page', (e) => {
webview.stopFindInPage('keepSelection')
@@ -948,7 +948,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.
```js @ts-expect-error=[3]
```javascript @ts-expect-error=[3]
const webview = document.querySelector('webview')
webview.addEventListener('close', () => {
webview.src = 'about:blank'
@@ -968,7 +968,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:
```js @ts-expect-error=[4,7]
```javascript @ts-expect-error=[4,7]
// In embedder page.
const webview = document.querySelector('webview')
webview.addEventListener('ipc-message', (event) => {
@@ -978,7 +978,7 @@ webview.addEventListener('ipc-message', (event) => {
webview.send('ping')
```
```js
```javascript
// In guest page.
const { ipcRenderer } = require('electron')
ipcRenderer.on('ping', () => {
@@ -986,6 +986,14 @@ ipcRenderer.on('ping', () => {
})
```
### Event: 'crashed' _Deprecated_
Fired when the renderer process crashes or is killed.
**Deprecated:** This event is superceded by the `render-process-gone` event
which contains more information about why the render process disappeared. It
isn't always because it crashed.
### Event: 'render-process-gone'
Returns:
@@ -1098,18 +1106,9 @@ Returns:
word and spellchecker is enabled.
* `frameCharset` string - The character encoding of the frame on which the
menu was invoked.
* `formControlType` string - The source that the context menu was invoked on.
Possible values include `none`, `button-button`, `field-set`,
`input-button`, `input-checkbox`, `input-color`, `input-date`,
`input-datetime-local`, `input-email`, `input-file`, `input-hidden`,
`input-image`, `input-month`, `input-number`, `input-password`, `input-radio`,
`input-range`, `input-reset`, `input-search`, `input-submit`, `input-telephone`,
`input-text`, `input-time`, `input-url`, `input-week`, `output`, `reset-button`,
`select-list`, `select-list`, `select-multiple`, `select-one`, `submit-button`,
and `text-area`,
* `inputFieldType` string _Deprecated_ - If the context menu was invoked on an
input field, the type of that field. Possible values include `none`,
`plainText`, `password`, `other`.
* `inputFieldType` string - If the context menu was invoked on an input
field, the type of that field. Possible values include `none`, `plainText`,
`password`, `other`.
* `spellcheckEnabled` boolean - If the context is editable, whether or not spellchecking is enabled.
* `menuSourceType` string - Input source that invoked the context menu.
Can be `none`, `mouse`, `keyboard`, `touch`, `touchMenu`, `longPress`, `longTap`, `touchHandle`, `stylus`, `adjustSelection`, or `adjustSelectionReset`.

View File

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

View File

@@ -12,69 +12,8 @@ This document uses the following convention to categorize breaking changes:
* **Deprecated:** An API was marked as deprecated. The API will continue to function, but will emit a deprecation warning, and will be removed in a future release.
* **Removed:** An API or feature was removed, and is no longer supported by Electron.
## Planned Breaking API Changes (29.0)
### Behavior Changed: `ipcRenderer` can no longer be sent over the `contextBridge`
Attempting to send `ipcRenderer` as an object over the `contextBridge` will now result in
an empty object on the receiving side of the bridge. This change was made to remove / mitigate
a security footgun, you should not directly expose ipcRenderer or it's methods over the bridge.
Instead provide a safe wrapper like below:
```js
contextBridge.exposeInMainWorld('app', {
onEvent: (cb) => ipcRenderer.on('foo', (e, ...args) => cb(args))
})
```
### Removed: `renderer-process-crashed` event on `app`
The `renderer-process-crashed` event on `app` has been removed.
Use the new `render-process-gone` event instead.
```js
// Removed
app.on('renderer-process-crashed', (event, webContents, killed) => { /* ... */ })
// Replace with
app.on('render-process-gone', (event, webContents, details) => { /* ... */ })
```
### Removed: `crashed` event on `WebContents` and `<webview>`
The `crashed` events on `WebContents` and `<webview>` have been removed.
Use the new `render-process-gone` event instead.
```js
// Removed
win.webContents.on('crashed', (event, killed) => { /* ... */ })
webview.addEventListener('crashed', (event) => { /* ... */ })
// Replace with
win.webContents.on('render-process-gone', (event, details) => { /* ... */ })
webview.addEventListener('render-process-gone', (event) => { /* ... */ })
```
### Removed: `gpu-process-crashed` event on `app`
The `gpu-process-crashed` event on `app` has been removed.
Use the new `child-process-gone` event instead.
```js
// Removed
app.on('gpu-process-crashed', (event, killed) => { /* ... */ })
// Replace with
app.on('child-process-gone', (event, details) => { /* ... */ })
```
## Planned Breaking API Changes (28.0)
### Behavior Changed: `WebContents.backgroundThrottling` set to false affects all `WebContents` in the host `BrowserWindow`
`WebContents.backgroundThrottling` set to false will disable frames throttling
in the `BrowserWindow` for all `WebContents` displayed by it.
### Removed: `BrowserWindow.setTrafficLightPosition(position)`
`BrowserWindow.setTrafficLightPosition(position)` has been removed, the
@@ -119,65 +58,6 @@ The `ipcRenderer.sendTo()` API has been removed. It should be replaced by settin
The `senderId` and `senderIsMainFrame` properties of `IpcRendererEvent` have been removed as well.
### Removed: `app.runningUnderRosettaTranslation`
The `app.runningUnderRosettaTranslation` property has been removed.
Use `app.runningUnderARM64Translation` instead.
```js
// Removed
console.log(app.runningUnderRosettaTranslation)
// Replace with
console.log(app.runningUnderARM64Translation)
```
### Deprecated: `renderer-process-crashed` event on `app`
The `renderer-process-crashed` event on `app` has been deprecated.
Use the new `render-process-gone` event instead.
```js
// Deprecated
app.on('renderer-process-crashed', (event, webContents, killed) => { /* ... */ })
// Replace with
app.on('render-process-gone', (event, webContents, details) => { /* ... */ })
```
### Deprecated: `params.inputFormType` property on `context-menu` on `WebContents`
The `inputFormType` property of the params object in the `context-menu`
event from `WebContents` has been deprecated. Use the new `formControlType`
property instead.
### Deprecated: `crashed` event on `WebContents` and `<webview>`
The `crashed` events on `WebContents` and `<webview>` have been deprecated.
Use the new `render-process-gone` event instead.
```js
// Deprecated
win.webContents.on('crashed', (event, killed) => { /* ... */ })
webview.addEventListener('crashed', (event) => { /* ... */ })
// Replace with
win.webContents.on('render-process-gone', (event, details) => { /* ... */ })
webview.addEventListener('render-process-gone', (event) => { /* ... */ })
```
### Deprecated: `gpu-process-crashed` event on `app`
The `gpu-process-crashed` event on `app` has been deprecated.
Use the new `child-process-gone` event instead.
```js
// Deprecated
app.on('gpu-process-crashed', (event, killed) => { /* ... */ })
// Replace with
app.on('child-process-gone', (event, details) => { /* ... */ })
```
## Planned Breaking API Changes (27.0)
### Removed: macOS 10.13 / 10.14 support
@@ -590,7 +470,7 @@ The `new-window` event of `<webview>` has been removed. There is no direct repla
webview.addEventListener('new-window', (event) => {})
```
```js
```javascript fiddle='docs/fiddles/ipc/webview-new-window'
// Replace with
// main.js
@@ -836,18 +716,6 @@ to open synchronously scriptable child windows, among other incompatibilities.
See the documentation for [window.open in Electron](api/window-open.md)
for more details.
### Deprecated: `app.runningUnderRosettaTranslation`
The `app.runningUnderRosettaTranslation` property has been deprecated.
Use `app.runningUnderARM64Translation` instead.
```js
// Deprecated
console.log(app.runningUnderRosettaTranslation)
// Replace with
console.log(app.runningUnderARM64Translation)
```
## Planned Breaking API Changes (14.0)
### Removed: `remote` module
@@ -1255,7 +1123,7 @@ module](https://medium.com/@nornagon/electrons-remote-module-considered-harmful-
The APIs are now synchronous and the optional callback is no longer needed.
```js
```javascript
// Deprecated
protocol.unregisterProtocol(scheme, () => { /* ... */ })
// Replace with
@@ -1284,7 +1152,7 @@ protocol.unregisterProtocol(scheme)
The APIs are now synchronous and the optional callback is no longer needed.
```js
```javascript
// Deprecated
protocol.registerFileProtocol(scheme, handler, () => { /* ... */ })
// Replace with
@@ -1299,7 +1167,7 @@ until navigation happens.
This API is deprecated and users should use `protocol.isProtocolRegistered`
and `protocol.isProtocolIntercepted` instead.
```js
```javascript
// Deprecated
protocol.isProtocolHandled(scheme).then(() => { /* ... */ })
// Replace with

View File

@@ -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:
```ts title='lib/browser/api/module-list.ts' @ts-nocheck
```typescript title='lib/browser/api/module-list.ts' @ts-nocheck
export const browserModuleList: ElectronInternal.ModuleEntry[] = [
{ name: 'apiName', loader: () => require('./api-name') },
];

View File

@@ -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:
```js
```javascript
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:
```js
```javascript
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:
```js
```javascript
// 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]:
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow({
backgroundColor: '#fff'

View File

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

View File

@@ -1,6 +1,5 @@
const { contextBridge, ipcRenderer } = require('electron/renderer')
contextBridge.exposeInMainWorld('electronAPI', {
onUpdateCounter: (callback) => ipcRenderer.on('update-counter', (_event, value) => callback(value)),
counterValue: (value) => ipcRenderer.send('counter-value', value)
handleCounter: (callback) => ipcRenderer.on('update-counter', () => callback())
})

View File

@@ -1,8 +1,8 @@
const counter = document.getElementById('counter')
window.electronAPI.onUpdateCounter((value) => {
window.electronAPI.handleCounter((event, value) => {
const oldValue = Number(counter.innerText)
const newValue = oldValue + value
counter.innerText = newValue.toString()
window.electronAPI.counterValue(newValue)
counter.innerText = newValue
event.sender.send('counter-value', newValue)
})

View File

@@ -44,7 +44,7 @@
<h3>Packaging</h3>
<p>This feature will only work on macOS when your app is packaged. It will not work when you're launching it in
development from the command-line. When you package your app you'll need to make sure the macOS <code>plist</code>
for the app is updated to include the new protocol handler. If you're using <code>@electron/packager</code> then you
for the app is updated to include the new protocol handler. If you're using <code>electron-packager</code> then you
can add the flag <code>--extend-info</code> with a path to the <code>plist</code> you've created. The one for this
app is below:</p>

View File

@@ -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:
```js
```javascript
const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

View File

@@ -41,27 +41,27 @@ $ asar list /path/to/example.asar
Read a file in the ASAR archive:
```js
```javascript
const fs = require('node:fs')
fs.readFileSync('/path/to/example.asar/file.txt')
```
List all files under the root of the archive:
```js
```javascript
const fs = require('node:fs')
fs.readdirSync('/path/to/example.asar')
```
Use a module from the archive:
```js @ts-nocheck
```javascript @ts-nocheck
require('./path/to/example.asar/dir/module.js')
```
You can also display a web page in an ASAR archive with `BrowserWindow`:
```js
```javascript
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:
```js
```javascript
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:
```js
```javascript
const fs = require('node:fs')
process.noAsar = true
fs.readFileSync('/path/to/example.asar')

View File

@@ -13,7 +13,7 @@ Currently ASAR integrity checking is only supported on macOS.
### Electron Forge / Electron Packager
If you are using `>= @electron/packager`, `>= electron-packager@15.4.0` or `>= @electron-forge/core@6.0.0-beta.61` then all these requirements are met for you automatically and you can skip to [Toggling the Fuse](#toggling-the-fuse).
If you are using `>= electron-packager@15.4.0` or `>= @electron-forge/core@6.0.0-beta.61` then all these requirements are met for you automatically and you can skip to [Toggling the Fuse](#toggling-the-fuse).
### Other build systems

View File

@@ -22,101 +22,34 @@ 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
If you don't use WebdriverIO in your project yet, you can add it by running the starter toolkit in your project root directory:
First you need to run the WebdriverIO starter toolkit in your project root directory:
```sh npm2yarn
npm init wdio@latest ./
npx wdio . --yes
```
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?"_.
This installs all necessary packages for you and generates a `wdio.conf.js` configuration file.
#### Connect WDIO to your Electron app
After running the configuration wizard, your `wdio.conf.js` should include roughly the following content:
Update the capabilities in your configuration file to point to your Electron app binary:
```js title='wdio.conf.js' @ts-nocheck
export const config = {
```javascript title='wdio.conf.js'
exports.config = {
// ...
services: ['electron'],
capabilities: [{
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']
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/
}
}]
// ...
}
```
#### 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:
@@ -125,12 +58,6 @@ 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

View File

@@ -30,7 +30,7 @@ Electron Forge is a tool for packaging and publishing Electron applications. It
into a single extensible interface so that anyone can jump right into making Electron apps.
Forge comes with [a ready-to-use template](https://electronforge.io/templates) using Webpack as a bundler. It includes an example typescript configuration and provides two configuration files to enable easy customization. It uses the same core modules used by the
greater Electron community (like [`@electron/packager`](https://github.com/electron/packager))
greater Electron community (like [`electron-packager`](https://github.com/electron/electron-packager))
changes made by Electron maintainers (like Slack) benefit Forge's users, too.
You can find more information and documentation on [electronforge.io](https://electronforge.io/).

View File

@@ -51,7 +51,7 @@ ways to get your application signed and notarized.
If you're using Electron's favorite build tool, getting your application signed
and notarized requires a few additions to your configuration. [Forge](https://electronforge.io) is a
collection of the official Electron tools, using [`@electron/packager`][],
collection of the official Electron tools, using [`electron-packager`][],
[`@electron/osx-sign`][], and [`@electron/notarize`][] under the hood.
Detailed instructions on how to configure your application can be found in the
@@ -61,14 +61,14 @@ the Electron Forge docs.
### Using Electron Packager
If you're not using an integrated build pipeline like Forge, you
are likely using [`@electron/packager`][], which includes [`@electron/osx-sign`][] and
are likely using [`electron-packager`][], which includes [`@electron/osx-sign`][] and
[`@electron/notarize`][].
If you're using Packager's API, you can pass [in configuration that both signs
and notarizes your application](https://electron.github.io/packager/main/interfaces/electronpackager.options.html).
and notarizes your application](https://electron.github.io/electron-packager/main/interfaces/electronpackager.options.html).
```js @ts-nocheck
const packager = require('@electron/packager')
const packager = require('electron-packager')
packager({
dir: '/path/to/my/app',
@@ -190,7 +190,7 @@ See the [Windows Store Guide][].
[apple developer program]: https://developer.apple.com/programs/
[`@electron/osx-sign`]: https://github.com/electron/osx-sign
[`@electron/packager`]: https://github.com/electron/packager
[`electron-packager`]: https://github.com/electron/electron-packager
[`@electron/notarize`]: https://github.com/electron/notarize
[`electron-winstaller`]: https://github.com/electron/windows-installer
[`electron-wix-msi`]: https://github.com/electron-userland/electron-wix-msi

View File

@@ -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:
```js title='preload.js' @ts-nocheck
```javascript 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:
```js title='renderer.js' @ts-nocheck
```javascript 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.
```js title='preload.js'
```javascript title='preload.js'
// preload with contextIsolation enabled
const { contextBridge } = require('electron')
@@ -43,7 +43,7 @@ contextBridge.exposeInMainWorld('myAPI', {
})
```
```js title='renderer.js' @ts-nocheck
```javascript 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**.
```js title='preload.js'
```javascript 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.
```js title='preload.js'
```javascript title='preload.js'
// ✅ Good code
contextBridge.exposeInMainWorld('myAPI', {
loadPreferences: () => ipcRenderer.invoke('load-prefs')
@@ -76,15 +76,15 @@ If you're building your Electron app with TypeScript, you'll want to add types t
For example, given this `preload.ts` script:
```ts title='preload.ts'
```typescript title='preload.ts'
contextBridge.exposeInMainWorld('electronAPI', {
loadPreferences: () => ipcRenderer.invoke('load-prefs')
})
```
You can create a `interface.d.ts` declaration file and globally augment the `Window` interface:
You can create a `renderer.d.ts` declaration file and globally augment the `Window` interface:
```ts title='interface.d.ts' @ts-noisolate
```typescript 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:
```ts title='renderer.ts'
```typescript title='renderer.ts'
window.electronAPI.loadPreferences()
```

View File

@@ -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.
```fiddle docs/fiddles/features/dark-mode
```javascript fiddle='docs/fiddles/features/dark-mode'
```
@@ -199,7 +199,7 @@ Run the example using Electron Fiddle and then click the "Toggle Dark Mode" butt
[system-wide-dark-mode]: https://developer.apple.com/design/human-interface-guidelines/macos/visual-design/dark-mode/
[electron-forge]: https://www.electronforge.io/
[electron-packager]: https://github.com/electron/packager
[packager-darwindarkmode-api]: https://electron.github.io/packager/main/interfaces/electronpackager.options.html#darwindarkmodesupport
[electron-packager]: https://github.com/electron/electron-packager
[packager-darwindarkmode-api]: https://electron.github.io/electron-packager/main/interfaces/electronpackager.options.html#darwindarkmodesupport
[prefers-color-scheme]: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme
[event-listeners]: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

View File

@@ -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.
```fiddle docs/fiddles/features/web-bluetooth
```javascript 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:
```js
```javascript
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.
```fiddle docs/fiddles/features/web-hid
```javascript 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.
```fiddle docs/fiddles/features/web-serial
```javascript 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.
```fiddle docs/fiddles/features/web-usb
```javascript fiddle='docs/fiddles/features/web-usb'
```

View File

@@ -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:
```js
```javascript
const { app, session } = require('electron')
const path = require('node:path')
const os = require('node:os')

View File

@@ -9,14 +9,12 @@ check out our [Electron Versioning](./electron-versioning.md) doc.
| Electron | Alpha | Beta | Stable | EOL | Chrome | Node | Supported |
| ------- | ----- | ------- | ------ | ------ | ---- | ---- | ---- |
| 29.0.0 | 2023-Dec-07 | 2023-Jan-24 | 2023-Feb-20 | 2024-Aug-20 | M122 | v18.19 | ✅ |
| 28.0.0 | 2023-Oct-11 | 2023-Nov-06 | 2023-Dec-05 | 2024-Jun-11 | M120 | v18.18 | ✅ |
| 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-20 | M116 | v18.16 | ✅ |
| 25.0.0 | 2023-Apr-10 | 2023-May-02 | 2023-May-30 | 2023-Dec-05 | M114 | v18.15 | 🚫 |
| 24.0.0 | 2023-Feb-09 | 2023-Mar-07 | 2023-Apr-04 | 2023-Oct-10 | M112 | v18.14 | 🚫 |
| 27.0.0 | 2023-Aug-17 | 2023-Sep-13 | 2023-Oct-10 | TBD | M118 | TBD | ✅ |
| 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 | 2022-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 | 🚫 |
@@ -50,6 +48,12 @@ 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
@@ -74,38 +78,6 @@ 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

View File

@@ -0,0 +1,38 @@
# ESM Limitations
This document serves to outline the limitations / differences between ESM in Electron and ESM in Node.js and Chromium.
## ESM Support Matrix
This table gives a general overview of where ESM is supported and most importantly which ESM loader is used.
| | Supported | Loader | Supported in Preload | Loader in Preload | Applicable Requirements |
|-|-|-|-|-|-|
| Main Process | Yes | Node.js | N/A | N/A | <ul><li> [You must `await` generously in the main process to avoid race conditions](#you-must-use-await-generously-in-the-main-process-to-avoid-race-conditions) </li></ul> |
| Sandboxed Renderer | Yes | Chromium | No | | <ul><li> [Sandboxed preload scripts can't use ESM imports](#sandboxed-preload-scripts-cant-use-esm-imports) </li></ul> |
| Node.js Renderer + Context Isolation | Yes | Chromium | Yes | Node.js | <ul><li> [Node.js ESM Preload Scripts will run after page load on pages with no content](#nodejs-esm-preload-scripts-will-run-after-page-load-on-pages-with-no-content) </li> <li>[ESM Preload Scripts must have the `.mjs` extension](#esm-preload-scripts-must-have-the-mjs-extension)</li></ul> |
| Node.js Renderer + No Context Isolation | Yes | Chromium | Yes | Node.js | <ul><li> [Non-context-isolated renderers can't use dynamic Node.js ESM imports](#non-context-isolated-renderers-cant-use-dynamic-nodejs-esm-imports) </li> <li>[ESM Preload Scripts must have the `.mjs` extension](#esm-preload-scripts-must-have-the-mjs-extension)</li></ul> |
## Requirements
### You must use `await` generously in the main process to avoid race conditions
Certain APIs in Electron (`app.setPath` for instance) are documented as needing to be called **before** the `app.on('ready')` event is emitted. When using ESM in the main process it is only guaranteed that the `ready` event hasn't been emitted while executing the side-effects of the primary import. i.e. if `index.mjs` calls `import('./set-up-paths.mjs')` at the top level the app will likely already be "ready" by the time that dynamic import resolves. To avoid this you should `await import('./set-up-paths.mjs')` at the top level of `index.mjs`. It's not just import calls you should await, if you are reading files asynchronously or performing other asynchronous actions you must await those at the top-level as well to ensure the app does not resume initialization and become ready too early.
### Sandboxed preload scripts can't use ESM imports
Sandboxed preload scripts are run as plain javascript without an ESM context. It is recommended that preload scripts are bundled via something like `webpack` or `vite` for performance reasons regardless, so your preload script should just be a single file that doesn't need to use ESM imports. Loading the `electron` API is still done via `require('electron')`.
### Node.js ESM Preload Scripts will run after page load on pages with no content
If the response body for the page is **completely** empty, i.e. `Content-Length: 0`, the preload script will not block the page load, which may result in race conditions. If this impacts you, change your response body to have _something_ in it, for example an empty `html` tag (`<html></html>`) or swap back to using a CommonJS preload script (`.js` or `.cjs`) which will block the page load.
### ESM Preload Scripts must have the `.mjs` extension
In order to load an ESM preload script it must have a `.mjs` file extension. Using `type: module` in a nearby package.json is not sufficient. Please also note the limitation above around not blocking page load if the page is empty.
### Non-context-isolated renderers can't use dynamic Node.js ESM imports
If your renderer process does not have `contextIsolation` enabled you can not `import()` ESM files via the Node.js module loader. This means that you can't `import('fs')` or `import('./foo')`. If you want to be able to do so you must enable context isolation. This is because in the renderer Chromium's `import()` function takes precedence and without context isolation there is no way for Electron to know which loader to route the request to.
If you enable context isolation `import()` from the isolated preload context will use the Node.js loader and `import()` from the main context will continue using Chromium's loader.

View File

@@ -1,172 +0,0 @@
---
title: "ES Modules (ESM) in Electron"
description: "The ES module (ESM) format is the standard way of loading JavaScript packages."
slug: esm
hide_title: false
---
# ES Modules (ESM) in Electron
## Introduction
The ECMAScript module (ESM) format is [the standard way of loading JavaScript packages](https://tc39.es/ecma262/#sec-modules).
Chromium and Node.js have their own implementations of the ESM specification, and Electron
chooses which module loader to use depending on the context.
This document serves to outline the limitations of ESM in Electron and the differences between
ESM in Electron and ESM in Node.js and Chromium.
:::info
This feature was added in `electron@28.0.0`.
:::
## Summary: ESM support matrix
This table gives a general overview of where ESM is supported and which ESM loader is used.
| Process | ESM Loader | ESM Loader in Preload | Applicable Requirements |
|----------------------|------------|-----------------------|-------------------------|
| Main | Node.js | N/A | <ul><li> [You must use `await` generously before the app's `ready` event](#you-must-use-await-generously-before-the-apps-ready-event) </li></ul> |
| Renderer (Sandboxed) | Chromium | Unsupported | <ul><li> [Sandboxed preload scripts can't use ESM imports](#sandboxed-preload-scripts-cant-use-esm-imports) </li></ul> |
| Renderer (Unsandboxed & Context Isolated) | Chromium | Node.js | <ul><li> [Unsandboxed ESM preload scripts will run after page load on pages with no content](#unsandboxed-esm-preload-scripts-will-run-after-page-load-on-pages-with-no-content) </li> <li>[ESM Preload Scripts must have the `.mjs` extension](#esm-preload-scripts-must-have-the-mjs-extension)</li></ul> |
| Renderer (Unsandboxed & Non Context Isolated) | Chromium | Node.js | <ul><li>[Unsandboxed ESM preload scripts will run after page load on pages with no content](#unsandboxed-esm-preload-scripts-will-run-after-page-load-on-pages-with-no-content)</li><li>[ESM Preload Scripts must have the `.mjs` extension](#esm-preload-scripts-must-have-the-mjs-extension)</li><li>[ESM preload scripts must be context isolated to use dynamic Node.js ESM imports](#esm-preload-scripts-must-be-context-isolated-to-use-dynamic-nodejs-esm-imports)</li></ul> |
## Main process
Electron's main process runs in a Node.js context and uses its ESM loader. Usage should follow
[Node's ESM documentation](https://nodejs.org/api/esm.html). To enable ESM in a file in the
main process, one of the following conditions must be met:
- The file ends with the `.mjs` extension
- The nearest parent package.json has `"type": "module"` set
See Node's [Determining Module System](https://nodejs.org/api/packages.html#determining-module-system)
doc for more details.
### Caveats
#### You must use `await` generously before the app's `ready` event
ES Modules are loaded **asynchronously**. This means that only side effects
from the main process entry point's imports will execute before the `ready` event.
This is important because certain Electron APIs (e.g. [`app.setPath`](../api/app.md#appsetpathname-path))
need to be called **before** the app's `ready` event is emitted.
With top-level `await` available in Node.js ESM, make sure to `await` every Promise that you need to
execute before the `ready` event. Otherwise, your app may be `ready` before your code executes.
This is particularly important to keep in mind for dynamic ESM import statmements (static imports are unaffected).
For example, if `index.mjs` calls `import('./set-up-paths.mjs')` at the top level, the app will
likely already be `ready` by the time that dynamic import resolves.
```js @ts-expect-error=[2] title='index.mjs (Main Process)'
// add an await call here to guarantee that path setup will finish before `ready`
import('./set-up-paths.mjs')
app.whenReady().then(() => {
console.log('This code may execute before the above import')
})
```
:::caution Transpiler translations
JavaScript transpilers (e.g. Babel, TypeScript) have historically supported ES Module
syntax before Node.js supported ESM imports by turning these calls to CommonJS
`require` calls.
<details><summary>Example: @babel/plugin-transform-modules-commonjs</summary>
The `@babel/plugin-transform-modules-commonjs` plugin will transform
ESM imports down to `require` calls. The exact syntax will depend on the
[`importInterop` setting](https://babeljs.io/docs/babel-plugin-transform-modules-commonjs#importinterop).
```js @nolint @ts-nocheck title='@babel/plugin-transform-modules-commonjs'
import foo from "foo";
import { bar } from "bar";
foo;
bar;
// with "importInterop: node", compiles to ...
"use strict";
var _foo = require("foo");
var _bar = require("bar");
_foo;
_bar.bar;
```
</details>
These CommonJS calls load module code synchronously. If you are migrating transpiled CJS code
to native ESM, be careful about the timing differences between CJS and ESM.
:::
## Renderer process
Electron's renderer processes run in a Chromium context and will use Chromium's ESM loader.
In practice, this means that `import` statements:
- will not have access to Node.js built-in modules
- will not be able to load npm packages from `node_modules`
```html
<script type="module">
import { exists } from 'node:fs' // ❌ will not work!
</script>
```
If you wish to load JavaScript packages via npm directly into the renderer process, we recommend
using a bundler such as webpack or Vite to compile your code for client-side consumption.
## Preload scripts
A renderer's preload script will use the Node.js ESM loader _when available_.
ESM availability will depend on the values of its renderer's `sandbox` and `contextIsolation`
preferences, and comes with a few other caveats due to the asynchronous nature of ESM loading.
### Caveats
#### ESM preload scripts must have the `.mjs` extension
Preload scripts will ignore `"type": "module"` fields, so you _must_ use the `.mjs` file
extension in your ESM preload scripts.
#### Sandboxed preload scripts can't use ESM imports
Sandboxed preload scripts are run as plain JavaScript without an ESM context. If you need to
use external modules, we recommend using a bundler for your preload code. Loading the
`electron` API is still done via `require('electron')`.
For more information on sandboxing, see the [Process Sandboxing](./sandbox.md) docs.
#### Unsandboxed ESM preload scripts will run after page load on pages with no content
If the response body for a renderer's loaded page is _completely_ empty (i.e. `Content-Length: 0`),
its preload script will not block the page load, which may result in race conditions.
If this impacts you, change your response body to have _something_ in it
(e.g. an empty `html` tag (`<html></html>`)) or swap back to using a CommonJS preload script
(`.js` or `.cjs`), which will block the page load.
### ESM preload scripts must be context isolated to use dynamic Node.js ESM imports
If your unsandboxed renderer process does not have the `contextIsolation` flag enabled,
you cannot dynamically `import()` files via Node's ESM loader.
```js @ts-nocheck title='preload.mjs'
// ❌ these won't work without context isolation
const fs = await import('node:fs')
await import('./foo')
```
This is because Chromium's dynamic ESM `import()` function usually takes precedence in the
renderer process and without context isolation, there is no way of knowing if Node.js is available
in a dynamic import statement. If you enable context isolation, `import()` statements
from the renderer's isolated preload context can be routed to the Node.js module loader.

View File

@@ -16,7 +16,16 @@ 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]

View File

@@ -61,36 +61,6 @@ The onlyLoadAppFromAsar fuse changes the search system that Electron uses to loc
The loadBrowserProcessSpecificV8Snapshot fuse changes which V8 snapshot file is used for the browser process. By default Electron's processes will all use the same V8 snapshot file. When this fuse is enabled the browser process uses the file called `browser_v8_context_snapshot.bin` for its V8 snapshot. The other processes will use the V8 snapshot file that they normally do.
### `grantFileProtocolExtraPrivileges`
**Default:** Enabled
**@electron/fuses:** `FuseV1Options.GrantFileProtocolExtraPrivileges`
The grantFileProtocolExtraPrivileges fuse changes whether pages loaded from the `file://` protocol are given privileges beyond what they would receive in a traditional web browser. This behavior was core to Electron apps in original versions of Electron but is no longer required as apps should be [serving local files from custom protocols](./security.md#18-avoid-usage-of-the-file-protocol-and-prefer-usage-of-custom-protocols) now instead. If you aren't serving pages from `file://` you should disable this fuse.
The extra privileges granted to the `file://` protocol by this fuse are incompletely documented below:
* `file://` protocol pages can use `fetch` to load other assets over `file://`
* `file://` protocol pages can use service workers
* `file://` protocol pages have universal access granted to child frames also running on `file://` protocols regardless of sandbox settings
### `sameSiteStorageAPI`
**Default:** Disabled
**@electron/fuses:** `FuseV1Options.EnableSameSiteStorageAPI`
This {better-name} fuse changes how {top-level site, requested origin} pair permissions are granted.
When this fuse is enabled, we request permission via the permissions API. This would allow implementation-defined acceptance or rejection steps, inherited from Chrome; if any are triggered, reject the requestStorageAccessFor call or skip to the permission-saving step. If acceptance is returned, save a permission for the pair {top-level site, requested origin}. Note that the permission would be separate from the permission granted by requestStorageAccess.
See more information here: https://github.com/privacycg/requestStorageAccessFor?tab=readme-ov-file#proposed-draft-spec-addition
At request time, if the request is cross-site and the appropriate permission for {top-level site, requested origin} exists, attach cookies only if all of the below checks are met:
1. The request is made by the top-level frame and is for a subresource on the requested origin (i.e., not a navigation), and the request is CORS-enabled. In other words, a plain <img> or <script> without the appropriate crossorigin attribute would not have cross-site SameSite=None cookies attached, regardless of whether access had been granted. Similarly, a fetch or XHR request would omit cross-site SameSite=None cookies unless CORS was enabled. This is recommended in a recent security analysis.
2. The cookies to be included must be marked SameSite=None. In other words, the cookies must have been explicitly opted in by the requested domain. Cookies with any other SameSite option are ignored and not sent, regardless of whether a grant exists.
- This specific behavior is what we want to change
3. NOTE: requests from <iframe> elements would need to invoke and be granted requestStorageAccess for SameSite=None cookies to be sent. This ensures the per-frame semantics of requestStorageAccess are respected.
## How do I flip the fuses?
### The easy way

View File

@@ -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.
```js
```javascript
// Main process
const { inAppPurchase } = require('electron')
const PRODUCT_IDS = ['id1', 'id2']

View File

@@ -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:
```js @ts-nocheck
```javascript @ts-nocheck
url = ELECTRON_MIRROR + ELECTRON_CUSTOM_DIR + '/' + ELECTRON_CUSTOM_FILENAME
```
@@ -91,9 +91,9 @@ The above configuration will download from URLs such as
`https://npmmirror.com/mirrors/electron/8.0.0/electron-v8.0.0-linux-x64.zip`.
If your mirror serves artifacts with different checksums to the official
Electron release you may have to set `electron_use_remote_checksums=1` directly,
or configure it in a `.npmrc` file, to force Electron to use the remote `SHASUMS256.txt`
file to verify the checksum instead of the embedded checksums.
Electron release you may have to set `electron_use_remote_checksums=1` to
force Electron to use the remote `SHASUMS256.txt` file to verify the checksum
instead of the embedded checksums.
#### Cache

View File

@@ -50,7 +50,7 @@ sections.
In the main process, set an IPC listener on the `set-title` channel with the `ipcMain.on` API:
```js {6-10,22} title='main.js (Main Process)'
```javascript {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.
```js title='preload.js (Preload Script)'
```javascript 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:
```js title='renderer.js (Renderer Process)' @ts-expect-error=[4,5]
```javascript 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.
:::
```js {6-13,25} title='main.js (Main Process)'
```javascript {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.
```js title='preload.js (Preload Script)'
```javascript 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:
```js title='renderer.js (Renderer Process)' @ts-expect-error=[5]
```javascript title='renderer.js (Renderer Process)' @ts-expect-error=[5]
const btn = document.getElementById('btn')
const filePathElement = document.getElementById('filePath')
@@ -280,8 +280,8 @@ selected file path in the `#filePath` element.
### Note: legacy approaches
The `ipcRenderer.invoke` API was added in Electron 7 as a developer-friendly way to tackle two-way
IPC from the renderer process. However, a couple of alternative approaches to this IPC pattern
exist.
IPC from the renderer process. However, there exist a couple alternative approaches to this IPC
pattern.
:::warning Avoid legacy approaches if possible
We recommend using `ipcRenderer.invoke` whenever possible. The following two-way renderer-to-main
@@ -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.
```js title='preload.js (Preload Script)'
```javascript 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')
```
```js title='main.js (Main Process)'
```javascript 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.
```js title='main.js (Main Process)'
```javascript 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) => {
})
```
```js title='preload.js (Preload Script)'
```javascript 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.
```js {11-26} title='main.js (Main Process)'
```javascript {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.
```js @ts-type={mainWindow:Electron.BrowserWindow}
```javascript @ts-type={mainWindow:Electron.BrowserWindow}
click: () => mainWindow.webContents.send('update-counter', -1)
```
@@ -425,11 +425,11 @@ 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:
```js title='preload.js (Preload Script)'
```javascript title='preload.js (Preload Script)'
const { contextBridge, ipcRenderer } = require('electron')
contextBridge.exposeInMainWorld('electronAPI', {
onUpdateCounter: (callback) => ipcRenderer.on('update-counter', (_event, value) => callback(value))
onUpdateCounter: (callback) => ipcRenderer.on('update-counter', callback)
})
```
@@ -439,15 +439,13 @@ After loading the preload script, your renderer process should have access to th
:::caution Security warning
We don't directly expose the whole `ipcRenderer.on` API for [security reasons][]. Make sure to
limit the renderer's access to Electron APIs as much as possible.
Also don't just pass the callback to `ipcRenderer.on` as this will leak `ipcRenderer` via `event.sender`.
Use a custom handler that invoke the `callback` only with the desired arguments.
:::
:::info
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.
```js title='preload.js (Preload Script)'
```javascript title='preload.js (Preload Script)'
const { ipcRenderer } = require('electron')
window.addEventListener('DOMContentLoaded', () => {
@@ -488,10 +486,10 @@ 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.
```js title='renderer.js (Renderer Process)' @ts-window-type={electronAPI:{onUpdateCounter:(callback:(value:number)=>void)=>void}}
```javascript 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((value) => {
window.electronAPI.onUpdateCounter((_event, value) => {
const oldValue = Number(counter.innerText)
const newValue = oldValue + value
counter.innerText = newValue.toString()
@@ -508,32 +506,23 @@ There's no equivalent for `ipcRenderer.invoke` for main-to-renderer IPC. Instead
send a reply back to the main process from within the `ipcRenderer.on` callback.
We can demonstrate this with slight modifications to the code from the previous example. In the
renderer process, expose another API to send a reply back to the main process through the
renderer process, use the `event` parameter to send a reply back to the main process through the
`counter-value` channel.
```js title='preload.js (Preload Script)'
const { contextBridge, ipcRenderer } = require('electron')
contextBridge.exposeInMainWorld('electronAPI', {
onUpdateCounter: (callback) => ipcRenderer.on('update-counter', (_event, value) => callback(value)),
counterValue: (value) => ipcRenderer.send('counter-value', value)
})
```
```js title='renderer.js (Renderer Process)' @ts-window-type={electronAPI:{onUpdateCounter:(callback:(value:number)=>void)=>void,counterValue:(value:number)=>void}}
```javascript 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((value) => {
window.electronAPI.onUpdateCounter((event, value) => {
const oldValue = Number(counter.innerText)
const newValue = oldValue + value
counter.innerText = newValue.toString()
window.electronAPI.counterValue(newValue)
event.sender.send('counter-value', newValue)
})
```
In the main process, listen for `counter-value` events and handle them appropriately.
```js title='main.js (Main Process)'
```javascript title='main.js (Main Process)'
// ...
ipcMain.on('counter-value', (_event, value) => {
console.log(value) // will print value to Node console

View File

@@ -14,19 +14,11 @@ 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` to be:
[Quick Start Guide](quick-start.md), update the `main.js` file with the
following lines:
```fiddle docs/fiddles/features/keyboard-shortcuts/local
const { app, BrowserWindow, Menu, MenuItem } = require('electron/main')
function createWindow () {
const win = new BrowserWindow({
width: 800,
height: 600
})
win.loadFile('index.html')
}
```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/local'
const { Menu, MenuItem } = require('electron')
const menu = new Menu()
menu.append(new MenuItem({
@@ -39,20 +31,6 @@ 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
@@ -75,37 +53,17 @@ 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` to be:
[Quick Start Guide](quick-start.md), update the `main.js` file with the
following lines:
```fiddle docs/fiddles/features/keyboard-shortcuts/global
const { app, BrowserWindow, globalShortcut } = require('electron/main')
function createWindow () {
const win = new BrowserWindow({
width: 800,
height: 600
})
win.loadFile('index.html')
}
```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/global' @ts-type={createWindow:()=>void}
const { app, globalShortcut } = require('electron')
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`
@@ -123,8 +81,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].
```fiddle docs/fiddles/features/keyboard-shortcuts/web-apis|focus=renderer.js
function handleKeyPress (event) {
```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/web-apis|focus=renderer.js'
const handleKeyPress = (event) => {
// You can put code here to handle the keypress.
document.getElementById('last-keypress').innerText = event.key
console.log(`You pressed ${event.key}`)
@@ -147,8 +105,8 @@ Starting with a working application from the
[Quick Start Guide](quick-start.md), update the `main.js` file with the
following lines:
```fiddle docs/fiddles/features/keyboard-shortcuts/interception-from-main
const { app, BrowserWindow } = require('electron/main')
```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/interception-from-main'
const { app, BrowserWindow } = require('electron')
app.whenReady().then(() => {
const win = new BrowserWindow({ width: 800, height: 600 })

Some files were not shown because too many files have changed in this diff Show More