mirror of
https://github.com/electron/electron.git
synced 2026-04-10 03:01:51 -04:00
Compare commits
289 Commits
v13.0.0
...
v14.0.0-ni
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
7c398062dd | ||
|
|
7584ca16c1 | ||
|
|
2ceae36766 | ||
|
|
7cf1f8d11c | ||
|
|
9afae17380 | ||
|
|
7884f52976 | ||
|
|
79f67417f0 | ||
|
|
82b0d67d70 | ||
|
|
5d15cec0fd | ||
|
|
a76b53348c | ||
|
|
cce73c3b8d | ||
|
|
08c4b0ab61 | ||
|
|
a1386dc19b | ||
|
|
ae0de8ef9f | ||
|
|
7c32deb70f | ||
|
|
dc7fa1d9f1 | ||
|
|
1c57e078aa | ||
|
|
33bbdcf1de | ||
|
|
be3c2fd0af | ||
|
|
d2654c652a | ||
|
|
583660a85a | ||
|
|
28904714ae | ||
|
|
43d27cc4d1 | ||
|
|
93311c8686 | ||
|
|
362e8421d6 | ||
|
|
13f36d54cf | ||
|
|
79077f6df9 | ||
|
|
4ca518468d | ||
|
|
c4931ff70e | ||
|
|
503d24a473 | ||
|
|
7063b5ef2c | ||
|
|
11199d8824 | ||
|
|
69f3e330e7 | ||
|
|
6ee819aa65 | ||
|
|
4f3664e6d9 | ||
|
|
e12a3cb59c | ||
|
|
8164322195 | ||
|
|
400d7c4bce | ||
|
|
ac9ec1a6ea | ||
|
|
6327a5a4a2 | ||
|
|
99fc054ce9 | ||
|
|
0d7fd7a74f | ||
|
|
b8c2481edb | ||
|
|
484931bba2 | ||
|
|
a354c95d4c | ||
|
|
e12128b65b | ||
|
|
22a70eb803 | ||
|
|
9236e56ddc | ||
|
|
5ee906fd04 | ||
|
|
20801573aa | ||
|
|
e37533b73a | ||
|
|
f8bdef5349 | ||
|
|
dba4df9326 | ||
|
|
b6315612dd | ||
|
|
f78f8d15a9 | ||
|
|
6df2680cb6 | ||
|
|
e775467e9c | ||
|
|
2e9ed50bb0 | ||
|
|
6bd13cc98f | ||
|
|
ef4954fa1f | ||
|
|
f755c521eb | ||
|
|
95e26e2fd4 | ||
|
|
6772e7773e | ||
|
|
17f527f757 | ||
|
|
f73d09374e | ||
|
|
da8c35e3b2 | ||
|
|
c428ec5cd5 | ||
|
|
16b0d1fbdd | ||
|
|
3a569c176a | ||
|
|
14834f35df | ||
|
|
968b30c9b4 | ||
|
|
17a44895dd | ||
|
|
00fa60ef76 | ||
|
|
2865d161b7 | ||
|
|
7d04f729d8 | ||
|
|
e454bded3c | ||
|
|
fe0da255b6 | ||
|
|
63317627b5 | ||
|
|
77dcf1020a | ||
|
|
641e9337f3 | ||
|
|
0c2150a6fa | ||
|
|
62b38812b6 | ||
|
|
3ed8da0931 | ||
|
|
e2f49edf83 | ||
|
|
1fcd6e2740 | ||
|
|
19d7a6b761 | ||
|
|
82ea8ea68c | ||
|
|
c280d770dc | ||
|
|
29603bcc27 | ||
|
|
55c66e3e92 | ||
|
|
9904438118 | ||
|
|
e6aefed0ee | ||
|
|
fa65faa4b0 | ||
|
|
e323bfe661 | ||
|
|
976222b509 | ||
|
|
2a55ae4b85 | ||
|
|
05d164e660 | ||
|
|
ba3b2189ad | ||
|
|
bdeeabdc3c | ||
|
|
f55aa78883 | ||
|
|
52262a9db0 | ||
|
|
5fe07e1e23 | ||
|
|
b9ea4a6ba4 | ||
|
|
a006cf681b | ||
|
|
9684d85101 | ||
|
|
1594c54933 | ||
|
|
9127cff58b | ||
|
|
0f3620099a | ||
|
|
6016e244fa | ||
|
|
54e72fa8e3 | ||
|
|
5d13820441 | ||
|
|
c9217f07e6 | ||
|
|
9fecf8369f | ||
|
|
9a7cfc42aa | ||
|
|
1f575ca3af | ||
|
|
b6254bfd36 | ||
|
|
ae2059eaa1 | ||
|
|
ff96fabe5e | ||
|
|
3122820e58 | ||
|
|
01ca00ec82 | ||
|
|
606fd87d1e | ||
|
|
5be2183dd7 | ||
|
|
2632564ccf | ||
|
|
521146f71e | ||
|
|
dd975328a0 | ||
|
|
fb4e99e729 | ||
|
|
77365e701f | ||
|
|
1453a8e743 | ||
|
|
b9b734c9c4 | ||
|
|
6fbd84fc80 | ||
|
|
7918ddb026 | ||
|
|
89df6b98da | ||
|
|
640a145112 | ||
|
|
aaf03765ed | ||
|
|
7f7b1f6c8a | ||
|
|
d874a59056 | ||
|
|
4f97b9303c | ||
|
|
83d93bcbdc | ||
|
|
d93690ccdc | ||
|
|
3d2b740d9e | ||
|
|
39e3576c48 | ||
|
|
61cf1abd4d | ||
|
|
1e9e2f8cf6 | ||
|
|
7c36463085 | ||
|
|
6a0b03ba6a | ||
|
|
94af0e8bb0 | ||
|
|
5b598037bb | ||
|
|
ea62ecd188 | ||
|
|
665ac6f9c8 | ||
|
|
74318705c2 | ||
|
|
205f572181 | ||
|
|
451e0931bf | ||
|
|
deeb2de14b | ||
|
|
d10398610b | ||
|
|
e99893df22 | ||
|
|
fa320eeb90 | ||
|
|
96ce59609d | ||
|
|
703f8707db | ||
|
|
8c3165434a | ||
|
|
c8d18a0a1c | ||
|
|
db7059eb0a | ||
|
|
a79ef2d525 | ||
|
|
79bcb882ac | ||
|
|
a68d43ce8b | ||
|
|
502d4c19ce | ||
|
|
f35fc93080 | ||
|
|
4057e6b56e | ||
|
|
b52ccc9726 | ||
|
|
8476bed36e | ||
|
|
2d3c65beca | ||
|
|
3b183854ff | ||
|
|
baadcd48df | ||
|
|
14acf00ba9 | ||
|
|
fc7f2042ec | ||
|
|
485fa5bea9 | ||
|
|
08330cb079 | ||
|
|
54bc21929a | ||
|
|
bccafa0289 | ||
|
|
b6ff12ef7f | ||
|
|
80f89a3472 | ||
|
|
c49bc282d5 | ||
|
|
7e961d8a37 | ||
|
|
b6d2ae0455 | ||
|
|
97b6868e9c | ||
|
|
29dfabadfd | ||
|
|
d0989802bd | ||
|
|
ec893f8322 | ||
|
|
22d8f22cfb | ||
|
|
86d23cee40 | ||
|
|
29dc5a2f83 | ||
|
|
3160e608e2 | ||
|
|
f1bb6be4b9 | ||
|
|
2cd53eb46a | ||
|
|
5fc298ee5f | ||
|
|
d54bee03d0 | ||
|
|
4a6bc7a42f | ||
|
|
3010dd93e3 | ||
|
|
88bbe2a352 | ||
|
|
185c343b22 | ||
|
|
b15b820bca | ||
|
|
9f5e3f6685 | ||
|
|
003dd6c16c | ||
|
|
fdc2e2bc57 | ||
|
|
b045d42b0e | ||
|
|
76538d2d38 | ||
|
|
676f74f3dc | ||
|
|
08036802cb | ||
|
|
9e336f5d0c | ||
|
|
d4bec23bde | ||
|
|
d0e88c2476 | ||
|
|
fae4d87a5a | ||
|
|
57a8781c01 | ||
|
|
8f4e362d8f | ||
|
|
d27ad0d182 | ||
|
|
1e16606524 | ||
|
|
b023b33c05 | ||
|
|
45c4dd529f | ||
|
|
41fdf450b2 | ||
|
|
8dfe4abd14 | ||
|
|
f933c249fe | ||
|
|
5e7ae59d29 | ||
|
|
f73256651b | ||
|
|
a442f11574 | ||
|
|
b8926cb4e8 | ||
|
|
b7eb521cec | ||
|
|
ab74cf4e1a | ||
|
|
8d38e9dd54 | ||
|
|
4d1d6c8a3a | ||
|
|
40d779a7f3 | ||
|
|
6bce814736 | ||
|
|
5b710519cf | ||
|
|
6c90411e21 | ||
|
|
74e7f98572 | ||
|
|
8badc6583f | ||
|
|
35cafdd1d8 | ||
|
|
089ac8180f | ||
|
|
102a3740ea | ||
|
|
32ec7e1e21 | ||
|
|
73d0a16ae2 | ||
|
|
5df13e7c8a | ||
|
|
8c6027c519 | ||
|
|
5b205731f6 | ||
|
|
d274df7e3a | ||
|
|
aadf2f4a7c | ||
|
|
d9997c303f | ||
|
|
ab943d78b2 | ||
|
|
f6949dd197 | ||
|
|
e27b7ed248 | ||
|
|
41b5cd1a84 | ||
|
|
7e22523ed2 | ||
|
|
3270613bf7 | ||
|
|
0505beb43d | ||
|
|
8949b8a462 | ||
|
|
5b50c88508 | ||
|
|
9ccb8f5910 | ||
|
|
46cfb347d7 | ||
|
|
ee0ab6f392 | ||
|
|
f4e1a343b9 | ||
|
|
b3a0743121 | ||
|
|
b36292780f | ||
|
|
e99e6a5a8a | ||
|
|
54cc68dd7a | ||
|
|
59432fe30a | ||
|
|
f51f427646 | ||
|
|
4e02d9407a | ||
|
|
77ad17b383 | ||
|
|
be627568b2 | ||
|
|
59669e99cb | ||
|
|
dc36e8e6fc | ||
|
|
1a296e59c2 | ||
|
|
0d94e0d1d9 | ||
|
|
2fed02556d | ||
|
|
eccfa516c5 | ||
|
|
f114dcfd6e | ||
|
|
54bc71da34 | ||
|
|
afb7d9f550 | ||
|
|
d92bab0e29 | ||
|
|
e900271bea | ||
|
|
87df2766ba | ||
|
|
c8148febfa | ||
|
|
e715b9c921 | ||
|
|
55e50a0879 | ||
|
|
b820b4078d | ||
|
|
5defd96ecd | ||
|
|
ca75bca667 | ||
|
|
0b042d3b1c | ||
|
|
9b93750e5e | ||
|
|
6e121d2250 | ||
|
|
2e091d401e |
@@ -92,11 +92,6 @@ machine-mac-large: &machine-mac-large
|
||||
macos:
|
||||
xcode: "12.4.0"
|
||||
|
||||
machine-mac-large-arm: &machine-mac-large-arm
|
||||
resource_class: large
|
||||
macos:
|
||||
xcode: "12.4.0"
|
||||
|
||||
machine-mac-arm64: &machine-mac-arm64
|
||||
resource_class: electronjs/macos-arm64
|
||||
machine: true
|
||||
@@ -278,7 +273,7 @@ step-gclient-sync: &step-gclient-sync
|
||||
if ! git diff-index --quiet HEAD --; then
|
||||
# There are changes to the patches. Make a git commit with the updated patches
|
||||
git add patches
|
||||
GIT_COMMITTER_NAME="PatchUp" GIT_COMMITTER_EMAIL="73610968+patchup[bot]@users.noreply.github.com" git commit -m "chore: update patches" --author="PatchUp <73610968+patchup[bot]@users.noreply.github.com>"
|
||||
GIT_COMMITTER_NAME="Electron Bot" GIT_COMMITTER_EMAIL="electron@github.com" git commit -m "update patches" --author="Electron Bot <electron@github.com>"
|
||||
# Export it
|
||||
mkdir -p ../../patches
|
||||
git format-patch -1 --stdout --keep-subject --no-stat --full-index > ../../patches/update-patches.patch
|
||||
@@ -505,7 +500,6 @@ step-gn-check: &step-gn-check
|
||||
gn check out/Default //electron/shell/common/api:mojo
|
||||
# Check the hunspell filenames
|
||||
node electron/script/gen-hunspell-filenames.js --check
|
||||
node electron/script/gen-libc++-filenames.js --check
|
||||
|
||||
step-electron-build: &step-electron-build
|
||||
run:
|
||||
@@ -688,11 +682,6 @@ step-persist-data-for-tests: &step-persist-data-for-tests
|
||||
- src/third_party/electron_node
|
||||
- src/third_party/nan
|
||||
- src/cross-arch-snapshots
|
||||
- src/third_party/llvm-build
|
||||
- src/build/linux
|
||||
- src/buildtools/third_party/libc++
|
||||
- src/buildtools/third_party/libc++abi
|
||||
- src/out/Default/obj/buildtools/third_party
|
||||
|
||||
step-electron-dist-unzip: &step-electron-dist-unzip
|
||||
run:
|
||||
@@ -843,17 +832,6 @@ step-hunspell-store: &step-hunspell-store
|
||||
path: src/out/Default/hunspell_dictionaries.zip
|
||||
destination: hunspell_dictionaries.zip
|
||||
|
||||
step-maybe-generate-libcxx: &step-maybe-generate-libcxx
|
||||
run:
|
||||
name: maybe generate libcxx
|
||||
command: |
|
||||
cd src
|
||||
if [ "`uname`" == "Linux" ]; then
|
||||
ninja -C out/Default electron:libcxx_headers_zip -j $NUMBER_OF_NINJA_PROCESSES
|
||||
ninja -C out/Default electron:libcxxabi_headers_zip -j $NUMBER_OF_NINJA_PROCESSES
|
||||
ninja -C out/Default electron:libcxx_objects_zip -j $NUMBER_OF_NINJA_PROCESSES
|
||||
fi
|
||||
|
||||
step-maybe-generate-breakpad-symbols: &step-maybe-generate-breakpad-symbols
|
||||
run:
|
||||
name: Generate breakpad symbols
|
||||
@@ -952,7 +930,7 @@ step-ninja-summary: &step-ninja-summary
|
||||
command: |
|
||||
set +e
|
||||
set +o pipefail
|
||||
python depot_tools/post_build_ninja_summary.py -C src/out/Default
|
||||
python depot_tools/post_build_ninja_summary.py -C src/out/Default || echo Ninja Summary Failed
|
||||
|
||||
step-ninja-report: &step-ninja-report
|
||||
store_artifacts:
|
||||
@@ -1704,9 +1682,6 @@ commands:
|
||||
- *step-hunspell-build
|
||||
- *step-hunspell-store
|
||||
|
||||
# libcxx
|
||||
- *step-maybe-generate-libcxx
|
||||
|
||||
# typescript defs
|
||||
- *step-maybe-generate-typescript-defs
|
||||
|
||||
@@ -2141,7 +2116,7 @@ jobs:
|
||||
checkout: true
|
||||
|
||||
osx-publish-arm64:
|
||||
<<: *machine-mac-large-arm
|
||||
<<: *machine-mac-large
|
||||
environment:
|
||||
<<: *env-mac-large-release
|
||||
<<: *env-release-build
|
||||
@@ -2166,7 +2141,7 @@ jobs:
|
||||
checkout: false
|
||||
|
||||
osx-publish-arm64-skip-checkout:
|
||||
<<: *machine-mac-large-arm
|
||||
<<: *machine-mac-large
|
||||
environment:
|
||||
<<: *env-mac-large-release
|
||||
<<: *env-release-build
|
||||
@@ -2179,7 +2154,7 @@ jobs:
|
||||
checkout: false
|
||||
|
||||
osx-testing-arm64:
|
||||
<<: *machine-mac-large-arm
|
||||
<<: *machine-mac-large
|
||||
environment:
|
||||
<<: *env-mac-large
|
||||
<<: *env-testing-build
|
||||
@@ -2248,7 +2223,7 @@ jobs:
|
||||
checkout: true
|
||||
|
||||
mas-publish-arm64:
|
||||
<<: *machine-mac-large-arm
|
||||
<<: *machine-mac-large
|
||||
environment:
|
||||
<<: *env-mac-large-release
|
||||
<<: *env-mas-apple-silicon
|
||||
@@ -2273,7 +2248,7 @@ jobs:
|
||||
checkout: false
|
||||
|
||||
mas-publish-arm64-skip-checkout:
|
||||
<<: *machine-mac-large-arm
|
||||
<<: *machine-mac-large
|
||||
environment:
|
||||
<<: *env-mac-large-release
|
||||
<<: *env-mas-apple-silicon
|
||||
@@ -2286,7 +2261,7 @@ jobs:
|
||||
checkout: false
|
||||
|
||||
mas-testing-arm64:
|
||||
<<: *machine-mac-large-arm
|
||||
<<: *machine-mac-large
|
||||
environment:
|
||||
<<: *env-mac-large
|
||||
<<: *env-testing-build
|
||||
@@ -2632,19 +2607,15 @@ workflows:
|
||||
- osx-publish-x64-skip-checkout:
|
||||
requires:
|
||||
- mac-checkout
|
||||
context: release-env
|
||||
- mas-publish-x64-skip-checkout:
|
||||
requires:
|
||||
- mac-checkout
|
||||
context: release-env
|
||||
- osx-publish-arm64-skip-checkout:
|
||||
requires:
|
||||
- mac-checkout
|
||||
context: release-env
|
||||
- mas-publish-arm64-skip-checkout:
|
||||
requires:
|
||||
- mac-checkout
|
||||
context: release-env
|
||||
|
||||
lint:
|
||||
when: << pipeline.parameters.run-lint >>
|
||||
|
||||
6
.github/CODEOWNERS
vendored
6
.github/CODEOWNERS
vendored
@@ -13,9 +13,3 @@ DEPS @electron/wg-upgrades
|
||||
|
||||
# Security WG
|
||||
/lib/browser/rpc-server.ts @electron/wg-security
|
||||
|
||||
# Remote Change Disliker
|
||||
/lib/browser/remote/ @nornagon
|
||||
/lib/renderer/remote/ @nornagon
|
||||
/lib/renderer/api/remote.ts @nornagon
|
||||
/docs/api/remote.md @nornagon
|
||||
|
||||
58
.github/ISSUE_TEMPLATE/Bug_report.md
vendored
58
.github/ISSUE_TEMPLATE/Bug_report.md
vendored
@@ -1,58 +0,0 @@
|
||||
---
|
||||
name: Bug report
|
||||
about: Create a report to help us improve Electron
|
||||
|
||||
---
|
||||
|
||||
<!-- As an open source project with a dedicated but small maintainer team, it can sometimes take a long time for issues to be addressed so please be patient and we will get back to you as soon as we can.
|
||||
-->
|
||||
|
||||
### Preflight Checklist
|
||||
<!-- Please ensure you've completed the following steps by replacing [ ] with [x]-->
|
||||
|
||||
* [ ] I have read the [Contributing Guidelines](https://github.com/electron/electron/blob/master/CONTRIBUTING.md) for this project.
|
||||
* [ ] I agree to follow the [Code of Conduct](https://github.com/electron/electron/blob/master/CODE_OF_CONDUCT.md) that this project adheres to.
|
||||
* [ ] I have searched the issue tracker for an issue that matches the one I want to file, without success.
|
||||
|
||||
### Issue Details
|
||||
|
||||
* **Electron Version:**
|
||||
* <!-- (output of `node_modules/.bin/electron --version`) e.g. 4.0.3 -->
|
||||
* **Operating System:**
|
||||
* <!-- (Platform and Version) e.g. macOS 10.13.6 / Windows 10 (1803) / Ubuntu 18.04 x64 -->
|
||||
* **Last Known Working Electron version:**
|
||||
* <!-- (if applicable) e.g. 3.1.0 -->
|
||||
|
||||
### Expected Behavior
|
||||
<!-- A clear and concise description of what you expected to happen. -->
|
||||
|
||||
### Actual Behavior
|
||||
<!-- A clear and concise description of what actually happened. -->
|
||||
|
||||
### To Reproduce
|
||||
<!--
|
||||
Your best chance of getting this bug looked at quickly is to provide an example.
|
||||
-->
|
||||
|
||||
<!--
|
||||
For bugs that can be encapsulated in a small experiment, you can use Electron Fiddle (https://github.com/electron/fiddle) to publish your example to a GitHub Gist and link it your bug report.
|
||||
-->
|
||||
|
||||
<!--
|
||||
If Fiddle is insufficient to produce an example, please provide an example REPOSITORY that can be cloned and run. You can fork electron-quick-start (https://github.com/electron/electron-quick-start) and include a link to the branch with your changes.
|
||||
-->
|
||||
|
||||
<!--
|
||||
If you provide a URL, please list the commands required to clone/setup/run your repo e.g.
|
||||
```sh
|
||||
$ git clone $YOUR_URL -b $BRANCH
|
||||
$ npm install
|
||||
$ npm start || electron .
|
||||
```
|
||||
-->
|
||||
|
||||
### Screenshots
|
||||
<!-- If applicable, add screenshots to help explain your problem. -->
|
||||
|
||||
### Additional Information
|
||||
<!-- Add any other context about the problem here. -->
|
||||
77
.github/ISSUE_TEMPLATE/bug_report.yml
vendored
Normal file
77
.github/ISSUE_TEMPLATE/bug_report.yml
vendored
Normal file
@@ -0,0 +1,77 @@
|
||||
name: Bug Report
|
||||
description: Report an Electron bug
|
||||
title: "[Bug]: "
|
||||
labels: "bug :beetle:"
|
||||
body:
|
||||
- type: checkboxes
|
||||
attributes:
|
||||
label: Preflight Checklist
|
||||
description: Please ensure you've completed all of the following.
|
||||
options:
|
||||
- label: I have read the [Contributing Guidelines](https://github.com/electron/electron/blob/master/CONTRIBUTING.md) for this project.
|
||||
required: true
|
||||
- label: I agree to follow the [Code of Conduct](https://github.com/electron/electron/blob/master/CODE_OF_CONDUCT.md) that this project adheres to.
|
||||
required: true
|
||||
- label: I have searched the [issue tracker](https://www.github.com/electron/electron/issues) for a feature request that matches the one I want to file, without success.
|
||||
required: true
|
||||
- type: input
|
||||
attributes:
|
||||
label: Electron Version
|
||||
description: What version of Electron are you using?
|
||||
placeholder: 12.0.0
|
||||
validations:
|
||||
required: true
|
||||
- type: dropdown
|
||||
attributes:
|
||||
label: What operating system are you using?
|
||||
options:
|
||||
- Windows
|
||||
- macOS
|
||||
- Ubuntu
|
||||
- Other Linux
|
||||
- Other (specify below)
|
||||
validations:
|
||||
required: true
|
||||
- type: input
|
||||
attributes:
|
||||
label: Operating System Version
|
||||
description: What operating system version are you using? On Windows, click Start button > Settings > System > About. On macOS, click the Apple Menu > About This Mac. On Linux, use lsb_release or uname -a.
|
||||
placeholder: "e.g. Windows 10 version 1909, macOS Catalina 10.15.7, or Ubuntu 20.04"
|
||||
validations:
|
||||
required: true
|
||||
- type: dropdown
|
||||
attributes:
|
||||
label: What arch are you using?
|
||||
options:
|
||||
- x64
|
||||
- ia32
|
||||
- arm64 (including Apple Silicon)
|
||||
- Other (specify below)
|
||||
validations:
|
||||
required: true
|
||||
- type: input
|
||||
attributes:
|
||||
label: Last Known Working Electron version
|
||||
description: What is the last version of Electron this worked in, if applicable?
|
||||
placeholder: 11.0.0
|
||||
- type: textarea
|
||||
attributes:
|
||||
label: Expected Behavior
|
||||
description: A clear and concise description of what you expected to happen.
|
||||
validations:
|
||||
required: true
|
||||
- type: textarea
|
||||
attributes:
|
||||
label: Actual Behavior
|
||||
description: A clear description of what actually happens.
|
||||
validations:
|
||||
required: true
|
||||
- type: input
|
||||
attributes:
|
||||
label: Testcase Gist URL
|
||||
description: If you can reproduce the issue in a standalone test case, please use [Electron Fiddle](https://github.com/electron/fiddle) to create one and to publish it as a [GitHub gist](https://gist.github.com) and put the gist URL here. This is **the best way** to ensure this issue is triaged quickly.
|
||||
placeholder: https://gist.github.com/...
|
||||
- type: textarea
|
||||
attributes:
|
||||
label: Additional Information
|
||||
description: If your problem needs further explanation, or if the issue you're seeing cannot be reproduced in a gist, please add more information here.
|
||||
21
.github/ISSUE_TEMPLATE/feature_request.yml
vendored
21
.github/ISSUE_TEMPLATE/feature_request.yml
vendored
@@ -1,18 +1,19 @@
|
||||
name: Feature Request
|
||||
about: Suggest an idea for Electron
|
||||
description: Suggest an idea for Electron
|
||||
title: "[Feature Request]: "
|
||||
labels: "enhancement ✨"
|
||||
labels: "enhancement :sparkles:"
|
||||
body:
|
||||
- type: textarea
|
||||
- type: checkboxes
|
||||
attributes:
|
||||
label: Preflight Checklist
|
||||
description: Please ensure you've completed the following steps by replacing [ ] with [x]
|
||||
value: |
|
||||
* [ ] I have read the [Contributing Guidelines](https://github.com/electron/electron/blob/master/CONTRIBUTING.md) for this project.
|
||||
* [ ] I agree to follow the [Code of Conduct](https://github.com/electron/electron/blob/master/CODE_OF_CONDUCT.md) that this project adheres to.
|
||||
* [ ] I have searched the issue tracker for a feature request that matches the one I want to file, without success.
|
||||
validations:
|
||||
required: true
|
||||
description: Please ensure you've completed all of the following.
|
||||
options:
|
||||
- label: I have read the [Contributing Guidelines](https://github.com/electron/electron/blob/master/CONTRIBUTING.md) for this project.
|
||||
required: true
|
||||
- label: I agree to follow the [Code of Conduct](https://github.com/electron/electron/blob/master/CODE_OF_CONDUCT.md) that this project adheres to.
|
||||
required: true
|
||||
- label: I have searched the [issue tracker](https://www.github.com/electron/electron/issues) for a feature request that matches the one I want to file, without success.
|
||||
required: true
|
||||
- type: textarea
|
||||
attributes:
|
||||
label: Problem Description
|
||||
|
||||
@@ -1,25 +0,0 @@
|
||||
---
|
||||
name: Mac App Store Private API Rejection
|
||||
about: Your app was rejected from the Mac App Store for using private API's
|
||||
|
||||
---
|
||||
|
||||
<!-- As an open source project with a dedicated but small maintainer team, it can sometimes take a long time for issues to be addressed so please be patient and we will get back to you as soon as we can.
|
||||
-->
|
||||
|
||||
### Preflight Checklist
|
||||
<!-- Please ensure you've completed the following steps by replacing [ ] with [x]-->
|
||||
|
||||
* [ ] I have read the [Contributing Guidelines](https://github.com/electron/electron/blob/master/CONTRIBUTING.md) for this project.
|
||||
* [ ] I agree to follow the [Code of Conduct](https://github.com/electron/electron/blob/master/CODE_OF_CONDUCT.md) that this project adheres to.
|
||||
|
||||
### Issue Details
|
||||
|
||||
* **Electron Version:**
|
||||
* <!-- (output of `node_modules/.bin/electron --version`) e.g. 4.0.3 -->
|
||||
|
||||
### Rejection Email
|
||||
<!-- Paste the contents of your rejection email here, censoring any private information such as app names.-->
|
||||
|
||||
### Additional Information
|
||||
<!-- Add any other context about the problem here. -->
|
||||
30
.github/ISSUE_TEMPLATE/mac_app_store_private_api_rejection.yml
vendored
Normal file
30
.github/ISSUE_TEMPLATE/mac_app_store_private_api_rejection.yml
vendored
Normal file
@@ -0,0 +1,30 @@
|
||||
name: Report Mac App Store Private API Rejection
|
||||
description: Your app was rejected from the Mac App Store for using private API's
|
||||
title: "[MAS Rejection]: "
|
||||
body:
|
||||
- type: checkboxes
|
||||
attributes:
|
||||
label: Preflight Checklist
|
||||
description: Please ensure you've completed all of the following.
|
||||
options:
|
||||
- label: I have read the [Contributing Guidelines](https://github.com/electron/electron/blob/master/CONTRIBUTING.md) for this project.
|
||||
required: true
|
||||
- label: I agree to follow the [Code of Conduct](https://github.com/electron/electron/blob/master/CODE_OF_CONDUCT.md) that this project adheres to.
|
||||
required: true
|
||||
- type: input
|
||||
attributes:
|
||||
label: Electron Version
|
||||
description: What version of Electron are you using?
|
||||
placeholder: 12.0.0
|
||||
validations:
|
||||
required: true
|
||||
- type: textarea
|
||||
attributes:
|
||||
label: Rejection Email
|
||||
description: Paste the contents of your rejection email here, censoring any private information such as app names.
|
||||
validations:
|
||||
required: true
|
||||
- type: textarea
|
||||
attributes:
|
||||
label: Additional Information
|
||||
description: Add any other context about the problem here.
|
||||
48
BUILD.gn
48
BUILD.gn
@@ -25,8 +25,6 @@ import("electron_paks.gni")
|
||||
import("filenames.auto.gni")
|
||||
import("filenames.gni")
|
||||
import("filenames.hunspell.gni")
|
||||
import("filenames.libcxx.gni")
|
||||
import("filenames.libcxxabi.gni")
|
||||
|
||||
if (is_mac) {
|
||||
import("//build/config/mac/rules.gni")
|
||||
@@ -34,6 +32,10 @@ if (is_mac) {
|
||||
import("//ui/gl/features.gni")
|
||||
import("//v8/gni/v8.gni")
|
||||
import("build/rules.gni")
|
||||
|
||||
assert(
|
||||
mac_deployment_target == "10.11.0",
|
||||
"Chromium has updated the mac_deployment_target, please update this assert, update the supported versions documentation (docs/tutorial/support.md) and flag this as a breaking change")
|
||||
}
|
||||
|
||||
if (is_linux) {
|
||||
@@ -1294,18 +1296,13 @@ template("dist_zip") {
|
||||
"testonly",
|
||||
])
|
||||
flatten = false
|
||||
flatten_relative_to = false
|
||||
if (defined(invoker.flatten)) {
|
||||
flatten = invoker.flatten
|
||||
if (defined(invoker.flatten_relative_to)) {
|
||||
flatten_relative_to = invoker.flatten_relative_to
|
||||
}
|
||||
}
|
||||
args = rebase_path(outputs + [ _runtime_deps_file ], root_build_dir) + [
|
||||
target_cpu,
|
||||
target_os,
|
||||
"$flatten",
|
||||
"$flatten_relative_to",
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -1396,43 +1393,6 @@ dist_zip("hunspell_dictionaries_zip") {
|
||||
outputs = [ "$root_build_dir/hunspell_dictionaries.zip" ]
|
||||
}
|
||||
|
||||
copy("libcxx_headers") {
|
||||
sources = libcxx_headers + libcxx_licenses
|
||||
outputs = [ "$target_gen_dir/electron_libcxx_include/{{source_root_relative_dir}}/{{source_file_part}}" ]
|
||||
}
|
||||
|
||||
dist_zip("libcxx_headers_zip") {
|
||||
data_deps = [ ":libcxx_headers" ]
|
||||
flatten = true
|
||||
flatten_relative_to = rebase_path(
|
||||
"$target_gen_dir/electron_libcxx_include/buildtools/third_party/libc++/trunk",
|
||||
"$root_out_dir")
|
||||
|
||||
outputs = [ "$root_build_dir/libcxx_headers.zip" ]
|
||||
}
|
||||
|
||||
copy("libcxxabi_headers") {
|
||||
sources = libcxxabi_headers + libcxxabi_licenses
|
||||
outputs = [ "$target_gen_dir/electron_libcxxabi_include/{{source_root_relative_dir}}/{{source_file_part}}" ]
|
||||
}
|
||||
|
||||
dist_zip("libcxxabi_headers_zip") {
|
||||
data_deps = [ ":libcxxabi_headers" ]
|
||||
flatten = true
|
||||
flatten_relative_to = rebase_path(
|
||||
"$target_gen_dir/electron_libcxxabi_include/buildtools/third_party/libc++abi/trunk",
|
||||
"$root_out_dir")
|
||||
|
||||
outputs = [ "$root_build_dir/libcxxabi_headers.zip" ]
|
||||
}
|
||||
|
||||
action("libcxx_objects_zip") {
|
||||
deps = [ "//buildtools/third_party/libc++" ]
|
||||
script = "build/zip_libcxx.py"
|
||||
outputs = [ "$root_build_dir/libcxx_objects.zip" ]
|
||||
args = rebase_path(outputs)
|
||||
}
|
||||
|
||||
group("electron") {
|
||||
public_deps = [ ":electron_app" ]
|
||||
}
|
||||
|
||||
4
DEPS
4
DEPS
@@ -14,9 +14,9 @@ gclient_gn_args = [
|
||||
|
||||
vars = {
|
||||
'chromium_version':
|
||||
'91.0.4472.69',
|
||||
'92.0.4475.0',
|
||||
'node_version':
|
||||
'v14.16.0',
|
||||
'v14.16.1',
|
||||
'nan_version':
|
||||
'v2.14.2',
|
||||
'squirrel.mac_version':
|
||||
|
||||
@@ -1 +1 @@
|
||||
13.0.0
|
||||
14.0.0-nightly.20210426
|
||||
@@ -5,7 +5,7 @@
|
||||
[](https://david-dm.org/electron/electron?type=dev)
|
||||
[](https://discord.com/invite/electron)
|
||||
|
||||
:memo: Available Translations: 🇨🇳 🇧🇷 🇪🇸 🇯🇵 🇷🇺 🇫🇷 🇺🇸 🇩🇪.
|
||||
:memo: Available Translations: 🇨🇳 🇹🇼 🇧🇷 🇪🇸 🇰🇷 🇯🇵 🇷🇺 🇫🇷 🇹🇭 🇳🇱 🇹🇷 🇮🇩 🇺🇦 🇨🇿 🇮🇹 🇵🇱.
|
||||
View these docs in other languages at [electron/i18n](https://github.com/electron/i18n/tree/master/content/).
|
||||
|
||||
The Electron framework lets you write cross-platform desktop applications
|
||||
|
||||
@@ -64,7 +64,7 @@ steps:
|
||||
set npm_config_arch=arm64
|
||||
cd electron
|
||||
# CalculateNativeWinOcclusion is disabled due to https://bugs.chromium.org/p/chromium/issues/detail?id=1139022
|
||||
node script/yarn test -- --enable-logging --verbose --disable-features=CalculateNativeWinOcclusion --disable-gpu
|
||||
node script/yarn test -- --enable-logging --verbose --disable-features=CalculateNativeWinOcclusion
|
||||
displayName: 'Run Electron tests'
|
||||
env:
|
||||
ELECTRON_OUT_DIR: Default
|
||||
|
||||
@@ -15,6 +15,12 @@ args = [cmd, "run",
|
||||
try:
|
||||
subprocess.check_output(args, stderr=subprocess.STDOUT)
|
||||
except subprocess.CalledProcessError as e:
|
||||
error_msg = "NPM script '{}' failed with code '{}':\n".format(sys.argv[2], e.returncode)
|
||||
print(error_msg + e.output.decode('ascii'))
|
||||
print(
|
||||
"NPM script '"
|
||||
+ sys.argv[2]
|
||||
+ "' failed with code '"
|
||||
+ str(e.returncode)
|
||||
+ "':\n"
|
||||
+ e.output
|
||||
)
|
||||
sys.exit(e.returncode)
|
||||
|
||||
@@ -61,13 +61,6 @@ module.exports = ({
|
||||
);
|
||||
}
|
||||
|
||||
if (defines.ENABLE_REMOTE_MODULE === 'false') {
|
||||
ignoredModules.push(
|
||||
'@electron/internal/browser/remote/server',
|
||||
'@electron/internal/renderer/api/remote'
|
||||
);
|
||||
}
|
||||
|
||||
if (defines.ENABLE_VIEWS_API === 'false') {
|
||||
ignoredModules.push(
|
||||
'@electron/internal/browser/api/views/image-view.js'
|
||||
|
||||
15
build/zip.py
15
build/zip.py
@@ -71,7 +71,7 @@ def execute(argv):
|
||||
raise e
|
||||
|
||||
def main(argv):
|
||||
dist_zip, runtime_deps, target_cpu, _, flatten_val, flatten_relative_to = argv
|
||||
dist_zip, runtime_deps, target_cpu, _, flatten_val = argv
|
||||
should_flatten = flatten_val == "true"
|
||||
dist_files = set()
|
||||
with open(runtime_deps) as f:
|
||||
@@ -98,18 +98,11 @@ def main(argv):
|
||||
if basename == 'chrome_sandbox'
|
||||
else dep
|
||||
)
|
||||
name_to_write = arcname
|
||||
if should_flatten:
|
||||
if flatten_relative_to:
|
||||
if name_to_write.startswith(flatten_relative_to):
|
||||
name_to_write = name_to_write[len(flatten_relative_to):]
|
||||
else:
|
||||
name_to_write = os.path.basename(arcname)
|
||||
else:
|
||||
name_to_write = os.path.basename(arcname)
|
||||
z.write(
|
||||
dep,
|
||||
name_to_write,
|
||||
os.path.basename(arcname)
|
||||
if should_flatten
|
||||
else arcname,
|
||||
)
|
||||
|
||||
if __name__ == '__main__':
|
||||
|
||||
@@ -1,47 +0,0 @@
|
||||
#!/usr/bin/env python
|
||||
from __future__ import print_function
|
||||
import os
|
||||
import subprocess
|
||||
import sys
|
||||
import zipfile
|
||||
|
||||
def execute(argv):
|
||||
try:
|
||||
output = subprocess.check_output(argv, stderr=subprocess.STDOUT)
|
||||
return output
|
||||
except subprocess.CalledProcessError as e:
|
||||
print(e.output)
|
||||
raise e
|
||||
|
||||
def get_object_files(base_path, archive_name):
|
||||
archive_file = os.path.join(base_path, archive_name)
|
||||
output = execute(['nm', '-g', archive_file]).decode('ascii')
|
||||
object_files = set()
|
||||
lines = output.split("\n")
|
||||
for line in lines:
|
||||
if line.startswith(base_path):
|
||||
object_file = line.split(":")[0]
|
||||
object_files.add(object_file)
|
||||
if line.startswith('nm: '):
|
||||
object_file = line.split(":")[1].lstrip()
|
||||
object_files.add(object_file)
|
||||
return list(object_files) + [archive_file]
|
||||
|
||||
def main(argv):
|
||||
dist_zip, = argv
|
||||
out_dir = os.path.dirname(dist_zip)
|
||||
base_path_libcxx = os.path.join(out_dir, 'obj/buildtools/third_party/libc++')
|
||||
base_path_libcxxabi = os.path.join(out_dir, 'obj/buildtools/third_party/libc++abi')
|
||||
object_files_libcxx = get_object_files(base_path_libcxx, 'libc++.a')
|
||||
object_files_libcxxabi = get_object_files(base_path_libcxxabi, 'libc++abi.a')
|
||||
with zipfile.ZipFile(
|
||||
dist_zip, 'w', zipfile.ZIP_DEFLATED, allowZip64=True
|
||||
) as z:
|
||||
object_files_libcxx.sort()
|
||||
for object_file in object_files_libcxx:
|
||||
z.write(object_file, os.path.relpath(object_file, base_path_libcxx))
|
||||
for object_file in object_files_libcxxabi:
|
||||
z.write(object_file, os.path.relpath(object_file, base_path_libcxxabi))
|
||||
|
||||
if __name__ == '__main__':
|
||||
sys.exit(main(sys.argv[1:]))
|
||||
@@ -12,7 +12,6 @@ buildflag_header("buildflags") {
|
||||
"ENABLE_DESKTOP_CAPTURER=$enable_desktop_capturer",
|
||||
"ENABLE_RUN_AS_NODE=$enable_run_as_node",
|
||||
"ENABLE_OSR=$enable_osr",
|
||||
"ENABLE_REMOTE_MODULE=$enable_remote_module",
|
||||
"ENABLE_VIEWS_API=$enable_views_api",
|
||||
"ENABLE_PDF_VIEWER=$enable_pdf_viewer",
|
||||
"ENABLE_TTS=$enable_tts",
|
||||
|
||||
@@ -10,8 +10,6 @@ declare_args() {
|
||||
|
||||
enable_osr = true
|
||||
|
||||
enable_remote_module = true
|
||||
|
||||
enable_views_api = true
|
||||
|
||||
enable_pdf_viewer = true
|
||||
|
||||
@@ -52,8 +52,7 @@ async function createWindow (backgroundColor?: string) {
|
||||
webPreferences: {
|
||||
preload: path.resolve(__dirname, 'preload.js'),
|
||||
contextIsolation: true,
|
||||
sandbox: true,
|
||||
enableRemoteModule: false
|
||||
sandbox: true
|
||||
},
|
||||
useContentSize: true,
|
||||
show: false
|
||||
|
||||
@@ -18,14 +18,20 @@ an issue:
|
||||
|
||||
## Guides and Tutorials
|
||||
|
||||
### Getting started
|
||||
### Quickstart
|
||||
|
||||
* [Introduction](tutorial/introduction.md)
|
||||
* [Quick Start](tutorial/quick-start.md)
|
||||
* [Process Model](tutorial/process-model.md)
|
||||
* [Quick Start Guide](tutorial/quick-start.md)
|
||||
* [Prerequisites](tutorial/quick-start.md#prerequisites)
|
||||
* [Create a basic application](tutorial/quick-start.md#create-a-basic-application)
|
||||
* [Run your application](tutorial/quick-start.md#run-your-application)
|
||||
* [Package and distribute the application](tutorial/quick-start.md#package-and-distribute-the-application)
|
||||
|
||||
### Learning the basics
|
||||
|
||||
* [Electron's Process Model](tutorial/quick-start.md#application-architecture)
|
||||
* [Main and Renderer Processes](tutorial/quick-start.md#main-and-renderer-processes)
|
||||
* [Electron API](tutorial/quick-start.md#electron-api)
|
||||
* [Node.js API](tutorial/quick-start.md#nodejs-api)
|
||||
* Adding Features to Your App
|
||||
* [Notifications](tutorial/notifications.md)
|
||||
* [Recent Documents](tutorial/recent-documents.md)
|
||||
@@ -53,7 +59,6 @@ an issue:
|
||||
* [Using Native Node.js Modules](tutorial/using-native-node-modules.md)
|
||||
* [Performance Strategies](tutorial/performance.md)
|
||||
* [Security Strategies](tutorial/security.md)
|
||||
* [Process Sandboxing](tutorial/sandbox.md)
|
||||
* [Accessibility](tutorial/accessibility.md)
|
||||
* [Manually Enabling Accessibility Features](tutorial/accessibility.md#manually-enabling-accessibility-features)
|
||||
* [Testing and Debugging](tutorial/application-debugging.md)
|
||||
@@ -63,7 +68,6 @@ an issue:
|
||||
* [Testing on Headless CI Systems (Travis, Jenkins)](tutorial/testing-on-headless-ci.md)
|
||||
* [DevTools Extension](tutorial/devtools-extension.md)
|
||||
* [Automated Testing with a Custom Driver](tutorial/automated-testing-with-a-custom-driver.md)
|
||||
* [REPL](tutorial/repl.md)
|
||||
* [Distribution](tutorial/application-distribution.md)
|
||||
* [Supported Platforms](tutorial/support.md#supported-platforms)
|
||||
* [Code Signing](tutorial/code-signing.md)
|
||||
@@ -122,8 +126,6 @@ These individual tutorials expand on topics discussed in the guide above.
|
||||
* [ipcMain](api/ipc-main.md)
|
||||
* [Menu](api/menu.md)
|
||||
* [MenuItem](api/menu-item.md)
|
||||
* [MessageChannelMain](api/message-channel-main.md)
|
||||
* [MessagePortMain](api/message-port-main.md)
|
||||
* [net](api/net.md)
|
||||
* [netLog](api/net-log.md)
|
||||
* [nativeTheme](api/native-theme.md)
|
||||
@@ -133,7 +135,6 @@ These individual tutorials expand on topics discussed in the guide above.
|
||||
* [protocol](api/protocol.md)
|
||||
* [screen](api/screen.md)
|
||||
* [session](api/session.md)
|
||||
* [ShareMenu](api/share-menu.md)
|
||||
* [systemPreferences](api/system-preferences.md)
|
||||
* [TouchBar](api/touch-bar.md)
|
||||
* [Tray](api/tray.md)
|
||||
|
||||
@@ -35,7 +35,7 @@ Linux and Windows to define some accelerators.
|
||||
Use `Alt` instead of `Option`. The `Option` key only exists on macOS, whereas
|
||||
the `Alt` key is available on all platforms.
|
||||
|
||||
The `Super` (or `Meta`) key is mapped to the `Windows` key on Windows and Linux and
|
||||
The `Super` key is mapped to the `Windows` key on Windows and Linux and
|
||||
`Cmd` on macOS.
|
||||
|
||||
## Available modifiers
|
||||
@@ -48,7 +48,6 @@ The `Super` (or `Meta`) key is mapped to the `Windows` key on Windows and Linux
|
||||
* `AltGr`
|
||||
* `Shift`
|
||||
* `Super`
|
||||
* `Meta`
|
||||
|
||||
## Available key codes
|
||||
|
||||
|
||||
@@ -507,64 +507,6 @@ Returns:
|
||||
Emitted when `desktopCapturer.getSources()` is called in the renderer process of `webContents`.
|
||||
Calling `event.preventDefault()` will make it return empty sources.
|
||||
|
||||
### Event: 'remote-require' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` Event
|
||||
* `webContents` [WebContents](web-contents.md)
|
||||
* `moduleName` String
|
||||
|
||||
Emitted when `remote.require()` is called in the renderer process of `webContents`.
|
||||
Calling `event.preventDefault()` will prevent the module from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
### Event: 'remote-get-global' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` Event
|
||||
* `webContents` [WebContents](web-contents.md)
|
||||
* `globalName` String
|
||||
|
||||
Emitted when `remote.getGlobal()` is called in the renderer process of `webContents`.
|
||||
Calling `event.preventDefault()` will prevent the global from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
### Event: 'remote-get-builtin' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` Event
|
||||
* `webContents` [WebContents](web-contents.md)
|
||||
* `moduleName` String
|
||||
|
||||
Emitted when `remote.getBuiltin()` is called in the renderer process of `webContents`.
|
||||
Calling `event.preventDefault()` will prevent the module from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
### Event: 'remote-get-current-window' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` Event
|
||||
* `webContents` [WebContents](web-contents.md)
|
||||
|
||||
Emitted when `remote.getCurrentWindow()` is called in the renderer process of `webContents`.
|
||||
Calling `event.preventDefault()` will prevent the object from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
### Event: 'remote-get-current-web-contents' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` Event
|
||||
* `webContents` [WebContents](web-contents.md)
|
||||
|
||||
Emitted when `remote.getCurrentWebContents()` is called in the renderer process of `webContents`.
|
||||
Calling `event.preventDefault()` will prevent the object from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
## Methods
|
||||
|
||||
The `app` object has the following methods:
|
||||
@@ -753,8 +695,7 @@ Overrides the current application's name.
|
||||
|
||||
### `app.getLocale()`
|
||||
|
||||
Returns `String` - The current application locale, fetched using Chromium's `l10n_util` library.
|
||||
Possible return values are documented [here](https://source.chromium.org/chromium/chromium/src/+/master:ui/base/l10n/l10n_util.cc).
|
||||
Returns `String` - The current application locale. Possible return values are documented [here](locales.md).
|
||||
|
||||
To set the locale, you'll want to use a command line switch at app startup, which may be found [here](https://github.com/electron/electron/blob/master/docs/api/command-line-switches.md).
|
||||
|
||||
@@ -1485,19 +1426,6 @@ 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.allowRendererProcessReuse`
|
||||
|
||||
A `Boolean` which when `true` disables the overrides that Electron has in place
|
||||
to ensure renderer processes are restarted on every navigation. The current
|
||||
default value for this property is `true`.
|
||||
|
||||
The intention is for these overrides to become disabled by default and then at
|
||||
some point in the future this property will be removed. This property impacts
|
||||
which native modules you can use in the renderer process. For more information
|
||||
on the direction Electron is going with renderer process restarts and usage of
|
||||
native modules in the renderer process please check out this
|
||||
[Tracking Issue](https://github.com/electron/electron/issues/18397).
|
||||
|
||||
### `app.runningUnderRosettaTranslation` _macOS_ _Readonly_
|
||||
|
||||
A `Boolean` which when `true` indicates that the app is currently running
|
||||
|
||||
@@ -118,6 +118,9 @@ Returns `String` - The current update feed URL.
|
||||
Asks the server whether there is an update. You must call `setFeedURL` before
|
||||
using this API.
|
||||
|
||||
**Note:** If an update is available it will be downloaded automatically.
|
||||
Calling `autoUpdater.checkForUpdates()` twice will download the update two times.
|
||||
|
||||
### `autoUpdater.quitAndInstall()`
|
||||
|
||||
Restarts the app and installs the update after it has been downloaded. It
|
||||
|
||||
@@ -1,16 +1,14 @@
|
||||
# BrowserView
|
||||
|
||||
A `BrowserView` can be used to embed additional web content into a
|
||||
[`BrowserWindow`](browser-window.md). It is like a child window, except that it is positioned
|
||||
relative to its owning window. It is meant to be an alternative to the
|
||||
`webview` tag.
|
||||
|
||||
## Class: BrowserView
|
||||
|
||||
> Create and control views.
|
||||
|
||||
Process: [Main](../glossary.md#main-process)
|
||||
|
||||
A `BrowserView` can be used to embed additional web content into a
|
||||
[`BrowserWindow`](browser-window.md). It is like a child window, except that it is positioned
|
||||
relative to its owning window. It is meant to be an alternative to the
|
||||
`webview` tag.
|
||||
|
||||
### Example
|
||||
|
||||
```javascript
|
||||
|
||||
@@ -238,7 +238,7 @@ It creates a new `BrowserWindow` with native properties as set by the `options`.
|
||||
window shadow and window animations. Default is `true`.
|
||||
* `vibrancy` String (optional) - Add a type of vibrancy effect to the window, only on
|
||||
macOS. Can be `appearance-based`, `light`, `dark`, `titlebar`, `selection`,
|
||||
`menu`, `popover`, `sidebar`, `medium-light`, `ultra-dark`, `header`, `sheet`, `window`, `hud`, `fullscreen-ui`, `tooltip`, `content`, `under-window`, or `under-page`. Please note that `appearance-based`, `light`, `dark`, `medium-light`, and `ultra-dark` are deprecated and have been removed in macOS Catalina (10.15).
|
||||
`menu`, `popover`, `sidebar`, `medium-light`, `ultra-dark`, `header`, `sheet`, `window`, `hud`, `fullscreen-ui`, `tooltip`, `content`, `under-window`, or `under-page`. Please note that using `frame: false` in combination with a vibrancy value requires that you use a non-default `titleBarStyle` as well. Also note that `appearance-based`, `light`, `dark`, `medium-light`, and `ultra-dark` are deprecated and have been removed in macOS Catalina (10.15).
|
||||
* `zoomToPageWidth` Boolean (optional) - Controls the behavior on macOS when
|
||||
option-clicking the green stoplight button on the toolbar or by clicking the
|
||||
Window > Zoom menu item. If `true`, the window will grow to the preferred
|
||||
@@ -272,9 +272,7 @@ It creates a new `BrowserWindow` with native properties as set by the `options`.
|
||||
associated with the window, making it compatible with the Chromium
|
||||
OS-level sandbox and disabling the Node.js engine. This is not the same as
|
||||
the `nodeIntegration` option and the APIs available to the preload script
|
||||
are more limited. Read more about the option [here](../tutorial/sandbox.md).
|
||||
* `enableRemoteModule` Boolean (optional) - Whether to enable the [`remote`](remote.md) module.
|
||||
Default is `false`.
|
||||
are more limited. Read more about the option [here](sandbox-option.md).
|
||||
* `session` [Session](session.md#class-session) (optional) - Sets the session used by the
|
||||
page. Instead of passing the Session object directly, you can also choose to
|
||||
use the `partition` option instead, which accepts a partition string. When
|
||||
@@ -286,13 +284,6 @@ It creates a new `BrowserWindow` with native properties as set by the `options`.
|
||||
same `partition`. If there is no `persist:` prefix, the page will use an
|
||||
in-memory session. By assigning the same `partition`, multiple pages can share
|
||||
the same session. Default is the default session.
|
||||
* `affinity` String (optional) - When specified, web pages with the same
|
||||
`affinity` will run in the same renderer process. Note that due to reusing
|
||||
the renderer process, certain `webPreferences` options will also be shared
|
||||
between the web pages even when you specified different values for them,
|
||||
including but not limited to `preload`, `sandbox` and `nodeIntegration`.
|
||||
So it is suggested to use exact same `webPreferences` for web pages with
|
||||
the same `affinity`. _Deprecated_
|
||||
* `zoomFactor` Number (optional) - The default zoom factor of the page, `3.0` represents
|
||||
`300%`. Default is `1.0`.
|
||||
* `javascript` Boolean (optional) - Enables JavaScript support. Default is `true`.
|
||||
@@ -339,7 +330,7 @@ It creates a new `BrowserWindow` with native properties as set by the `options`.
|
||||
more details.
|
||||
* `contextIsolation` Boolean (optional) - Whether to run Electron APIs and
|
||||
the specified `preload` script in a separate JavaScript context. Defaults
|
||||
to `false`. The context that the `preload` script runs in will only have
|
||||
to `true`. The context that the `preload` script runs in will only have
|
||||
access to its own dedicated `document` and `window` globals, as well as
|
||||
its own set of JavaScript builtins (`Array`, `Object`, `JSON`, etc.),
|
||||
which are all invisible to the loaded content. The Electron API will only
|
||||
@@ -350,13 +341,9 @@ It creates a new `BrowserWindow` with native properties as set by the `options`.
|
||||
[Chrome Content Scripts][chrome-content-scripts]. You can access this
|
||||
context in the dev tools by selecting the 'Electron Isolated Context'
|
||||
entry in the combo box at the top of the Console tab.
|
||||
* `worldSafeExecuteJavaScript` Boolean (optional) - If true, values returned from `webFrame.executeJavaScript` will be sanitized to ensure JS values
|
||||
can't unsafely cross between worlds when using `contextIsolation`. The default
|
||||
is `false`. In Electron 12, the default will be changed to `true`. _Deprecated_
|
||||
* `nativeWindowOpen` Boolean (optional) - Whether to use native
|
||||
`window.open()`. Defaults to `false`. Child windows will always have node
|
||||
integration disabled unless `nodeIntegrationInSubFrames` is true. **Note:** This option is currently
|
||||
experimental.
|
||||
`window.open()`. Defaults to `true`. Child windows will always have node
|
||||
integration disabled unless `nodeIntegrationInSubFrames` is true.
|
||||
* `webviewTag` Boolean (optional) - Whether to enable the [`<webview>` tag](webview-tag.md).
|
||||
Defaults to `false`. **Note:** The
|
||||
`preload` script configured for the `<webview>` will have node integration
|
||||
@@ -763,6 +750,10 @@ A `Boolean` property that determines whether the window is in simple (pre-Lion)
|
||||
|
||||
A `Boolean` property that determines whether the window is in fullscreen mode.
|
||||
|
||||
#### `win.focusable` _Windows_ _macOS_
|
||||
|
||||
A `Boolean` property that determines whether the window is focusable.
|
||||
|
||||
#### `win.visibleOnAllWorkspaces`
|
||||
|
||||
A `Boolean` property that determines whether the window is visible on all workspaces.
|
||||
@@ -1681,6 +1672,10 @@ Changes whether the window can be focused.
|
||||
|
||||
On macOS it does not remove the focus from the window.
|
||||
|
||||
#### `win.isFocusable()` _macOS_ _Windows_
|
||||
|
||||
Returns whether the window can be focused.
|
||||
|
||||
#### `win.setParentWindow(parent)`
|
||||
|
||||
* `parent` BrowserWindow | null
|
||||
|
||||
@@ -66,11 +66,6 @@ Forces the maximum disk space to be used by the disk cache, in bytes.
|
||||
Enables caller stack logging for the following APIs (filtering events):
|
||||
|
||||
* `desktopCapturer.getSources()` / `desktop-capturer-get-sources`
|
||||
* `remote.require()` / `remote-require`
|
||||
* `remote.getGlobal()` / `remote-get-builtin`
|
||||
* `remote.getBuiltin()` / `remote-get-global`
|
||||
* `remote.getCurrentWindow()` / `remote-get-current-window`
|
||||
* `remote.getCurrentWebContents()` / `remote-get-current-web-contents`
|
||||
|
||||
### --enable-logging
|
||||
|
||||
@@ -80,7 +75,7 @@ This switch can not be used in `app.commandLine.appendSwitch` since it is parsed
|
||||
earlier than user's app is loaded, but you can set the `ELECTRON_ENABLE_LOGGING`
|
||||
environment variable to achieve the same effect.
|
||||
|
||||
### --force-fieldtrials=`trials`
|
||||
## --force-fieldtrials=`trials`
|
||||
|
||||
Field trials to be forcefully enabled or disabled.
|
||||
|
||||
@@ -142,8 +137,7 @@ proxy server flags that are passed.
|
||||
|
||||
### --no-sandbox
|
||||
|
||||
Disables the Chromium [sandbox](https://www.chromium.org/developers/design-documents/sandbox).
|
||||
Forces renderer process and Chromium helper processes to run un-sandboxed.
|
||||
Disables Chromium sandbox, which is now enabled by default.
|
||||
Should only be used for testing.
|
||||
|
||||
### --proxy-bypass-list=`hosts`
|
||||
|
||||
@@ -154,7 +154,7 @@ dialog.showOpenDialog(mainWindow, {
|
||||
|
||||
* `browserWindow` [BrowserWindow](browser-window.md) (optional)
|
||||
* `options` Object
|
||||
* `title` String (optional) - The dialog title. Cannot be displayed on some _Linux_ desktop environments.
|
||||
* `title` String (optional)
|
||||
* `defaultPath` String (optional) - Absolute directory path, absolute file
|
||||
path, or file name to use by default.
|
||||
* `buttonLabel` String (optional) - Custom label for the confirmation button, when
|
||||
@@ -185,7 +185,7 @@ The `filters` specifies an array of file types that can be displayed, see
|
||||
|
||||
* `browserWindow` [BrowserWindow](browser-window.md) (optional)
|
||||
* `options` Object
|
||||
* `title` String (optional) - The dialog title. Cannot be displayed on some _Linux_ desktop environments.
|
||||
* `title` String (optional)
|
||||
* `defaultPath` String (optional) - Absolute directory path, absolute file
|
||||
path, or file name to use by default.
|
||||
* `buttonLabel` String (optional) - Custom label for the confirmation button, when
|
||||
@@ -233,10 +233,6 @@ expanding and collapsing the dialog.
|
||||
be selected by default when the message box opens.
|
||||
* `title` String (optional) - Title of the message box, some platforms will not show it.
|
||||
* `detail` String (optional) - Extra information of the message.
|
||||
* `checkboxLabel` String (optional) - If provided, the message box will
|
||||
include a checkbox with the given label.
|
||||
* `checkboxChecked` Boolean (optional) - Initial checked state of the
|
||||
checkbox. `false` by default.
|
||||
* `icon` ([NativeImage](native-image.md) | String) (optional)
|
||||
* `cancelId` Integer (optional) - The index of the button to be used to cancel the dialog, via
|
||||
the `Esc` key. By default this is assigned to the first button with "cancel" or "no" as the
|
||||
|
||||
142
docs/api/locales.md
Normal file
142
docs/api/locales.md
Normal file
@@ -0,0 +1,142 @@
|
||||
# Locales
|
||||
|
||||
> Locale values returned by `app.getLocale()`.
|
||||
|
||||
Electron uses Chromium's `l10n_util` library to fetch the locale. Possible
|
||||
values are listed below:
|
||||
|
||||
| Language Code | Language Name |
|
||||
|---------------|---------------|
|
||||
| af | Afrikaans |
|
||||
| am | Amharic |
|
||||
| ar | Arabic |
|
||||
| az | Azerbaijani |
|
||||
| be | Belarusian |
|
||||
| bg | Bulgarian |
|
||||
| bh | Bihari |
|
||||
| bn | Bengali |
|
||||
| br | Breton |
|
||||
| bs | Bosnian |
|
||||
| ca | Catalan |
|
||||
| co | Corsican |
|
||||
| cs | Czech |
|
||||
| cy | Welsh |
|
||||
| da | Danish |
|
||||
| de | German |
|
||||
| de-AT | German (Austria) |
|
||||
| de-CH | German (Switzerland) |
|
||||
| de-DE | German (Germany) |
|
||||
| el | Greek |
|
||||
| en | English |
|
||||
| en-AU | English (Australia) |
|
||||
| en-CA | English (Canada) |
|
||||
| en-GB | English (UK) |
|
||||
| en-NZ | English (New Zealand) |
|
||||
| en-US | English (US) |
|
||||
| en-ZA | English (South Africa) |
|
||||
| eo | Esperanto |
|
||||
| es | Spanish |
|
||||
| es-419 | Spanish (Latin America) |
|
||||
| et | Estonian |
|
||||
| eu | Basque |
|
||||
| fa | Persian |
|
||||
| fi | Finnish |
|
||||
| fil | Filipino |
|
||||
| fo | Faroese |
|
||||
| fr | French |
|
||||
| fr-CA | French (Canada) |
|
||||
| fr-CH | French (Switzerland) |
|
||||
| fr-FR | French (France) |
|
||||
| fy | Frisian |
|
||||
| ga | Irish |
|
||||
| gd | Scots Gaelic |
|
||||
| gl | Galician |
|
||||
| gn | Guarani |
|
||||
| gu | Gujarati |
|
||||
| ha | Hausa |
|
||||
| haw | Hawaiian |
|
||||
| he | Hebrew |
|
||||
| hi | Hindi |
|
||||
| hr | Croatian |
|
||||
| hu | Hungarian |
|
||||
| hy | Armenian |
|
||||
| ia | Interlingua |
|
||||
| id | Indonesian |
|
||||
| is | Icelandic |
|
||||
| it | Italian |
|
||||
| it-CH | Italian (Switzerland) |
|
||||
| it-IT | Italian (Italy) |
|
||||
| ja | Japanese |
|
||||
| jw | Javanese |
|
||||
| ka | Georgian |
|
||||
| kk | Kazakh |
|
||||
| km | Cambodian |
|
||||
| kn | Kannada |
|
||||
| ko | Korean |
|
||||
| ku | Kurdish |
|
||||
| ky | Kyrgyz |
|
||||
| la | Latin |
|
||||
| ln | Lingala |
|
||||
| lo | Laothian |
|
||||
| lt | Lithuanian |
|
||||
| lv | Latvian |
|
||||
| mk | Macedonian |
|
||||
| ml | Malayalam |
|
||||
| mn | Mongolian |
|
||||
| mo | Moldavian |
|
||||
| mr | Marathi |
|
||||
| ms | Malay |
|
||||
| mt | Maltese |
|
||||
| nb | Norwegian (Bokmal) |
|
||||
| ne | Nepali |
|
||||
| nl | Dutch |
|
||||
| nn | Norwegian (Nynorsk) |
|
||||
| no | Norwegian |
|
||||
| oc | Occitan |
|
||||
| om | Oromo |
|
||||
| or | Oriya |
|
||||
| pa | Punjabi |
|
||||
| pl | Polish |
|
||||
| ps | Pashto |
|
||||
| pt | Portuguese |
|
||||
| pt-BR | Portuguese (Brazil) |
|
||||
| pt-PT | Portuguese (Portugal) |
|
||||
| qu | Quechua |
|
||||
| rm | Romansh |
|
||||
| ro | Romanian |
|
||||
| ru | Russian |
|
||||
| sd | Sindhi |
|
||||
| sh | Serbo-Croatian |
|
||||
| si | Sinhalese |
|
||||
| sk | Slovak |
|
||||
| sl | Slovenian |
|
||||
| sn | Shona |
|
||||
| so | Somali |
|
||||
| sq | Albanian |
|
||||
| sr | Serbian |
|
||||
| st | Sesotho |
|
||||
| su | Sundanese |
|
||||
| sv | Swedish |
|
||||
| sw | Swahili |
|
||||
| ta | Tamil |
|
||||
| te | Telugu |
|
||||
| tg | Tajik |
|
||||
| th | Thai |
|
||||
| ti | Tigrinya |
|
||||
| tk | Turkmen |
|
||||
| to | Tonga |
|
||||
| tr | Turkish |
|
||||
| tt | Tatar |
|
||||
| tw | Twi |
|
||||
| ug | Uighur |
|
||||
| uk | Ukrainian |
|
||||
| ur | Urdu |
|
||||
| uz | Uzbek |
|
||||
| vi | Vietnamese |
|
||||
| xh | Xhosa |
|
||||
| yi | Yiddish |
|
||||
| yo | Yoruba |
|
||||
| zh | Chinese |
|
||||
| zh-CN | Chinese (Simplified) |
|
||||
| zh-TW | Chinese (Traditional) |
|
||||
| zu | Zulu |
|
||||
@@ -1,5 +1,3 @@
|
||||
# Menu
|
||||
|
||||
## Class: Menu
|
||||
|
||||
> Create native application menus and context menus.
|
||||
|
||||
@@ -9,15 +9,12 @@ channel messaging.
|
||||
|
||||
## Class: MessageChannelMain
|
||||
|
||||
> Channel interface for channel messaging in the main process.
|
||||
|
||||
Process: [Main](../glossary.md#main-process)
|
||||
|
||||
Example:
|
||||
|
||||
```js
|
||||
// Main process
|
||||
const { MessageChannelMain } = require('electron')
|
||||
const { port1, port2 } = new MessageChannelMain()
|
||||
w.webContents.postMessage('port', null, [port2])
|
||||
port1.postMessage({ some: 'message' })
|
||||
|
||||
@@ -14,8 +14,6 @@ channel messaging.
|
||||
|
||||
## Class: MessagePortMain
|
||||
|
||||
> Port interface for channel messaging in the main process.
|
||||
|
||||
Process: [Main](../glossary.md#main-process)
|
||||
|
||||
### Instance Methods
|
||||
|
||||
@@ -8,11 +8,11 @@ Process: [Main](../glossary.md#main-process)
|
||||
|
||||
The `powerMonitor` module emits the following events:
|
||||
|
||||
### Event: 'suspend' _macOS_ _Windows_
|
||||
### Event: 'suspend'
|
||||
|
||||
Emitted when the system is suspending.
|
||||
|
||||
### Event: 'resume' _macOS_ _Windows_
|
||||
### Event: 'resume'
|
||||
|
||||
Emitted when system is resuming.
|
||||
|
||||
|
||||
@@ -1,217 +0,0 @@
|
||||
# remote
|
||||
|
||||
> Use main process modules from the renderer process.
|
||||
|
||||
Process: [Renderer](../glossary.md#renderer-process)
|
||||
|
||||
> ⚠️ WARNING ⚠️
|
||||
> The `remote` module is [deprecated](https://github.com/electron/electron/issues/21408).
|
||||
> Instead of `remote`, use [`ipcRenderer`](ipc-renderer.md) and
|
||||
> [`ipcMain`](ipc-main.md).
|
||||
>
|
||||
> Read more about why the `remote` module is deprecated [here](https://medium.com/@nornagon/electrons-remote-module-considered-harmful-70d69500f31).
|
||||
>
|
||||
> If you still want to use `remote` despite the performance and security
|
||||
> concerns, see [@electron/remote](https://github.com/electron/remote).
|
||||
|
||||
The `remote` module provides a simple way to do inter-process communication
|
||||
(IPC) between the renderer process (web page) and the main process.
|
||||
|
||||
In Electron, GUI-related modules (such as `dialog`, `menu` etc.) are only
|
||||
available in the main process, not in the renderer process. In order to use them
|
||||
from the renderer process, the `ipc` module is necessary to send inter-process
|
||||
messages to the main process. With the `remote` module, you can invoke methods
|
||||
of the main process object without explicitly sending inter-process messages,
|
||||
similar to Java's [RMI][rmi]. An example of creating a browser window from a
|
||||
renderer process:
|
||||
|
||||
```javascript
|
||||
const { BrowserWindow } = require('electron').remote
|
||||
const win = new BrowserWindow({ width: 800, height: 600 })
|
||||
win.loadURL('https://github.com')
|
||||
```
|
||||
|
||||
**Note:** For the reverse (access the renderer process from the main process),
|
||||
you can use [webContents.executeJavaScript](web-contents.md#contentsexecutejavascriptcode-usergesture).
|
||||
|
||||
**Note:** The remote module can be disabled for security reasons in the following contexts:
|
||||
|
||||
* [`BrowserWindow`](browser-window.md) - by setting the `enableRemoteModule` option to `false`.
|
||||
* [`<webview>`](webview-tag.md) - by setting the `enableremotemodule` attribute to `false`.
|
||||
|
||||
## Remote Objects
|
||||
|
||||
Each object (including functions) returned by the `remote` module represents an
|
||||
object in the main process (we call it a remote object or remote function).
|
||||
When you invoke methods of a remote object, call a remote function, or create
|
||||
a new object with the remote constructor (function), you are actually sending
|
||||
synchronous inter-process messages.
|
||||
|
||||
In the example above, both [`BrowserWindow`](browser-window.md) and `win` were remote objects and
|
||||
`new BrowserWindow` didn't create a `BrowserWindow` object in the renderer
|
||||
process. Instead, it created a `BrowserWindow` object in the main process and
|
||||
returned the corresponding remote object in the renderer process, namely the
|
||||
`win` object.
|
||||
|
||||
**Note:** Only [enumerable properties][enumerable-properties] which are present
|
||||
when the remote object is first referenced are accessible via remote.
|
||||
|
||||
**Note:** Arrays and Buffers are copied over IPC when accessed via the `remote`
|
||||
module. Modifying them in the renderer process does not modify them in the main
|
||||
process and vice versa.
|
||||
|
||||
## Lifetime of Remote Objects
|
||||
|
||||
Electron makes sure that as long as the remote object in the renderer process
|
||||
lives (in other words, has not been garbage collected), the corresponding object
|
||||
in the main process will not be released. When the remote object has been
|
||||
garbage collected, the corresponding object in the main process will be
|
||||
dereferenced.
|
||||
|
||||
If the remote object is leaked in the renderer process (e.g. stored in a map but
|
||||
never freed), the corresponding object in the main process will also be leaked,
|
||||
so you should be very careful not to leak remote objects.
|
||||
|
||||
Primary value types like strings and numbers, however, are sent by copy.
|
||||
|
||||
## Passing callbacks to the main process
|
||||
|
||||
Code in the main process can accept callbacks from the renderer - for instance
|
||||
the `remote` module - but you should be extremely careful when using this
|
||||
feature.
|
||||
|
||||
First, in order to avoid deadlocks, the callbacks passed to the main process
|
||||
are called asynchronously. You should not expect the main process to
|
||||
get the return value of the passed callbacks.
|
||||
|
||||
For instance you can't use a function from the renderer process in an
|
||||
`Array.map` called in the main process:
|
||||
|
||||
```javascript
|
||||
// main process mapNumbers.js
|
||||
exports.withRendererCallback = (mapper) => {
|
||||
return [1, 2, 3].map(mapper)
|
||||
}
|
||||
|
||||
exports.withLocalCallback = () => {
|
||||
return [1, 2, 3].map(x => x + 1)
|
||||
}
|
||||
```
|
||||
|
||||
```javascript
|
||||
// renderer process
|
||||
const mapNumbers = require('electron').remote.require('./mapNumbers')
|
||||
const withRendererCb = mapNumbers.withRendererCallback(x => x + 1)
|
||||
const withLocalCb = mapNumbers.withLocalCallback()
|
||||
|
||||
console.log(withRendererCb, withLocalCb)
|
||||
// [undefined, undefined, undefined], [2, 3, 4]
|
||||
```
|
||||
|
||||
As you can see, the renderer callback's synchronous return value was not as
|
||||
expected, and didn't match the return value of an identical callback that lives
|
||||
in the main process.
|
||||
|
||||
Second, the callbacks passed to the main process will persist until the
|
||||
main process garbage-collects them.
|
||||
|
||||
For example, the following code seems innocent at first glance. It installs a
|
||||
callback for the `close` event on a remote object:
|
||||
|
||||
```javascript
|
||||
require('electron').remote.getCurrentWindow().on('close', () => {
|
||||
// window was closed...
|
||||
})
|
||||
```
|
||||
|
||||
But remember the callback is referenced by the main process until you
|
||||
explicitly uninstall it. If you do not, each time you reload your window the
|
||||
callback will be installed again, leaking one callback for each restart.
|
||||
|
||||
To make things worse, since the context of previously installed callbacks has
|
||||
been released, exceptions will be raised in the main process when the `close`
|
||||
event is emitted.
|
||||
|
||||
To avoid this problem, ensure you clean up any references to renderer callbacks
|
||||
passed to the main process. This involves cleaning up event handlers, or
|
||||
ensuring the main process is explicitly told to dereference callbacks that came
|
||||
from a renderer process that is exiting.
|
||||
|
||||
## Accessing built-in modules in the main process
|
||||
|
||||
The built-in modules in the main process are added as getters in the `remote`
|
||||
module, so you can use them directly like the `electron` module.
|
||||
|
||||
```javascript
|
||||
const app = require('electron').remote.app
|
||||
console.log(app)
|
||||
```
|
||||
|
||||
## Methods
|
||||
|
||||
The `remote` module has the following methods:
|
||||
|
||||
### `remote.getCurrentWindow()`
|
||||
|
||||
Returns [`BrowserWindow`](browser-window.md) - The window to which this web page
|
||||
belongs.
|
||||
|
||||
**Note:** Do not use `removeAllListeners` on [`BrowserWindow`](browser-window.md).
|
||||
Use of this can remove all [`blur`](https://developer.mozilla.org/en-US/docs/Web/Events/blur)
|
||||
listeners, disable click events on touch bar buttons, and other unintended
|
||||
consequences.
|
||||
|
||||
### `remote.getCurrentWebContents()`
|
||||
|
||||
Returns [`WebContents`](web-contents.md) - The web contents of this web page.
|
||||
|
||||
### `remote.getGlobal(name)`
|
||||
|
||||
* `name` String
|
||||
|
||||
Returns `any` - The global variable of `name` (e.g. `global[name]`) in the main
|
||||
process.
|
||||
|
||||
## Properties
|
||||
|
||||
### `remote.require`
|
||||
|
||||
A `NodeJS.Require` function equivalent to `require(module)` in the main process.
|
||||
Modules specified by their relative path will resolve relative to the entrypoint
|
||||
of the main process.
|
||||
|
||||
e.g.
|
||||
|
||||
```sh
|
||||
project/
|
||||
├── main
|
||||
│ ├── foo.js
|
||||
│ └── index.js
|
||||
├── package.json
|
||||
└── renderer
|
||||
└── index.js
|
||||
```
|
||||
|
||||
```js
|
||||
// main process: main/index.js
|
||||
const { app } = require('electron')
|
||||
app.whenReady().then(() => { /* ... */ })
|
||||
```
|
||||
|
||||
```js
|
||||
// some relative module: main/foo.js
|
||||
module.exports = 'bar'
|
||||
```
|
||||
|
||||
```js
|
||||
// renderer process: renderer/index.js
|
||||
const foo = require('electron').remote.require('./foo') // bar
|
||||
```
|
||||
|
||||
### `remote.process` _Readonly_
|
||||
|
||||
A `NodeJS.Process` object. The `process` object in the main process. This is the same as
|
||||
`remote.getGlobal('process')` but is cached.
|
||||
|
||||
[rmi]: https://en.wikipedia.org/wiki/Java_remote_method_invocation
|
||||
[enumerable-properties]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties
|
||||
182
docs/api/sandbox-option.md
Normal file
182
docs/api/sandbox-option.md
Normal file
@@ -0,0 +1,182 @@
|
||||
# `sandbox` Option
|
||||
|
||||
> Create a browser window with a sandboxed renderer. With this
|
||||
option enabled, the renderer must communicate via IPC to the main process in order to access node APIs.
|
||||
|
||||
One of the key security features of Chromium is that all blink rendering/JavaScript
|
||||
code is executed within a sandbox. This sandbox uses OS-specific features to ensure
|
||||
that exploits in the renderer process cannot harm the system.
|
||||
|
||||
In other words, when the sandbox is enabled, the renderers can only make changes
|
||||
to the system by delegating tasks to the main process via IPC.
|
||||
[Here's](https://www.chromium.org/developers/design-documents/sandbox) more
|
||||
information about the sandbox.
|
||||
|
||||
Since a major feature in Electron is the ability to run Node.js in the
|
||||
renderer process (making it easier to develop desktop applications using web
|
||||
technologies), the sandbox is disabled by electron. This is because
|
||||
most Node.js APIs require system access. `require()` for example, is not
|
||||
possible without file system permissions, which are not available in a sandboxed
|
||||
environment.
|
||||
|
||||
Usually this is not a problem for desktop applications since the code is always
|
||||
trusted, but it makes Electron less secure than Chromium for displaying
|
||||
untrusted web content. For applications that require more security, the
|
||||
`sandbox` flag will force Electron to spawn a classic Chromium renderer that is
|
||||
compatible with the sandbox.
|
||||
|
||||
A sandboxed renderer doesn't have a Node.js environment running and doesn't
|
||||
expose Node.js JavaScript APIs to client code. The only exception is the preload script,
|
||||
which has access to a subset of the Electron renderer API.
|
||||
|
||||
Another difference is that sandboxed renderers don't modify any of the default
|
||||
JavaScript APIs. Consequently, some APIs such as `window.open` will work as they
|
||||
do in Chromium (i.e. they do not return a [`BrowserWindowProxy`](browser-window-proxy.md)).
|
||||
|
||||
## Example
|
||||
|
||||
To create a sandboxed window, pass `sandbox: true` to `webPreferences`:
|
||||
|
||||
```js
|
||||
let win
|
||||
app.whenReady().then(() => {
|
||||
win = new BrowserWindow({
|
||||
webPreferences: {
|
||||
sandbox: true
|
||||
}
|
||||
})
|
||||
win.loadURL('http://google.com')
|
||||
})
|
||||
```
|
||||
|
||||
In the above code the [`BrowserWindow`](browser-window.md) that was created has Node.js disabled and can communicate
|
||||
only via IPC. The use of this option stops Electron from creating a Node.js runtime in the renderer. Also,
|
||||
within this new window `window.open` follows the native behavior (by default Electron creates a [`BrowserWindow`](browser-window.md)
|
||||
and returns a proxy to this via `window.open`).
|
||||
|
||||
[`app.enableSandbox`](app.md#appenablesandbox) can be used to force `sandbox: true` for all `BrowserWindow` instances.
|
||||
|
||||
```js
|
||||
let win
|
||||
app.enableSandbox()
|
||||
app.whenReady().then(() => {
|
||||
// no need to pass `sandbox: true` since `app.enableSandbox()` was called.
|
||||
win = new BrowserWindow()
|
||||
win.loadURL('http://google.com')
|
||||
})
|
||||
```
|
||||
|
||||
## Preload
|
||||
|
||||
An app can make customizations to sandboxed renderers using a preload script.
|
||||
Here's an example:
|
||||
|
||||
```js
|
||||
let win
|
||||
app.whenReady().then(() => {
|
||||
win = new BrowserWindow({
|
||||
webPreferences: {
|
||||
sandbox: true,
|
||||
preload: path.join(app.getAppPath(), 'preload.js')
|
||||
}
|
||||
})
|
||||
win.loadURL('http://google.com')
|
||||
})
|
||||
```
|
||||
|
||||
and preload.js:
|
||||
|
||||
```js
|
||||
// This file is loaded whenever a javascript context is created. It runs in a
|
||||
// private scope that can access a subset of Electron renderer APIs. Without
|
||||
// contextIsolation enabled, it's possible to accidentally leak privileged
|
||||
// globals like ipcRenderer to web content.
|
||||
const { ipcRenderer } = require('electron')
|
||||
|
||||
const defaultWindowOpen = window.open
|
||||
|
||||
window.open = function customWindowOpen (url, ...args) {
|
||||
ipcRenderer.send('report-window-open', location.origin, url, args)
|
||||
return defaultWindowOpen(url + '?from_electron=1', ...args)
|
||||
}
|
||||
```
|
||||
|
||||
Important things to notice in the preload script:
|
||||
|
||||
- Even though the sandboxed renderer doesn't have Node.js running, it still has
|
||||
access to a limited node-like environment: `Buffer`, `process`, `setImmediate`,
|
||||
`clearImmediate` and `require` are available.
|
||||
- The preload script must be contained in a single script, but it is possible to have
|
||||
complex preload code composed with multiple modules by using a tool like
|
||||
webpack or browserify. An example of using browserify is below.
|
||||
|
||||
To create a browserify bundle and use it as a preload script, something like
|
||||
the following should be used:
|
||||
|
||||
```sh
|
||||
browserify preload/index.js \
|
||||
-x electron \
|
||||
--insert-global-vars=__filename,__dirname -o preload.js
|
||||
```
|
||||
|
||||
The `-x` flag should be used with any required module that is already exposed in
|
||||
the preload scope, and tells browserify to use the enclosing `require` function
|
||||
for it. `--insert-global-vars` will ensure that `process`, `Buffer` and
|
||||
`setImmediate` are also taken from the enclosing scope(normally browserify
|
||||
injects code for those).
|
||||
|
||||
Currently the `require` function provided in the preload scope exposes the
|
||||
following modules:
|
||||
|
||||
- `electron`
|
||||
- `crashReporter`
|
||||
- `desktopCapturer`
|
||||
- `ipcRenderer`
|
||||
- `nativeImage`
|
||||
- `webFrame`
|
||||
- `events`
|
||||
- `timers`
|
||||
- `url`
|
||||
|
||||
More may be added as needed to expose more Electron APIs in the sandbox.
|
||||
|
||||
## Rendering untrusted content
|
||||
|
||||
Rendering untrusted content in Electron is still somewhat uncharted territory,
|
||||
though some apps are finding success (e.g. Beaker Browser). Our goal is to get
|
||||
as close to Chrome as we can in terms of the security of sandboxed content, but
|
||||
ultimately we will always be behind due to a few fundamental issues:
|
||||
|
||||
1. We do not have the dedicated resources or expertise that Chromium has to
|
||||
apply to the security of its product. We do our best to make use of what we
|
||||
have, to inherit everything we can from Chromium, and to respond quickly to
|
||||
security issues, but Electron cannot be as secure as Chromium without the
|
||||
resources that Chromium is able to dedicate.
|
||||
2. Some security features in Chrome (such as Safe Browsing and Certificate
|
||||
Transparency) require a centralized authority and dedicated servers, both of
|
||||
which run counter to the goals of the Electron project. As such, we disable
|
||||
those features in Electron, at the cost of the associated security they
|
||||
would otherwise bring.
|
||||
3. There is only one Chromium, whereas there are many thousands of apps built
|
||||
on Electron, all of which behave slightly differently. Accounting for those
|
||||
differences can yield a huge possibility space, and make it challenging to
|
||||
ensure the security of the platform in unusual use cases.
|
||||
4. We can't push security updates to users directly, so we rely on app vendors
|
||||
to upgrade the version of Electron underlying their app in order for
|
||||
security updates to reach users.
|
||||
|
||||
Here are some things to consider before rendering untrusted content:
|
||||
|
||||
- A preload script can accidentally leak privileged APIs to untrusted code,
|
||||
unless [`contextIsolation`](../tutorial/security.md#3-enable-context-isolation-for-remote-content)
|
||||
is also enabled.
|
||||
- Some bug in the V8 engine may allow malicious code to access the renderer
|
||||
preload APIs, effectively granting full access to the system through the
|
||||
`remote` module. Therefore, it is highly recommended to [disable the `remote`
|
||||
module](../tutorial/security.md#15-disable-the-remote-module).
|
||||
If disabling is not feasible, you should selectively [filter the `remote`
|
||||
module](../tutorial/security.md#16-filter-the-remote-module).
|
||||
- While we make our best effort to backport Chromium security fixes to older
|
||||
versions of Electron, we do not make a guarantee that every fix will be
|
||||
backported. Your best chance at staying secure is to be on the latest stable
|
||||
version of Electron.
|
||||
@@ -197,9 +197,7 @@ be managed by using [ses.setPermissionCheckHandler(handler)](#sessetpermissionch
|
||||
with the `serial` permission.
|
||||
|
||||
Because this is an experimental feature it is disabled by default. To enable this feature, you
|
||||
will need to use the `--enable-features=ElectronSerialChooser` command line switch. Additionally
|
||||
because this is an experimental Chromium feature you will need to set `enableBlinkFeatures: 'Serial'`
|
||||
on the `webPreferences` property when opening a BrowserWindow.
|
||||
will need to use the `--enable-features=ElectronSerialChooser` command line switch.
|
||||
|
||||
```javascript
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
@@ -210,10 +208,7 @@ app.commandLine.appendSwitch('enable-features', 'ElectronSerialChooser')
|
||||
app.whenReady().then(() => {
|
||||
win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
enableBlinkFeatures: 'Serial'
|
||||
}
|
||||
height: 600
|
||||
})
|
||||
win.webContents.session.on('select-serial-port', (event, portList, webContents, callback) => {
|
||||
event.preventDefault()
|
||||
@@ -822,11 +817,6 @@ Returns `Extension[]` - A list of all loaded extensions.
|
||||
**Note:** This API cannot be called before the `ready` event of the `app` module
|
||||
is emitted.
|
||||
|
||||
#### `ses.getStoragePath()`
|
||||
|
||||
A `String | null` indicating the absolute file system path where data for this
|
||||
session is persisted on disk. For in memory sessions this returns `null`.
|
||||
|
||||
### Instance Properties
|
||||
|
||||
The following properties are available on instances of `Session`:
|
||||
@@ -840,11 +830,6 @@ code to the `setSpellCheckerLanguages` API that isn't in this array will result
|
||||
|
||||
A `Boolean` indicating whether builtin spell checker is enabled.
|
||||
|
||||
#### `ses.storagePath` _Readonly_
|
||||
|
||||
A `String | null` indicating the absolute file system path where data for this
|
||||
session is persisted on disk. For in memory sessions this returns `null`.
|
||||
|
||||
#### `ses.cookies` _Readonly_
|
||||
|
||||
A [`Cookies`](cookies.md) object for this session.
|
||||
|
||||
@@ -1,4 +1,8 @@
|
||||
# ShareMenu
|
||||
## Class: ShareMenu
|
||||
|
||||
> Create share menu on macOS.
|
||||
|
||||
Process: [Main](../glossary.md#main-process)
|
||||
|
||||
The `ShareMenu` class creates [Share Menu][share-menu] on macOS, which can be
|
||||
used to share information from the current context to apps, social media
|
||||
@@ -7,12 +11,6 @@ accounts, and other services.
|
||||
For including the share menu as a submenu of other menus, please use the
|
||||
`shareMenu` role of [`MenuItem`](menu-item.md).
|
||||
|
||||
## Class: ShareMenu
|
||||
|
||||
> Create share menu on macOS.
|
||||
|
||||
Process: [Main](../glossary.md#main-process)
|
||||
|
||||
### `new ShareMenu(sharingItem)`
|
||||
|
||||
* `sharingItem` SharingItem - The item to share.
|
||||
|
||||
12
docs/api/structures/user-default-types.md
Normal file
12
docs/api/structures/user-default-types.md
Normal file
@@ -0,0 +1,12 @@
|
||||
# UserDefaultTypes Object
|
||||
|
||||
* `string` String
|
||||
* `boolean` Boolean
|
||||
* `integer` Number
|
||||
* `float` Number
|
||||
* `double` Number
|
||||
* `url` String
|
||||
* `array` Array\<unknown>
|
||||
* `dictionary` Record\<string, unknown>
|
||||
|
||||
This type is a helper alias, no object will never exist of this type.
|
||||
@@ -13,7 +13,7 @@ either process type.
|
||||
|
||||
The basic rule is: if a module is [GUI][gui] or low-level system related, then
|
||||
it should be only available in the main process. You need to be familiar with
|
||||
the concept of main process vs. renderer process
|
||||
the concept of [main process vs. renderer process](../tutorial/quick-start.md#main-and-renderer-processes)
|
||||
scripts to be able to use those modules.
|
||||
|
||||
The main process script is like a normal Node.js script:
|
||||
@@ -43,6 +43,8 @@ extra ability to use node modules if `nodeIntegration` is enabled:
|
||||
</html>
|
||||
```
|
||||
|
||||
To run your app, read [Run your app](../tutorial/quick-start.md#run-your-application).
|
||||
|
||||
## Destructuring assignment
|
||||
|
||||
As of 0.37, you can use
|
||||
|
||||
@@ -159,13 +159,13 @@ Same as `unsubscribeNotification`, but removes the subscriber from `NSWorkspace.
|
||||
|
||||
Add the specified defaults to your application's `NSUserDefaults`.
|
||||
|
||||
### `systemPreferences.getUserDefault(key, type)` _macOS_
|
||||
### `systemPreferences.getUserDefault<Type extends keyof UserDefaultTypes>(key, type)` _macOS_
|
||||
|
||||
* `key` String
|
||||
* `type` String - Can be `string`, `boolean`, `integer`, `float`, `double`,
|
||||
* `type` Type - Can be `string`, `boolean`, `integer`, `float`, `double`,
|
||||
`url`, `array` or `dictionary`.
|
||||
|
||||
Returns `any` - The value of `key` in `NSUserDefaults`.
|
||||
Returns [`UserDefaultTypes[Type]`](structures/user-default-types.md) - The value of `key` in `NSUserDefaults`.
|
||||
|
||||
Some popular `key` and `type`s are:
|
||||
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
# TouchBar
|
||||
|
||||
## Class: TouchBar
|
||||
|
||||
> Create TouchBar layouts for native macOS applications
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
# Tray
|
||||
|
||||
## Class: Tray
|
||||
|
||||
> Add icons and context menus to the system's notification area.
|
||||
|
||||
@@ -147,7 +147,8 @@ Returns:
|
||||
* `options` BrowserWindowConstructorOptions - The options which will be used for creating the new
|
||||
[`BrowserWindow`](browser-window.md).
|
||||
* `additionalFeatures` String[] - The non-standard features (features not handled
|
||||
by Chromium or Electron) given to `window.open()`.
|
||||
by Chromium or Electron) given to `window.open()`. Deprecated, and will now
|
||||
always be the empty array `[]`.
|
||||
* `referrer` [Referrer](structures/referrer.md) - The referrer that will be
|
||||
passed to the new window. May or may not result in the `Referer` header being
|
||||
sent, depending on the referrer policy.
|
||||
@@ -202,13 +203,11 @@ Returns:
|
||||
* `frameName` String - Name given to the created window in the
|
||||
`window.open()` call.
|
||||
* `options` BrowserWindowConstructorOptions - The options used to create the
|
||||
BrowserWindow. They are merged in increasing precedence: options inherited
|
||||
from the parent, parsed options from the `features` string from
|
||||
`window.open()`, and options given by
|
||||
BrowserWindow. They are merged in increasing precedence: parsed options
|
||||
from the `features` string from `window.open()`, security-related
|
||||
webPreferences inherited from the parent, and options given by
|
||||
[`webContents.setWindowOpenHandler`](web-contents.md#contentssetwindowopenhandlerhandler).
|
||||
Unrecognized options are not filtered out.
|
||||
* `additionalFeatures` String[] - The non-standard features (features not
|
||||
handled Chromium or Electron) _Deprecated_
|
||||
* `referrer` [Referrer](structures/referrer.md) - The referrer that will be
|
||||
passed to the new window. May or may not result in the `Referer` header
|
||||
being sent, depending on the referrer policy.
|
||||
@@ -375,6 +374,8 @@ 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:
|
||||
@@ -839,59 +840,6 @@ Returns:
|
||||
Emitted when `desktopCapturer.getSources()` is called in the renderer process.
|
||||
Calling `event.preventDefault()` will make it return empty sources.
|
||||
|
||||
#### Event: 'remote-require' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` IpcMainEvent
|
||||
* `moduleName` String
|
||||
|
||||
Emitted when `remote.require()` is called in the renderer process.
|
||||
Calling `event.preventDefault()` will prevent the module from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
#### Event: 'remote-get-global' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` IpcMainEvent
|
||||
* `globalName` String
|
||||
|
||||
Emitted when `remote.getGlobal()` is called in the renderer process.
|
||||
Calling `event.preventDefault()` will prevent the global from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
#### Event: 'remote-get-builtin' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` IpcMainEvent
|
||||
* `moduleName` String
|
||||
|
||||
Emitted when `remote.getBuiltin()` is called in the renderer process.
|
||||
Calling `event.preventDefault()` will prevent the module from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
#### Event: 'remote-get-current-window' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` IpcMainEvent
|
||||
|
||||
Emitted when `remote.getCurrentWindow()` is called in the renderer process.
|
||||
Calling `event.preventDefault()` will prevent the object from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
#### Event: 'remote-get-current-web-contents' _Deprecated_
|
||||
|
||||
Returns:
|
||||
|
||||
* `event` IpcMainEvent
|
||||
|
||||
Emitted when `remote.getCurrentWebContents()` is called in the renderer process.
|
||||
Calling `event.preventDefault()` will prevent the object from being returned.
|
||||
Custom value can be returned by setting `event.returnValue`.
|
||||
|
||||
#### Event: 'preferred-size-changed'
|
||||
|
||||
Returns:
|
||||
@@ -1200,8 +1148,11 @@ Ignore application menu shortcuts while this web contents is focused.
|
||||
without a recognized 'action' value will result in a console error and have
|
||||
the same effect as returning `{action: 'deny'}`.
|
||||
|
||||
Called before creating a window when `window.open()` is called from the
|
||||
renderer. See [`window.open()`](window-open.md) for more details and how to use this in conjunction with `did-create-window`.
|
||||
Called before creating a window a new window is requested by the renderer, e.g.
|
||||
by `window.open()`, a link with `target="_blank"`, shift+clicking on a link, or
|
||||
submitting a form with `<form target="_blank">`. See
|
||||
[`window.open()`](window-open.md) for more details and how to use this in
|
||||
conjunction with `did-create-window`.
|
||||
|
||||
#### `contents.setAudioMuted(muted)`
|
||||
|
||||
@@ -1330,7 +1281,8 @@ Inserts `text` to the focused element.
|
||||
* `text` String - Content to be searched, must not be empty.
|
||||
* `options` Object (optional)
|
||||
* `forward` Boolean (optional) - Whether to search forward or backward, defaults to `true`.
|
||||
* `findNext` Boolean (optional) - Whether to begin a new text finding session with this request. Should be `true` for initial requests, and `false` for follow-up requests. Defaults to `false`.
|
||||
* `findNext` Boolean (optional) - Whether the operation is first request or a follow up,
|
||||
defaults to `false`.
|
||||
* `matchCase` Boolean (optional) - Whether search should be case-sensitive,
|
||||
defaults to `false`.
|
||||
|
||||
|
||||
@@ -182,3 +182,9 @@ This is not the same as the OS process ID; to read that use `frame.osProcessId`.
|
||||
An `Integer` representing the unique frame id in the current renderer process.
|
||||
Distinct `WebFrameMain` instances that refer to the same underlying frame will
|
||||
have the same `routingId`.
|
||||
|
||||
#### `frame.visibilityState` _Readonly_
|
||||
|
||||
A `string` representing the [visibility state](https://developer.mozilla.org/en-US/docs/Web/API/Document/visibilityState) of the frame.
|
||||
|
||||
See also how the [Page Visibility API](browser-window.md#page-visibility) is affected by other Electron APIs.
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
Electron's `webview` tag is based on [Chromium's `webview`][chrome-webview], which
|
||||
is undergoing dramatic architectural changes. This impacts the stability of `webviews`,
|
||||
including rendering, navigation, and event routing. We currently recommend to not
|
||||
use the `webview` tag and to consider alternatives, like `iframe`, [Electron's `BrowserView`](browser-view.md),
|
||||
use the `webview` tag and to consider alternatives, like `iframe`, Electron's `BrowserView`,
|
||||
or an architecture that avoids embedded content altogether.
|
||||
|
||||
## Enabling
|
||||
@@ -130,15 +130,6 @@ inside the `webview`. All your preloads will load for every iframe, you can
|
||||
use `process.isMainFrame` to determine if you are in the main frame or not.
|
||||
This option is disabled by default in the guest page.
|
||||
|
||||
### `enableremotemodule`
|
||||
|
||||
```html
|
||||
<webview src="http://www.google.com/" enableremotemodule="false"></webview>
|
||||
```
|
||||
|
||||
A `Boolean`. When this attribute is `false` the guest page in `webview` will not have access
|
||||
to the [`remote`](remote.md) module. The remote module is unavailable by default.
|
||||
|
||||
### `plugins`
|
||||
|
||||
```html
|
||||
@@ -515,7 +506,8 @@ Inserts `text` to the focused element.
|
||||
* `text` String - Content to be searched, must not be empty.
|
||||
* `options` Object (optional)
|
||||
* `forward` Boolean (optional) - Whether to search forward or backward, defaults to `true`.
|
||||
* `findNext` Boolean (optional) - Whether to begin a new text finding session with this request. Should be `true` for initial requests, and `false` for follow-up requests. Defaults to `false`.
|
||||
* `findNext` Boolean (optional) - Whether the operation is first request or a follow up,
|
||||
defaults to `false`.
|
||||
* `matchCase` Boolean (optional) - Whether search should be case-sensitive,
|
||||
defaults to `false`.
|
||||
|
||||
|
||||
@@ -6,16 +6,15 @@ untrusted content within a renderer. Windows can be created from the renderer in
|
||||
* clicking on links or submitting forms adorned with `target=_blank`
|
||||
* JavaScript calling `window.open()`
|
||||
|
||||
In non-sandboxed renderers, or when `nativeWindowOpen` is false (the default), this results in the creation of a
|
||||
[`BrowserWindowProxy`](browser-window-proxy.md), a light wrapper around
|
||||
`BrowserWindow`.
|
||||
For same-origin content, the new window is created within the same process,
|
||||
enabling the parent to access the child window directly. This can be very
|
||||
useful for app sub-windows that act as preference panels, or similar, as the
|
||||
parent can render to the sub-window directly, as if it were a `div` in the
|
||||
parent. This is the same behavior as in the browser.
|
||||
|
||||
However, when the `sandbox` (or directly, `nativeWindowOpen`) option is set, a
|
||||
`Window` instance is created, as you'd expect in the browser. For same-origin
|
||||
content, the new window is created within the same process, enabling the parent
|
||||
to access the child window directly. This can be very useful for app sub-windows that act
|
||||
as preference panels, or similar, as the parent can render to the sub-window
|
||||
directly, as if it were a `div` in the parent.
|
||||
When `nativeWindowOpen` is set to false, `window.open` instead results in the
|
||||
creation of a [`BrowserWindowProxy`](browser-window-proxy.md), a light wrapper
|
||||
around `BrowserWindow`.
|
||||
|
||||
Electron pairs this native Chrome `Window` with a BrowserWindow under the hood.
|
||||
You can take advantage of all the customization available when creating a
|
||||
@@ -23,9 +22,8 @@ BrowserWindow in the main process by using `webContents.setWindowOpenHandler()`
|
||||
for renderer-created windows.
|
||||
|
||||
BrowserWindow constructor options are set by, in increasing precedence
|
||||
order: options inherited from the parent, parsed options
|
||||
from the `features` string from `window.open()`, security-related webPreferences
|
||||
inherited from the parent, and options given by
|
||||
order: parsed options from the `features` string from `window.open()`,
|
||||
security-related webPreferences inherited from the parent, and options given by
|
||||
[`webContents.setWindowOpenHandler`](web-contents.md#contentssetwindowopenhandlerhandler).
|
||||
Note that `webContents.setWindowOpenHandler` has final say and full privilege
|
||||
because it is invoked in the main process.
|
||||
@@ -64,53 +62,23 @@ window.open('https://github.com', '_blank', 'top=500,left=200,frame=false,nodeIn
|
||||
the parent window.
|
||||
* Non-standard features (that are not handled by Chromium or Electron) given in
|
||||
`features` will be passed to any registered `webContents`'s
|
||||
`did-create-window` event handler in the `additionalFeatures` argument.
|
||||
`did-create-window` event handler in the `options` argument.
|
||||
* `frameName` follows the specification of `windowName` located in the [native documentation](https://developer.mozilla.org/en-US/docs/Web/API/Window/open#parameters).
|
||||
|
||||
To customize or cancel the creation of the window, you can optionally set an
|
||||
override handler with `webContents.setWindowOpenHandler()` from the main
|
||||
process. Returning `false` cancels the window, while returning an object sets
|
||||
the `BrowserWindowConstructorOptions` used when creating the window. Note that
|
||||
this is more powerful than passing options through the feature string, as the
|
||||
renderer has more limited privileges in deciding security preferences than the
|
||||
main process.
|
||||
|
||||
### `BrowserWindowProxy` example
|
||||
|
||||
```javascript
|
||||
|
||||
// main.js
|
||||
const mainWindow = new BrowserWindow()
|
||||
|
||||
mainWindow.webContents.setWindowOpenHandler(({ url }) => {
|
||||
if (url.startsWith('https://github.com/')) {
|
||||
return { action: 'allow' }
|
||||
}
|
||||
return { action: 'deny' }
|
||||
})
|
||||
|
||||
mainWindow.webContents.on('did-create-window', (childWindow) => {
|
||||
// For example...
|
||||
childWindow.webContents('will-navigate', (e) => {
|
||||
e.preventDefault()
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
```javascript
|
||||
// renderer.js
|
||||
const windowProxy = window.open('https://github.com/', null, 'minimizable=false')
|
||||
windowProxy.postMessage('hi', '*')
|
||||
```
|
||||
process. Returning `{ action: 'deny' }` cancels the window. Returning `{
|
||||
action: 'allow', overrideBrowserWindowOptions: { ... } }` will allow opening
|
||||
the window and setting the `BrowserWindowConstructorOptions` to be used when
|
||||
creating the window. Note that this is more powerful than passing options
|
||||
through the feature string, as the renderer has more limited privileges in
|
||||
deciding security preferences than the main process.
|
||||
|
||||
### Native `Window` example
|
||||
|
||||
```javascript
|
||||
// main.js
|
||||
const mainWindow = new BrowserWindow({
|
||||
webPreferences: {
|
||||
nativeWindowOpen: true
|
||||
}
|
||||
})
|
||||
const mainWindow = new BrowserWindow()
|
||||
|
||||
// In this example, only windows with the `about:blank` url will be created.
|
||||
// All other urls will be blocked.
|
||||
@@ -134,3 +102,33 @@ mainWindow.webContents.setWindowOpenHandler(({ url }) => {
|
||||
const childWindow = window.open('', 'modal')
|
||||
childWindow.document.write('<h1>Hello</h1>')
|
||||
```
|
||||
|
||||
### `BrowserWindowProxy` example
|
||||
|
||||
```javascript
|
||||
|
||||
// main.js
|
||||
const mainWindow = new BrowserWindow({
|
||||
webPreferences: { nativeWindowOpen: false }
|
||||
})
|
||||
|
||||
mainWindow.webContents.setWindowOpenHandler(({ url }) => {
|
||||
if (url.startsWith('https://github.com/')) {
|
||||
return { action: 'allow' }
|
||||
}
|
||||
return { action: 'deny' }
|
||||
})
|
||||
|
||||
mainWindow.webContents.on('did-create-window', (childWindow) => {
|
||||
// For example...
|
||||
childWindow.webContents.on('will-navigate', (e) => {
|
||||
e.preventDefault()
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
```javascript
|
||||
// renderer.js
|
||||
const windowProxy = window.open('https://github.com/', null, 'minimizable=false')
|
||||
windowProxy.postMessage('hi', '*')
|
||||
```
|
||||
|
||||
@@ -14,7 +14,22 @@ This document uses the following convention to categorize breaking changes:
|
||||
|
||||
## Planned Breaking API Changes (14.0)
|
||||
|
||||
### API Changed: `window.(open)`
|
||||
### Removed: `app.allowRendererProcessReuse`
|
||||
|
||||
The `app.allowRendererProcessReuse` property will be removed as part of our plan to
|
||||
more closely align with Chromium's process model for security, performance and maintainability.
|
||||
|
||||
For more detailed information see [#18397](https://github.com/electron/electron/issues/18397).
|
||||
|
||||
### Removed: Browser Window Affinity
|
||||
|
||||
The `affinity` option when constructing a new `BrowserWindow` will be removed
|
||||
as part of our plan to more closely align with Chromium's process model for security,
|
||||
performance and maintainability.
|
||||
|
||||
For more detailed information see [#18397](https://github.com/electron/electron/issues/18397).
|
||||
|
||||
### API Changed: `window.open()`
|
||||
|
||||
The optional parameter `frameName` will no longer set the title of the window. This now follows the specification described by the [native documentation](https://developer.mozilla.org/en-US/docs/Web/API/Window/open#parameters) under the corresponding parameter `windowName`.
|
||||
|
||||
@@ -28,6 +43,63 @@ ensure your code works with this property enabled. It has been enabled by defau
|
||||
|
||||
You will be affected by this change if you use either `webFrame.executeJavaScript` or `webFrame.executeJavaScriptInIsolatedWorld`. You will need to ensure that values returned by either of those methods are supported by the [Context Bridge API](api/context-bridge.md#parameter--error--return-type-support) as these methods use the same value passing semantics.
|
||||
|
||||
### Default Changed: `nativeWindowOpen` defaults to `true`
|
||||
|
||||
Prior to Electron 14, `window.open` was by default shimmed to use
|
||||
`BrowserWindowProxy`. This meant that `window.open('about:blank')` did not work
|
||||
to open synchronously scriptable child windows, among other incompatibilities.
|
||||
`nativeWindowOpen` is no longer experimental, and is now the default.
|
||||
|
||||
See the documentation for [window.open in Electron](api/window-open.md)
|
||||
for more details.
|
||||
|
||||
### Removed: BrowserWindowConstructorOptions inheriting from parent windows
|
||||
|
||||
Prior to Electron 14, windows opened with `window.open` would inherit
|
||||
BrowserWindow constructor options such as `transparent` and `resizable` from
|
||||
their parent window. Beginning with Electron 14, this behavior is removed, and
|
||||
windows will not inherit any BrowserWindow constructor options from their
|
||||
parents.
|
||||
|
||||
Instead, explicitly set options for the new window with `setWindowOpenHandler`:
|
||||
|
||||
```js
|
||||
webContents.setWindowOpenHandler((details) => {
|
||||
return {
|
||||
action: 'allow',
|
||||
overrideBrowserWindowOptions: {
|
||||
// ...
|
||||
}
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
### Removed: `additionalFeatures`
|
||||
|
||||
The deprecated `additionalFeatures` property in the `new-window` and
|
||||
`did-create-window` events of WebContents has been removed. Since `new-window`
|
||||
uses positional arguments, the argument is still present, but will always be
|
||||
the empty array `[]`. (Though note, the `new-window` event itself is
|
||||
deprecated, and is replaced by `setWindowOpenHandler`.) Bare keys in window
|
||||
features will now present as keys with the value `true` in the options object.
|
||||
|
||||
```js
|
||||
// Removed in Electron 14
|
||||
// Triggered by window.open('...', '', 'my-key')
|
||||
webContents.on('did-create-window', (window, details) => {
|
||||
if (details.additionalFeatures.includes('my-key')) {
|
||||
// ...
|
||||
}
|
||||
})
|
||||
|
||||
// Replace with
|
||||
webContents.on('did-create-window', (window, details) => {
|
||||
if (details.options['my-key']) {
|
||||
// ...
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
## Planned Breaking API Changes (13.0)
|
||||
|
||||
### API Changed: `session.setPermissionCheckHandler(handler)`
|
||||
@@ -314,14 +386,6 @@ Setting `{ compress: false }` in `crashReporter.start` is deprecated. Nearly
|
||||
all crash ingestion servers support gzip compression. This option will be
|
||||
removed in a future version of Electron.
|
||||
|
||||
### Removed: Browser Window Affinity
|
||||
|
||||
The `affinity` option when constructing a new `BrowserWindow` will be removed
|
||||
as part of our plan to more closely align with Chromium's process model for security,
|
||||
performance and maintainability.
|
||||
|
||||
For more detailed information see [#18397](https://github.com/electron/electron/issues/18397).
|
||||
|
||||
### Default Changed: `enableRemoteModule` defaults to `false`
|
||||
|
||||
In Electron 9, using the remote module without explicitly enabling it via the
|
||||
|
||||
@@ -100,5 +100,7 @@ script/ - The set of all scripts Electron runs for a variety of purposes.
|
||||
└── uploaders/ - Uploads various release-related files during release.
|
||||
```
|
||||
|
||||
* **tools** - Helper scripts used by GN files.
|
||||
* Scripts put here should never be invoked by users directly, unlike those in `script`.
|
||||
* **typings** - TypeScript typings for Electron's internal code.
|
||||
* **vendor** - Source code for some third party dependencies.
|
||||
|
||||
@@ -7,9 +7,12 @@
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
<p>Drag the boxes below to somewhere in your OS (Finder/Explorer, Desktop, etc.) to copy an example markdown file.</p>
|
||||
<div style="border:2px solid black;border-radius:3px;padding:5px;display:inline-block" draggable="true" id="drag1">Drag me - File 1</div>
|
||||
<div style="border:2px solid black;border-radius:3px;padding:5px;display:inline-block" draggable="true" id="drag2">Drag me - File 2</div>
|
||||
<p>
|
||||
We are using node <script>document.write(process.versions.node)</script>,
|
||||
Chrome <script>document.write(process.versions.chrome)</script>,
|
||||
and Electron <script>document.write(process.versions.electron)</script>.
|
||||
</p>
|
||||
<a href="#" id="drag">Drag me</a>
|
||||
<script src="renderer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,28 +1,21 @@
|
||||
const { app, BrowserWindow, ipcMain, nativeImage, NativeImage } = require('electron')
|
||||
const path = require('path')
|
||||
const fs = require('fs')
|
||||
const https = require('https')
|
||||
const fs = require('fs');
|
||||
const http = require('http');
|
||||
|
||||
function createWindow() {
|
||||
function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
preload: path.join(__dirname, 'preload.js')
|
||||
nodeIntegration: true
|
||||
}
|
||||
})
|
||||
|
||||
win.loadFile('index.html')
|
||||
}
|
||||
|
||||
const iconName = path.join(__dirname, 'iconForDragAndDrop.png');
|
||||
const icon = fs.createWriteStream(iconName);
|
||||
|
||||
// Create a new file to copy - you can also copy existing files.
|
||||
fs.writeFileSync(path.join(__dirname, 'drag-and-drop-1.md'), '# First file to test drag and drop')
|
||||
fs.writeFileSync(path.join(__dirname, 'drag-and-drop-2.md'), '# Second file to test drag and drop')
|
||||
|
||||
https.get('https://img.icons8.com/ios/452/drag-and-drop.png', (response) => {
|
||||
const iconName = 'iconForDragAndDrop.png';
|
||||
const icon = fs.createWriteStream(`${process.cwd()}/${iconName}`);
|
||||
http.get('http://img.icons8.com/ios/452/drag-and-drop.png', (response) => {
|
||||
response.pipe(icon);
|
||||
});
|
||||
|
||||
@@ -30,8 +23,8 @@ app.whenReady().then(createWindow)
|
||||
|
||||
ipcMain.on('ondragstart', (event, filePath) => {
|
||||
event.sender.startDrag({
|
||||
file: path.join(__dirname, filePath),
|
||||
icon: iconName,
|
||||
file: filePath,
|
||||
icon: `${process.cwd()}/${iconName}`
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
@@ -1,8 +0,0 @@
|
||||
const { contextBridge, ipcRenderer } = require('electron')
|
||||
const path = require('path')
|
||||
|
||||
contextBridge.exposeInMainWorld('electron', {
|
||||
startDrag: (fileName) => {
|
||||
ipcRenderer.send('ondragstart', fileName)
|
||||
}
|
||||
})
|
||||
@@ -1,9 +1,9 @@
|
||||
document.getElementById('drag1').ondragstart = (event) => {
|
||||
event.preventDefault()
|
||||
window.electron.startDrag('drag-and-drop-1.md')
|
||||
}
|
||||
const { ipcRenderer } = require('electron')
|
||||
const fs = require('fs')
|
||||
|
||||
document.getElementById('drag2').ondragstart = (event) => {
|
||||
document.getElementById('drag').ondragstart = (event) => {
|
||||
const fileName = 'drag-and-drop.md'
|
||||
fs.writeFileSync(fileName, '# Test drag and drop');
|
||||
event.preventDefault()
|
||||
window.electron.startDrag('drag-and-drop-2.md')
|
||||
ipcRenderer.send('ondragstart', process.cwd() + `/${fileName}`)
|
||||
}
|
||||
|
||||
@@ -7,6 +7,10 @@
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
<p>Hit Alt+Ctrl+I on Windows or Opt+Cmd+I on Mac to see a message printed to the console.</p>
|
||||
<p>
|
||||
We are using node <script>document.write(process.versions.node)</script>,
|
||||
Chrome <script>document.write(process.versions.chrome)</script>,
|
||||
and Electron <script>document.write(process.versions.electron)</script>.
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -4,6 +4,9 @@ function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
nodeIntegration: true
|
||||
}
|
||||
})
|
||||
|
||||
win.loadFile('index.html')
|
||||
|
||||
@@ -7,6 +7,8 @@
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
<p>Hit Ctrl+I to see a message printed to the console.</p>
|
||||
We are using node <script>document.write(process.versions.node)</script>,
|
||||
Chrome <script>document.write(process.versions.chrome)</script>,
|
||||
and Electron <script>document.write(process.versions.electron)</script>.
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
|
||||
app.whenReady().then(() => {
|
||||
const win = new BrowserWindow({ width: 800, height: 600 })
|
||||
const win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: true } })
|
||||
|
||||
win.loadFile('index.html')
|
||||
win.webContents.on('before-input-event', (event, input) => {
|
||||
|
||||
@@ -7,6 +7,10 @@
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
<p>Hit Alt+Shift+I on Windows, or Opt+Cmd+I on mac to see a message printed to the console.</p>
|
||||
<p>
|
||||
We are using node <script>document.write(process.versions.node)</script>,
|
||||
Chrome <script>document.write(process.versions.chrome)</script>,
|
||||
and Electron <script>document.write(process.versions.electron)</script>.
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -4,6 +4,9 @@ function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
nodeIntegration: true
|
||||
}
|
||||
})
|
||||
|
||||
win.loadFile('index.html')
|
||||
|
||||
@@ -1,17 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
|
||||
<meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">
|
||||
<title>Hello World!</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
|
||||
<p>Hit any key with this window focused to see it captured here.</p>
|
||||
<div><span>Last Key Pressed: </span><span id="last-keypress"></span></div>
|
||||
<script src="./renderer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,35 +0,0 @@
|
||||
// Modules to control application life and create native browser window
|
||||
const {app, BrowserWindow} = require('electron')
|
||||
const path = require('path')
|
||||
|
||||
function createWindow () {
|
||||
// Create the browser window.
|
||||
const mainWindow = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
})
|
||||
|
||||
// and load the index.html of the app.
|
||||
mainWindow.loadFile('index.html')
|
||||
|
||||
}
|
||||
|
||||
// This method will be called when Electron has finished
|
||||
// initialization and is ready to create browser windows.
|
||||
// Some APIs can only be used after this event occurs.
|
||||
app.whenReady().then(() => {
|
||||
createWindow()
|
||||
|
||||
app.on('activate', function () {
|
||||
// On macOS it's common to re-create a window in the app when the
|
||||
// dock icon is clicked and there are no other windows open.
|
||||
if (BrowserWindow.getAllWindows().length === 0) createWindow()
|
||||
})
|
||||
})
|
||||
|
||||
// Quit when all windows are closed, except on macOS. There, it's common
|
||||
// for applications and their menu bar to stay active until the user quits
|
||||
// explicitly with Cmd + Q.
|
||||
app.on('window-all-closed', function () {
|
||||
if (process.platform !== 'darwin') app.quit()
|
||||
})
|
||||
@@ -1,7 +0,0 @@
|
||||
function handleKeyPress (event) {
|
||||
// You can put code here to handle the keypress.
|
||||
document.getElementById("last-keypress").innerText = event.key
|
||||
console.log(`You pressed ${event.key}`)
|
||||
}
|
||||
|
||||
window.addEventListener('keyup', handleKeyPress, true)
|
||||
@@ -1,12 +1,11 @@
|
||||
const { app, BrowserWindow, ipcMain, nativeTheme } = require('electron')
|
||||
const path = require('path')
|
||||
|
||||
function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
preload: path.join(__dirname, 'preload.js')
|
||||
nodeIntegration: true
|
||||
}
|
||||
})
|
||||
|
||||
@@ -26,18 +25,16 @@ function createWindow () {
|
||||
})
|
||||
}
|
||||
|
||||
app.whenReady().then(() => {
|
||||
createWindow()
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
})
|
||||
app.whenReady().then(createWindow)
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit()
|
||||
}
|
||||
})
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
|
||||
@@ -1,6 +0,0 @@
|
||||
const { contextBridge, ipcRenderer } = require('electron')
|
||||
|
||||
contextBridge.exposeInMainWorld('darkMode', {
|
||||
toggle: () => ipcRenderer.invoke('dark-mode:toggle'),
|
||||
system: () => ipcRenderer.invoke('dark-mode:system')
|
||||
})
|
||||
@@ -1,9 +1,11 @@
|
||||
const { ipcRenderer } = require('electron')
|
||||
|
||||
document.getElementById('toggle-dark-mode').addEventListener('click', async () => {
|
||||
const isDarkMode = await window.darkMode.toggle()
|
||||
const isDarkMode = await ipcRenderer.invoke('dark-mode:toggle')
|
||||
document.getElementById('theme-source').innerHTML = isDarkMode ? 'Dark' : 'Light'
|
||||
})
|
||||
|
||||
document.getElementById('reset-to-system').addEventListener('click', async () => {
|
||||
await window.darkMode.system()
|
||||
await ipcRenderer.invoke('dark-mode:system')
|
||||
document.getElementById('theme-source').innerHTML = 'System'
|
||||
})
|
||||
|
||||
@@ -7,6 +7,10 @@
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
<p>Right click the dock icon to see the custom menu options.</p>
|
||||
<p>
|
||||
We are using node <script>document.write(process.versions.node)</script>,
|
||||
Chrome <script>document.write(process.versions.chrome)</script>,
|
||||
and Electron <script>document.write(process.versions.electron)</script>.
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -4,6 +4,9 @@ function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
nodeIntegration: true
|
||||
}
|
||||
})
|
||||
|
||||
win.loadFile('index.html')
|
||||
@@ -24,9 +27,7 @@ const dockMenu = Menu.buildFromTemplate([
|
||||
])
|
||||
|
||||
app.whenReady().then(() => {
|
||||
if (process.platform === 'darwin') {
|
||||
app.dock.setMenu(dockMenu)
|
||||
}
|
||||
app.dock.setMenu(dockMenu)
|
||||
}).then(createWindow)
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
|
||||
15
docs/fiddles/features/offscreen-rendering/index.html
Normal file
15
docs/fiddles/features/offscreen-rendering/index.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Hello World!</title>
|
||||
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
<p>
|
||||
We are using node <script>document.write(process.versions.node)</script>,
|
||||
Chrome <script>document.write(process.versions.chrome)</script>,
|
||||
and Electron <script>document.write(process.versions.electron)</script>.
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,6 +1,5 @@
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
const fs = require('fs')
|
||||
const path = require('path')
|
||||
|
||||
app.disableHardwareAcceleration()
|
||||
|
||||
@@ -13,7 +12,7 @@ app.whenReady().then(() => {
|
||||
fs.writeFileSync('ex.png', image.toPNG())
|
||||
})
|
||||
win.webContents.setFrameRate(60)
|
||||
console.log(`The screenshot has been successfully saved to ${path.join(process.cwd(), 'ex.png')}`)
|
||||
console.log(`The screenshot has been successfully saved to ${process.cwd()}/ex.png`)
|
||||
})
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
|
||||
@@ -1,13 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Hello World!</title>
|
||||
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
|
||||
</head>
|
||||
<body>
|
||||
<h1>Connection status: <strong id='status'></strong></h1>
|
||||
|
||||
<script src="renderer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,26 +0,0 @@
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
|
||||
function createWindow () {
|
||||
const onlineStatusWindow = new BrowserWindow({
|
||||
width: 300,
|
||||
height: 200
|
||||
})
|
||||
|
||||
onlineStatusWindow.loadFile('index.html')
|
||||
}
|
||||
|
||||
app.whenReady().then(() => {
|
||||
createWindow()
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit()
|
||||
}
|
||||
})
|
||||
17
docs/fiddles/features/online-detection/main/index.html
Normal file
17
docs/fiddles/features/online-detection/main/index.html
Normal file
@@ -0,0 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Hello World!</title>
|
||||
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
<p>
|
||||
We are using node <script>document.write(process.versions.node)</script>,
|
||||
Chrome <script>document.write(process.versions.chrome)</script>,
|
||||
and Electron <script>document.write(process.versions.electron)</script>.
|
||||
</p>
|
||||
<script src="renderer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
24
docs/fiddles/features/online-detection/main/main.js
Normal file
24
docs/fiddles/features/online-detection/main/main.js
Normal file
@@ -0,0 +1,24 @@
|
||||
const { app, BrowserWindow, ipcMain } = require('electron')
|
||||
|
||||
let onlineStatusWindow
|
||||
|
||||
app.whenReady().then(() => {
|
||||
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false, webPreferences: { nodeIntegration: true } })
|
||||
onlineStatusWindow.loadURL(`file://${__dirname}/index.html`)
|
||||
})
|
||||
|
||||
ipcMain.on('online-status-changed', (event, status) => {
|
||||
console.log(status)
|
||||
})
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit()
|
||||
}
|
||||
})
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
7
docs/fiddles/features/online-detection/main/renderer.js
Normal file
7
docs/fiddles/features/online-detection/main/renderer.js
Normal file
@@ -0,0 +1,7 @@
|
||||
const { ipcRenderer } = require('electron')
|
||||
const updateOnlineStatus = () => { ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline') }
|
||||
|
||||
window.addEventListener('online', updateOnlineStatus)
|
||||
window.addEventListener('offline', updateOnlineStatus)
|
||||
|
||||
updateOnlineStatus()
|
||||
@@ -1,8 +0,0 @@
|
||||
function onlineStatusIndicator () {
|
||||
document.getElementById('status').innerHTML = navigator.onLine ? 'online' : 'offline'
|
||||
}
|
||||
|
||||
window.addEventListener('online', onlineStatusIndicator)
|
||||
window.addEventListener('offline', onlineStatusIndicator)
|
||||
|
||||
onlineStatusIndicator()
|
||||
17
docs/fiddles/features/online-detection/renderer/index.html
Normal file
17
docs/fiddles/features/online-detection/renderer/index.html
Normal file
@@ -0,0 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Hello World!</title>
|
||||
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
<p>
|
||||
We are using node <script>document.write(process.versions.node)</script>,
|
||||
Chrome <script>document.write(process.versions.chrome)</script>,
|
||||
and Electron <script>document.write(process.versions.electron)</script>.
|
||||
</p>
|
||||
<script src="renderer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
20
docs/fiddles/features/online-detection/renderer/main.js
Normal file
20
docs/fiddles/features/online-detection/renderer/main.js
Normal file
@@ -0,0 +1,20 @@
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
|
||||
let onlineStatusWindow
|
||||
|
||||
app.whenReady().then(() => {
|
||||
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
|
||||
onlineStatusWindow.loadURL(`file://${__dirname}/index.html`)
|
||||
})
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit()
|
||||
}
|
||||
})
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,6 @@
|
||||
const alertOnlineStatus = () => { window.alert(navigator.onLine ? 'online' : 'offline') }
|
||||
|
||||
window.addEventListener('online', alertOnlineStatus)
|
||||
window.addEventListener('offline', alertOnlineStatus)
|
||||
|
||||
alertOnlineStatus()
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 54 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 32 KiB |
@@ -2,14 +2,15 @@
|
||||
|
||||
These are the guidelines for writing Electron documentation.
|
||||
|
||||
## Headings
|
||||
## Titles
|
||||
|
||||
* Each page must have a single `#`-level title at the top.
|
||||
* Chapters in the same page must have `##`-level headings.
|
||||
* Sub-chapters need to increase the number of `#` in the heading according to
|
||||
* Chapters in the same page must have `##`-level titles.
|
||||
* Sub-chapters need to increase the number of `#` in the title according to
|
||||
their nesting depth.
|
||||
* The page's title must follow [APA title case][title-case].
|
||||
* All chapters must follow [APA sentence case][sentence-case].
|
||||
* All words in the page's title must be capitalized, except for conjunctions
|
||||
like "of" and "and" .
|
||||
* Only the first word of a chapter title must be capitalized.
|
||||
|
||||
Using `Quick Start` as example:
|
||||
|
||||
@@ -43,20 +44,12 @@ For API references, there are exceptions to this rule.
|
||||
|
||||
## Markdown rules
|
||||
|
||||
This repository uses the [`markdownlint`][markdownlint] package to enforce consistent
|
||||
Markdown styling. For the exact rules, see the `.markdownlint.json` file in the root
|
||||
folder.
|
||||
|
||||
There are a few style guidelines that aren't covered by the linter rules:
|
||||
|
||||
<!--TODO(erickzhao): make sure this matches with the lint:markdownlint task-->
|
||||
* Use `sh` instead of `cmd` in code blocks (due to the syntax highlighter).
|
||||
* Keep line lengths between 80 and 100 characters if possible for readability
|
||||
purposes.
|
||||
* Lines should be wrapped at 80 columns.
|
||||
* No nesting lists more than 2 levels (due to the markdown renderer).
|
||||
* All `js` and `javascript` code blocks are linted with
|
||||
[standard-markdown](https://www.npmjs.com/package/standard-markdown).
|
||||
* For unordered lists, use asterisks instead of dashes.
|
||||
* For unordered lists, use asterisks instead of dashes
|
||||
|
||||
## Picking words
|
||||
|
||||
@@ -67,15 +60,14 @@ There are a few style guidelines that aren't covered by the linter rules:
|
||||
|
||||
The following rules only apply to the documentation of APIs.
|
||||
|
||||
### Title and description
|
||||
### Page title
|
||||
|
||||
Each module's API doc must use the actual object name returned by `require('electron')`
|
||||
as its title (such as `BrowserWindow`, `autoUpdater`, and `session`).
|
||||
Each page must use the actual object name returned by `require('electron')`
|
||||
as the title, such as `BrowserWindow`, `autoUpdater`, and `session`.
|
||||
|
||||
Directly under the page title, add a one-line description of the module
|
||||
as a markdown quote (beginning with `>`).
|
||||
Under the page title must be a one-line description starting with `>`.
|
||||
|
||||
Using the `session` module as an example:
|
||||
Using `session` as example:
|
||||
|
||||
```markdown
|
||||
# session
|
||||
@@ -107,19 +99,14 @@ Using `autoUpdater` as an example:
|
||||
* API classes or classes that are part of modules must be listed under a
|
||||
`## Class: TheClassName` chapter.
|
||||
* One page can have multiple classes.
|
||||
* Constructors must be listed with `###`-level headings.
|
||||
* [Static Methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static)
|
||||
must be listed under a `### Static Methods` chapter.
|
||||
* [Instance Methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes#Prototype_methods)
|
||||
must be listed under an `### Instance Methods` chapter.
|
||||
* All methods that have a return value must start their description with
|
||||
"Returns `[TYPE]` - [Return description]"
|
||||
* If the method returns an `Object`, its structure can be specified using a colon
|
||||
followed by a newline then an unordered list of properties in the same style as
|
||||
function parameters.
|
||||
* Constructors must be listed with `###`-level titles.
|
||||
* [Static Methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static) must be listed under a `### Static Methods` chapter.
|
||||
* [Instance Methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes#Prototype_methods) must be listed under an `### Instance Methods` chapter.
|
||||
* All methods that have a return value must start their description with "Returns `[TYPE]` - Return description"
|
||||
* If the method returns an `Object`, its structure can be specified using a colon followed by a newline then an unordered list of properties in the same style as function parameters.
|
||||
* Instance Events must be listed under an `### Instance Events` chapter.
|
||||
* Instance Properties must be listed under an `### Instance Properties` chapter.
|
||||
* Instance Properties must start with "A [Property Type] ..."
|
||||
* Instance properties must start with "A [Property Type] ..."
|
||||
|
||||
Using the `Session` and `Cookies` classes as an example:
|
||||
|
||||
@@ -155,7 +142,7 @@ Using the `Session` and `Cookies` classes as an example:
|
||||
#### `cookies.get(filter, callback)`
|
||||
```
|
||||
|
||||
### Methods and their arguments
|
||||
### Methods
|
||||
|
||||
The methods chapter must be in the following form:
|
||||
|
||||
@@ -168,12 +155,8 @@ The methods chapter must be in the following form:
|
||||
...
|
||||
```
|
||||
|
||||
#### Heading level
|
||||
|
||||
The heading can be `###` or `####`-levels depending on whether the method
|
||||
belongs to a module or a class.
|
||||
|
||||
#### Function signature
|
||||
The title can be `###` or `####`-levels depending on whether it is a method of
|
||||
a module or a class.
|
||||
|
||||
For modules, the `objectName` is the module's name. For classes, it must be the
|
||||
name of the instance of the class, and must not be the same as the module's
|
||||
@@ -182,33 +165,23 @@ name.
|
||||
For example, the methods of the `Session` class under the `session` module must
|
||||
use `ses` as the `objectName`.
|
||||
|
||||
Optional arguments are notated by square brackets `[]` surrounding the optional
|
||||
argument as well as the comma required if this optional argument follows another
|
||||
The optional arguments are notated by square brackets `[]` surrounding the optional argument
|
||||
as well as the comma required if this optional argument follows another
|
||||
argument:
|
||||
|
||||
```markdown
|
||||
```sh
|
||||
required[, optional]
|
||||
```
|
||||
|
||||
#### Argument descriptions
|
||||
Below the method is more detailed information on each of the arguments. The type
|
||||
of argument is notated by either the common types:
|
||||
|
||||
More detailed information on each of the arguments is noted in an unordered list
|
||||
below the method. The type of argument is notated by either JavaScript primitives
|
||||
(e.g. `String`, `Promise`, or `Object`), a custom API structure like Electron's
|
||||
[`Cookie`](api/structures/cookie.md), or the wildcard `any`.
|
||||
|
||||
If the argument is of type `Array`, use `[]` shorthand with the type of value
|
||||
inside the array (for example,`any[]` or `String[]`).
|
||||
|
||||
If the argument is of type `Promise`, parametrize the type with what the promise
|
||||
resolves to (for example, `Promise<void>` or `Promise<String>`).
|
||||
|
||||
If an argument can be of multiple types, separate the types with `|`.
|
||||
|
||||
The description for `Function` type arguments should make it clear how it may be
|
||||
called and list the types of the parameters that will be passed to it.
|
||||
|
||||
#### Platform-specific functionality
|
||||
* [`String`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
|
||||
* [`Number`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number)
|
||||
* [`Object`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)
|
||||
* [`Array`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
|
||||
* [`Boolean`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)
|
||||
* Or a custom type like Electron's [`WebContent`](api/web-contents.md)
|
||||
|
||||
If an argument or a method is unique to certain platforms, those platforms are
|
||||
denoted using a space-delimited italicized list following the datatype. Values
|
||||
@@ -218,6 +191,12 @@ can be `macOS`, `Windows` or `Linux`.
|
||||
* `animate` Boolean (optional) _macOS_ _Windows_ - Animate the thing.
|
||||
```
|
||||
|
||||
`Array` type arguments must specify what elements the array may include in
|
||||
the description below.
|
||||
|
||||
The description for `Function` type arguments should make it clear how it may be
|
||||
called and list the types of the parameters that will be passed to it.
|
||||
|
||||
### Events
|
||||
|
||||
The events chapter must be in following form:
|
||||
@@ -232,8 +211,8 @@ Returns:
|
||||
...
|
||||
```
|
||||
|
||||
The heading can be `###` or `####`-levels depending on whether the event
|
||||
belongs to a module or a class.
|
||||
The title can be `###` or `####`-levels depending on whether it is an event of
|
||||
a module or a class.
|
||||
|
||||
The arguments of an event follow the same rules as methods.
|
||||
|
||||
@@ -247,13 +226,9 @@ The properties chapter must be in following form:
|
||||
...
|
||||
```
|
||||
|
||||
The heading can be `###` or `####`-levels depending on whether the property
|
||||
belongs to a module or a class.
|
||||
The title can be `###` or `####`-levels depending on whether it is a property of
|
||||
a module or a class.
|
||||
|
||||
## Documentation translations
|
||||
## Documentation Translations
|
||||
|
||||
See [electron/i18n](https://github.com/electron/i18n#readme)
|
||||
|
||||
[title-case]: https://apastyle.apa.org/style-grammar-guidelines/capitalization/title-case
|
||||
[sentence-case]: https://apastyle.apa.org/style-grammar-guidelines/capitalization/sentence-case
|
||||
[markdownlint]: https://github.com/DavidAnson/markdownlint
|
||||
|
||||
@@ -18,7 +18,7 @@ distributable Electron application, such as bundling your application,
|
||||
rebranding the executable, and setting the right icons.
|
||||
|
||||
You can check the example of how to package your app with `electron-forge` in
|
||||
the [Quick Start guide](quick-start.md#package-and-distribute-your-application).
|
||||
our [Quick Start Guide](quick-start.md#package-and-distribute-the-application).
|
||||
|
||||
## Manual distribution
|
||||
|
||||
|
||||
@@ -190,7 +190,6 @@ it may be worth your time to shop around. Popular resellers include:
|
||||
|
||||
* [digicert](https://www.digicert.com/code-signing/microsoft-authenticode.htm)
|
||||
* [Sectigo](https://sectigo.com/ssl-certificates-tls/code-signing)
|
||||
* [GoDaddy](https://au.godaddy.com/web-security/code-signing-certificate)
|
||||
* Amongst others, please shop around to find one that suits your needs, Google
|
||||
is your friend 😄
|
||||
|
||||
|
||||
@@ -47,18 +47,18 @@ of this theming, due to the use of the macOS 10.14 SDK.
|
||||
|
||||
## Example
|
||||
|
||||
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.
|
||||
We'll start with a working application from the
|
||||
[Quick Start Guide](quick-start.md) and add functionality gradually.
|
||||
|
||||
```javascript fiddle='docs/fiddles/features/macos-dark-mode'
|
||||
First, let's edit our interface so users can toggle between light and dark
|
||||
modes. This basic UI contains buttons to change the `nativeTheme.themeSource`
|
||||
setting and a text element indicating which `themeSource` value is selected.
|
||||
By default, Electron follows the system's dark mode preference, so we
|
||||
will hardcode the theme source as "System".
|
||||
|
||||
```
|
||||
Add the following lines to the `index.html` file:
|
||||
|
||||
### How does this work?
|
||||
|
||||
Starting with the `index.html` file:
|
||||
|
||||
```html title='index.html'
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
@@ -80,70 +80,65 @@ Starting with the `index.html` file:
|
||||
</html>
|
||||
```
|
||||
|
||||
And the `style.css` file:
|
||||
Next, add [event listeners](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)
|
||||
that listen for `click` events on the toggle buttons. Because the `nativeTheme`
|
||||
module only exposed in the Main process, you need to set up each listener's
|
||||
callback to use IPC to send messages to and handle responses from the Main
|
||||
process:
|
||||
|
||||
```css title='style.css'
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body { background: #333; color: white; }
|
||||
}
|
||||
* when the "Toggle Dark Mode" button is clicked, we send the
|
||||
`dark-mode:toggle` message (event) to tell the Main process to trigger a theme
|
||||
change, and update the "Current Theme Source" label in the UI based on the
|
||||
response from the Main process.
|
||||
* when the "Reset to System Theme" button is clicked, we send the
|
||||
`dark-mode:system` message (event) to tell the Main process to use the system
|
||||
color scheme, and update the "Current Theme Source" label to `System`.
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
body { background: #ddd; color: black; }
|
||||
}
|
||||
```
|
||||
To add listeners and handlers, add the following lines to the `renderer.js` file:
|
||||
|
||||
The example renders an HTML page with a couple elements. The `<strong id="theme-source">`
|
||||
element shows which theme is currently selected, and the two `<button>` elements are the
|
||||
controls. The CSS file uses the [`prefers-color-scheme`][prefers-color-scheme] media query
|
||||
to set the `<body>` element background and text colors.
|
||||
```javascript
|
||||
const { ipcRenderer } = require('electron')
|
||||
|
||||
The `preload.js` script adds a new API to the `window` object called `darkMode`. This API
|
||||
exposes two IPC channels to the renderer process, `'dark-mode:toggle'` and `'dark-mode:system'`.
|
||||
It also assigns two methods, `toggle` and `system`, which pass messages from the renderer to the
|
||||
main process.
|
||||
|
||||
```js title='preload.js'
|
||||
const { contextBridge, ipcRenderer } = require('electron')
|
||||
|
||||
contextBridge.exposeInMainWorld('darkMode', {
|
||||
toggle: () => ipcRenderer.invoke('dark-mode:toggle'),
|
||||
system: () => ipcRenderer.invoke('dark-mode:system')
|
||||
})
|
||||
```
|
||||
|
||||
Now the renderer process can communicate with the main process securely and perform the necessary
|
||||
mutations to the `nativeTheme` object.
|
||||
|
||||
The `renderer.js` file is responsible for controlling the `<button>` functionality.
|
||||
|
||||
```js title='renderer.js'
|
||||
document.getElementById('toggle-dark-mode').addEventListener('click', async () => {
|
||||
const isDarkMode = await window.darkMode.toggle()
|
||||
const isDarkMode = await ipcRenderer.invoke('dark-mode:toggle')
|
||||
document.getElementById('theme-source').innerHTML = isDarkMode ? 'Dark' : 'Light'
|
||||
})
|
||||
|
||||
document.getElementById('reset-to-system').addEventListener('click', async () => {
|
||||
await window.darkMode.system()
|
||||
await ipcRenderer.invoke('dark-mode:system')
|
||||
document.getElementById('theme-source').innerHTML = 'System'
|
||||
})
|
||||
```
|
||||
|
||||
Using `addEventListener`, the `renderer.js` file adds `'click'` [event listeners][event-listeners]
|
||||
to each button element. Each event listener handler makes calls to the respective `window.darkMode`
|
||||
API methods.
|
||||
If you run your code at this point, you'll see that your buttons don't do
|
||||
anything just yet, and your Main process will output an error like this when
|
||||
you click on your buttons:
|
||||
`Error occurred in handler for 'dark-mode:toggle': No handler registered for 'dark-mode:toggle'`
|
||||
This is expected — we haven't actually touched any `nativeTheme` code yet.
|
||||
|
||||
Finally, the `main.js` file represents the main process and contains the actual `nativeTheme` API.
|
||||
Now that we're done wiring the IPC from the Renderer's side, the next step
|
||||
is to update the `main.js` file to handle events from the Renderer process.
|
||||
|
||||
```js
|
||||
Depending on the received event, we update the
|
||||
[`nativeTheme.themeSource`](../api/native-theme.md#nativethemethemesource)
|
||||
property to apply the desired theme on the system's native UI elements
|
||||
(e.g. context menus) and propagate the preferred color scheme to the Renderer
|
||||
process:
|
||||
|
||||
* Upon receiving `dark-mode:toggle`, we check if the dark theme is currently
|
||||
active using the `nativeTheme.shouldUseDarkColors` property, and set the
|
||||
`themeSource` to the opposite theme.
|
||||
* Upon receiving `dark-mode:system`, we reset the `themeSource` to `system`.
|
||||
|
||||
```javascript
|
||||
const { app, BrowserWindow, ipcMain, nativeTheme } = require('electron')
|
||||
const path = require('path')
|
||||
|
||||
function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
preload: path.join(__dirname, 'preload.js')
|
||||
nodeIntegration: true
|
||||
}
|
||||
})
|
||||
|
||||
@@ -159,41 +154,44 @@ function createWindow () {
|
||||
})
|
||||
|
||||
ipcMain.handle('dark-mode:system', () => {
|
||||
nativeTheme.themeSouce = 'system'
|
||||
nativeTheme.themeSource = 'system'
|
||||
})
|
||||
}
|
||||
|
||||
app.whenReady().then(() => {
|
||||
createWindow()
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
})
|
||||
app.whenReady().then(createWindow)
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit()
|
||||
}
|
||||
})
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
The `ipcMain.handle` methods are how the main process responds to the click events from the buttons
|
||||
on the HTML page.
|
||||
The final step is to add a bit of styling to enable dark mode for the web parts
|
||||
of the UI by leveraging the [`prefers-color-scheme`][prefer-color-scheme] CSS
|
||||
attribute. The value of `prefers-color-scheme` will follow your
|
||||
`nativeTheme.themeSource` setting.
|
||||
|
||||
The `'dark-mode:toggle'` IPC channel handler method checks the `shouldUseDarkColors` boolean property,
|
||||
sets the corresponding `themeSource`, and then returns the current `shouldUseDarkColors` property.
|
||||
Looking back on the renderer process event listener for this IPC channel, the return value from this
|
||||
handler is utilized to assign the correct text to the `<strong id='theme-source'>` element.
|
||||
Create a `styles.css` file and add the following lines:
|
||||
|
||||
The `'dark-mode:system'` IPC channel handler method assigns the string `'system'` to the `themeSource`
|
||||
and returns nothing. This also corresponds with the relative renderer process event listener as the
|
||||
method is awaited with no return value expected.
|
||||
```css fiddle='docs/fiddles/features/macos-dark-mode'
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body { background: #333; color: white; }
|
||||
}
|
||||
|
||||
Run the example using Electron Fiddle and then click the "Toggle Dark Mode" button; the app should
|
||||
start alternating between a light and dark background color.
|
||||
@media (prefers-color-scheme: light) {
|
||||
body { background: #ddd; color: black; }
|
||||
}
|
||||
```
|
||||
|
||||
After launching the Electron application, you can change modes or reset the
|
||||
theme to system default by clicking corresponding buttons:
|
||||
|
||||

|
||||
|
||||
@@ -201,5 +199,4 @@ Run the example using Electron Fiddle and then click the "Toggle Dark Mode" butt
|
||||
[electron-forge]: https://www.electronforge.io/
|
||||
[electron-packager]: https://github.com/electron/electron-packager
|
||||
[packager-darwindarkmode-api]: https://electron.github.io/electron-packager/master/interfaces/electronpackager.options.html#darwindarkmodesupport
|
||||
[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
|
||||
[prefer-color-scheme]: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme
|
||||
|
||||
@@ -11,19 +11,14 @@ npm install electron --save-dev
|
||||
See the [Electron versioning doc][versioning] for info on how to
|
||||
manage Electron versions in your apps.
|
||||
|
||||
## Running Electron ad-hoc
|
||||
## Global Installation
|
||||
|
||||
If you're in a pinch and would prefer to not use `npm install` in your local
|
||||
project, you can also run Electron ad-hoc using the [`npx`][npx] command runner
|
||||
bundled with `npm`:
|
||||
You can also install the `electron` command globally in your `$PATH`:
|
||||
|
||||
```sh
|
||||
npx electron .
|
||||
npm install electron -g
|
||||
```
|
||||
|
||||
The above command will run the current working directory with Electron. Note that
|
||||
any dependencies in your app will not be installed.
|
||||
|
||||
## Customization
|
||||
|
||||
If you want to change the architecture that is downloaded (e.g., `ia32` on an
|
||||
@@ -183,7 +178,6 @@ If you need to force a re-download of the asset and the SHASUM file set the
|
||||
|
||||
[npm]: https://docs.npmjs.com
|
||||
[versioning]: ./electron-versioning.md
|
||||
[npx]: https://docs.npmjs.com/cli/v7/commands/npx
|
||||
[releases]: https://github.com/electron/electron/releases
|
||||
[proxy-env-10]: https://github.com/gajus/global-agent/blob/v2.1.5/README.md#environment-variables
|
||||
[proxy-env]: https://github.com/np-maintain/global-tunnel/blob/v2.7.1/README.md#auto-config
|
||||
|
||||
@@ -1,59 +0,0 @@
|
||||
# Introduction
|
||||
|
||||
Welcome to the Electron documentation! If this is your first time developing
|
||||
an Electron app, read through this Getting Started section to get familiar with the
|
||||
basics. Otherwise, feel free to explore our guides and API documentation!
|
||||
|
||||
## What is Electron?
|
||||
|
||||
Electron is a framework for building desktop applications using JavaScript,
|
||||
HTML, and CSS. By embedding [Chromium][chromium] and [Node.js][node] into its
|
||||
binary, Electron allows you to maintain one JavaScript codebase and create
|
||||
cross-platform apps that work on Windows, macOS, and Linux — no native development
|
||||
experience required.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
These docs operate under the assumption that the reader is familiar with both
|
||||
Node.js and general web development. If you need to get more comfortable with
|
||||
either of these areas, we recommend the following resources:
|
||||
|
||||
* [Getting started with the Web (MDN)][mdn-guide]
|
||||
* [Introduction to Node.js][node-guide]
|
||||
|
||||
Moreover, you'll have a better time understanding how Electron works if you get
|
||||
acquainted with Chromium's process model. You can get a brief overview of
|
||||
Chrome architecture with the [Chrome comic][comic], which was released alongside
|
||||
Chrome's launch back in 2008. Although it's been over a decade since then, the
|
||||
core principles introduced in the comic remain helpful to understand Electron.
|
||||
|
||||
## Running examples with Electron Fiddle
|
||||
|
||||
[Electron Fiddle][fiddle] is a sandbox app written with Electron and supported by
|
||||
Electron's maintainers. We highly recommend installing it as a learning tool to
|
||||
experiment with Electron's APIs or to prototype features during development.
|
||||
|
||||
Fiddle also integrates nicely with our documentation. When browsing through examples
|
||||
in our tutorials, you'll frequently see an "Open in Electron Fiddle" button underneath
|
||||
a code block. If you have Fiddle installed, this button will open a
|
||||
`fiddle.electronjs.org` link that will automatically load the example into Fiddle,
|
||||
no copy-pasting required.
|
||||
|
||||
## Getting help
|
||||
|
||||
Are you getting stuck anywhere? Here are a few links to places to look:
|
||||
|
||||
* If you need help with developing your app, our [community Discord server][discord]
|
||||
is a great place to get advice from other Electron app developers.
|
||||
* If you suspect you're running into a bug with the `electron` package, please check
|
||||
the [GitHub issue tracker][issue-tracker] to see if any existing issues match your
|
||||
problem. If not, feel free to fill out our bug report template and submit a new issue.
|
||||
|
||||
[chromium](https://www.chromium.org/)
|
||||
[node](https://nodejs.org/)
|
||||
[mdn-guide](https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web)
|
||||
[node-guide](https://nodejs.dev/learn)
|
||||
[comic](https://www.google.com/googlebooks/chrome/)
|
||||
[fiddle](https://electronjs.org/fiddle)
|
||||
[issue-tracker](https://github.com/electron/electron/issues)
|
||||
[discord](https://discord.gg/electron)
|
||||
@@ -81,17 +81,11 @@ If you want to handle keyboard shortcuts within a [BrowserWindow], you can
|
||||
listen for the `keyup` and `keydown` [DOM events][dom-events] inside the
|
||||
renderer process using the [addEventListener() API][addEventListener-api].
|
||||
|
||||
```javascript fiddle='docs/fiddles/features/keyboard-shortcuts/web-apis|focus=renderer.js'
|
||||
function handleKeyPress(event) {
|
||||
// You can put code here to handle the keypress.
|
||||
document.getElementById("last-keypress").innerText = event.key;
|
||||
console.log(`You pressed ${event.key}`);
|
||||
}
|
||||
|
||||
window.addEventListener('keyup', handleKeyPress, true);
|
||||
```js
|
||||
window.addEventListener('keyup', doSomething, true)
|
||||
```
|
||||
|
||||
> Note: the third parameter `true` indicates that the listener will always receive
|
||||
Note the third parameter `true` indicates that the listener will always receive
|
||||
key presses before other listeners so they can't have `stopPropagation()`
|
||||
called on them.
|
||||
|
||||
@@ -101,6 +95,8 @@ The [`before-input-event`](../api/web-contents.md#event-before-input-event) even
|
||||
is emitted before dispatching `keydown` and `keyup` events in the page. It can
|
||||
be used to catch and handle custom shortcuts that are not visible in the menu.
|
||||
|
||||
##### Example
|
||||
|
||||
Starting with a working application from the
|
||||
[Quick Start Guide](quick-start.md), update the `main.js` file with the
|
||||
following lines:
|
||||
@@ -109,7 +105,7 @@ following lines:
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
|
||||
app.whenReady().then(() => {
|
||||
const win = new BrowserWindow({ width: 800, height: 600 })
|
||||
const win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: true } })
|
||||
|
||||
win.loadFile('index.html')
|
||||
win.webContents.on('before-input-event', (event, input) => {
|
||||
|
||||
@@ -1,111 +1,53 @@
|
||||
# Mac App Store Submission Guide
|
||||
|
||||
This guide provides information on:
|
||||
Since v0.34.0, Electron allows submitting packaged apps to the Mac App Store
|
||||
(MAS). This guide provides information on: how to submit your app and the
|
||||
limitations of the MAS build.
|
||||
|
||||
* How to sign Electron apps on macOS;
|
||||
* How to submit Electron apps to Mac App Store (MAS);
|
||||
* The limitations of the MAS build.
|
||||
**Note:** Submitting an app to Mac App Store requires enrolling in the [Apple Developer
|
||||
Program][developer-program], which costs money.
|
||||
|
||||
## Requirements
|
||||
## How to Submit Your App
|
||||
|
||||
To sign Electron apps, the following tools must be installed first:
|
||||
The following steps introduce a simple way to submit your app to Mac App Store.
|
||||
However, these steps do not ensure your app will be approved by Apple; you
|
||||
still need to read Apple's [Submitting Your App][submitting-your-app] guide on
|
||||
how to meet the Mac App Store requirements.
|
||||
|
||||
* Xcode 11 or above.
|
||||
* The [electron-osx-sign][electron-osx-sign] npm module.
|
||||
### Get Certificate
|
||||
|
||||
You also have to register an Apple Developer account and join the
|
||||
[Apple Developer Program][developer-program].
|
||||
To submit your app to the Mac App Store, you first must get a certificate from
|
||||
Apple. You can follow these [existing guides][nwjs-guide] on web.
|
||||
|
||||
## Sign Electron apps
|
||||
### Get Team ID
|
||||
|
||||
Electron apps can be distributed through Mac App Store or outside it. Each way
|
||||
requires different ways of signing and testing. This guide focuses on
|
||||
distribution via Mac App Store, but will also mention other methods.
|
||||
Before signing your app, you need to know the Team ID of your account. To locate
|
||||
your Team ID, Sign in to [Apple Developer Center](https://developer.apple.com/account/),
|
||||
and click Membership in the sidebar. Your Team ID appears in the Membership
|
||||
Information section under the team name.
|
||||
|
||||
The following steps describe how to get the certificates from Apple, how to sign
|
||||
Electron apps, and how to test them.
|
||||
### Sign Your App
|
||||
|
||||
### Get certificates
|
||||
After finishing the preparation work, you can package your app by following
|
||||
[Application Distribution](application-distribution.md), and then proceed to
|
||||
signing your app.
|
||||
|
||||
The simplest way to get signing certificates is to use Xcode:
|
||||
First, you have to add a `ElectronTeamID` key to your app's `Info.plist`, which
|
||||
has your Team ID as its value:
|
||||
|
||||
1. Open Xcode and open "Accounts" preferences;
|
||||
2. Sign in with your Apple account;
|
||||
3. Select a team and click "Manage Certificates";
|
||||
4. In the lower-left corner of the signing certificates sheet, click the Add
|
||||
button (+), and add following certificates:
|
||||
* "Apple Development"
|
||||
* "Apple Distribution"
|
||||
```xml
|
||||
<plist version="1.0">
|
||||
<dict>
|
||||
...
|
||||
<key>ElectronTeamID</key>
|
||||
<string>TEAM_ID</string>
|
||||
</dict>
|
||||
</plist>
|
||||
```
|
||||
|
||||
The "Apple Development" certificate is used to sign apps for development and
|
||||
testing, on machines that have been registered on Apple Developer website. The
|
||||
method of registration will be described in
|
||||
[Prepare provisioning profile](#prepare-provisioning-profile).
|
||||
Then, you need to prepare three entitlements files.
|
||||
|
||||
Apps signed with the "Apple Development" certificate cannot be submitted to Mac
|
||||
App Store. For that purpose, apps must be signed with the "Apple Distribution"
|
||||
certificate instead. But note that apps signed with the "Apple Distribution"
|
||||
certificate cannot run directly, they must be re-signed by Apple to be able to
|
||||
run, which will only be possible after being downloaded from the Mac App Store.
|
||||
|
||||
#### Other certificates
|
||||
|
||||
You may notice that there are also other kinds of certificates.
|
||||
|
||||
The "Developer ID Application" certificate is used to sign apps before
|
||||
distributing them outside the Mac App Store.
|
||||
|
||||
The "Developer ID Installer" and "Mac Installer Distribution" certificates are
|
||||
used to sign the Mac Installer Package instead of the app itself. Most Electron
|
||||
apps do not use Mac Installer Package so they are generally not needed.
|
||||
|
||||
The full list of certificate types can be found
|
||||
[here](https://help.apple.com/xcode/mac/current/#/dev80c6204ec).
|
||||
|
||||
Apps signed with "Apple Development" and "Apple Distribution" certificates can
|
||||
only run under [App Sandbox][app-sandboxing], so they must use the MAS build of
|
||||
Electron. However, the "Developer ID Application" certificate does not have this
|
||||
restrictions, so apps signed with it can use either the normal build or the MAS
|
||||
build of Electron.
|
||||
|
||||
#### Legacy certificate names
|
||||
|
||||
Apple has been changing the names of certificates during past years, you might
|
||||
encounter them when reading old documentations, and some utilities are still
|
||||
using one of the old names.
|
||||
|
||||
* The "Apple Distribution" certificate was also named as "3rd Party Mac
|
||||
Developer Application" and "Mac App Distribution".
|
||||
* The "Apple Development" certificate was also named as "Mac Developer" and
|
||||
"Development".
|
||||
|
||||
### Prepare provisioning profile
|
||||
|
||||
If you want to test your app on your local machine before submitting your app to
|
||||
the Mac App Store, you have to sign the app with the "Apple Development"
|
||||
certificate with the provisioning profile embedded in the app bundle.
|
||||
|
||||
To [create a provisioning profile](https://help.apple.com/developer-account/#/devf2eb157f8),
|
||||
you can follow the below steps:
|
||||
|
||||
1. Open the "Certificates, Identifiers & Profiles" page on the
|
||||
[Apple Developer](https://developer.apple.com/account) website.
|
||||
2. Add a new App ID for your app in the "Identifiers" page.
|
||||
3. Register your local machine in the "Devices" page. You can find your
|
||||
machine's "Device ID" in the "Hardware" page of the "System Information" app.
|
||||
4. Register a new Provisioning Profile in the "Profiles" page, and download it
|
||||
to `/path/to/yourapp.provisionprofile`.
|
||||
|
||||
### Enable Apple's App Sandbox
|
||||
|
||||
Apps submitted to the Mac App Store must run under Apple's
|
||||
[App Sandbox][app-sandboxing], and only the MAS build of Electron can run with
|
||||
the App Sandbox. The standard darwin build of Electron will fail to launch
|
||||
when run under App Sandbox.
|
||||
|
||||
When signing the app with `electron-osx-sign`, it will automatically add the
|
||||
necessary entitlements to your app's entitlements, but if you are using custom
|
||||
entitlements, you must ensure App Sandbox capacity is added:
|
||||
`child.plist`:
|
||||
|
||||
```xml
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
@@ -114,14 +56,13 @@ entitlements, you must ensure App Sandbox capacity is added:
|
||||
<dict>
|
||||
<key>com.apple.security.app-sandbox</key>
|
||||
<true/>
|
||||
<key>com.apple.security.inherit</key>
|
||||
<true/>
|
||||
</dict>
|
||||
</plist>
|
||||
```
|
||||
|
||||
#### Extra steps without `electron-osx-sign`
|
||||
|
||||
If you are signing your app without using `electron-osx-sign`, you must ensure
|
||||
the app bundle's entitlements have at least following keys:
|
||||
`parent.plist`:
|
||||
|
||||
```xml
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
@@ -138,11 +79,7 @@ the app bundle's entitlements have at least following keys:
|
||||
</plist>
|
||||
```
|
||||
|
||||
The `TEAM_ID` should be replaced with your Apple Developer account's Team ID,
|
||||
and the `your.bundle.id` should be replaced with the App ID of the app.
|
||||
|
||||
And the following entitlements must be added to the binaries and helpers in
|
||||
the app's bundle:
|
||||
`loginhelper.plist`:
|
||||
|
||||
```xml
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
@@ -151,97 +88,80 @@ the app's bundle:
|
||||
<dict>
|
||||
<key>com.apple.security.app-sandbox</key>
|
||||
<true/>
|
||||
<key>com.apple.security.inherit</key>
|
||||
<true/>
|
||||
</dict>
|
||||
</plist>
|
||||
```
|
||||
|
||||
And the app bundle's `Info.plist` must include `ElectronTeamID` key, which has
|
||||
your Apple Developer account's Team ID as its value:
|
||||
You have to replace `TEAM_ID` with your Team ID, and replace `your.bundle.id`
|
||||
with the Bundle ID of your app.
|
||||
|
||||
```xml
|
||||
<plist version="1.0">
|
||||
<dict>
|
||||
...
|
||||
<key>ElectronTeamID</key>
|
||||
<string>TEAM_ID</string>
|
||||
</dict>
|
||||
</plist>
|
||||
And then sign your app with the following script:
|
||||
|
||||
```sh
|
||||
#!/bin/bash
|
||||
|
||||
# Name of your app.
|
||||
APP="YourApp"
|
||||
# The path of your app to sign.
|
||||
APP_PATH="/path/to/YourApp.app"
|
||||
# The path to the location you want to put the signed package.
|
||||
RESULT_PATH="~/Desktop/$APP.pkg"
|
||||
# The name of certificates you requested.
|
||||
APP_KEY="3rd Party Mac Developer Application: Company Name (APPIDENTITY)"
|
||||
INSTALLER_KEY="3rd Party Mac Developer Installer: Company Name (APPIDENTITY)"
|
||||
# The path of your plist files.
|
||||
CHILD_PLIST="/path/to/child.plist"
|
||||
PARENT_PLIST="/path/to/parent.plist"
|
||||
LOGINHELPER_PLIST="/path/to/loginhelper.plist"
|
||||
|
||||
FRAMEWORKS_PATH="$APP_PATH/Contents/Frameworks"
|
||||
|
||||
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Electron Framework"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Libraries/libffmpeg.dylib"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Libraries/libnode.dylib"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/Electron Framework.framework"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/$APP Helper.app/Contents/MacOS/$APP Helper"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$FRAMEWORKS_PATH/$APP Helper.app/"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$LOGINHELPER_PLIST" "$APP_PATH/Contents/Library/LoginItems/$APP Login Helper.app/Contents/MacOS/$APP Login Helper"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$LOGINHELPER_PLIST" "$APP_PATH/Contents/Library/LoginItems/$APP Login Helper.app/"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$CHILD_PLIST" "$APP_PATH/Contents/MacOS/$APP"
|
||||
codesign -s "$APP_KEY" -f --entitlements "$PARENT_PLIST" "$APP_PATH"
|
||||
|
||||
productbuild --component "$APP_PATH" /Applications --sign "$INSTALLER_KEY" "$RESULT_PATH"
|
||||
```
|
||||
|
||||
When using `electron-osx-sign` the `ElectronTeamID` key will be added
|
||||
automatically by extracting the Team ID from the certificate's name. You may
|
||||
need to manually add this key if `electron-osx-sign` could not find the correct
|
||||
Team ID.
|
||||
If you are new to app sandboxing under macOS, you should also read through
|
||||
Apple's [Enabling App Sandbox][enable-app-sandbox] to have a basic idea, then
|
||||
add keys for the permissions needed by your app to the entitlements files.
|
||||
|
||||
### Sign apps for development
|
||||
Apart from manually signing your app, you can also choose to use the
|
||||
[electron-osx-sign][electron-osx-sign] module to do the job.
|
||||
|
||||
To sign an app that can run on your development machine, you must sign it with
|
||||
the "Apple Development" certificate and pass the provisioning profile to
|
||||
`electron-osx-sign`.
|
||||
#### Sign Native Modules
|
||||
|
||||
```bash
|
||||
electron-osx-sign YourApp.app --identity='Apple Development' --provisioning-profile=/path/to/yourapp.provisionprofile
|
||||
Native modules used in your app also need to be signed. If using
|
||||
electron-osx-sign, be sure to include the path to the built binaries in the
|
||||
argument list:
|
||||
|
||||
```sh
|
||||
electron-osx-sign YourApp.app YourApp.app/Contents/Resources/app/node_modules/nativemodule/build/release/nativemodule
|
||||
```
|
||||
|
||||
If you are signing without `electron-osx-sign`, you must place the provisioning
|
||||
profile to `YourApp.app/Contents/embedded.provisionprofile`.
|
||||
Also note that native modules may have intermediate files produced which should
|
||||
not be included (as they would also need to be signed). If you use
|
||||
[electron-packager][electron-packager] before version 8.1.0, add
|
||||
`--ignore=.+\.o$` to your build step to ignore these files. Versions 8.1.0 and
|
||||
later ignore those files by default.
|
||||
|
||||
The signed app can only run on the machines that registered by the provisioning
|
||||
profile, and this is the only way to test the signed app before submitting to
|
||||
Mac App Store.
|
||||
### Upload Your App
|
||||
|
||||
### Sign apps for submitting to the Mac App Store
|
||||
|
||||
To sign an app that will be submitted to Mac App Store, you must sign it with
|
||||
the "Apple Distribution" certificate. Note that apps signed with this
|
||||
certificate will not run anywhere, unless it is downloaded from Mac App Store.
|
||||
|
||||
```bash
|
||||
electron-osx-sign YourApp.app --identity='Apple Distribution'
|
||||
```
|
||||
|
||||
### Sign apps for distribution outside the Mac App Store
|
||||
|
||||
If you don't plan to submit the app to Mac App Store, you can sign it the
|
||||
"Developer ID Application" certificate. In this way there is no requirement on
|
||||
App Sandbox, and you should use the normal darwin build of Electron if you don't
|
||||
use App Sandbox.
|
||||
|
||||
```bash
|
||||
electron-osx-sign YourApp.app --identity='Developer ID Application' --no-gatekeeper-assess
|
||||
```
|
||||
|
||||
By passing `--no-gatekeeper-assess`, the `electron-osx-sign` will skip the macOS
|
||||
GateKeeper check as your app usually has not been notarized yet by this step.
|
||||
|
||||
<!-- TODO(zcbenz): Add a chapter about App Notarization -->
|
||||
This guide does not cover [App Notarization][app-notarization], but you might
|
||||
want to do it otherwise Apple may prevent users from using your app outside Mac
|
||||
App Store.
|
||||
|
||||
## Submit Apps to the Mac App Store
|
||||
|
||||
After signing the app with the "Apple Distribution" certificate, you can
|
||||
continue to submit it to Mac App Store.
|
||||
|
||||
However, this guide do not ensure your app will be approved by Apple; you
|
||||
still need to read Apple's [Submitting Your App][submitting-your-app] guide on
|
||||
how to meet the Mac App Store requirements.
|
||||
|
||||
### Upload
|
||||
|
||||
The Application Loader should be used to upload the signed app to iTunes
|
||||
After signing your app, you can use Application Loader to upload it to iTunes
|
||||
Connect for processing, making sure you have [created a record][create-record]
|
||||
before uploading.
|
||||
|
||||
If you are seeing errors like private APIs uses, you should check if the app is
|
||||
using the MAS build of Electron.
|
||||
### Submit Your App for Review
|
||||
|
||||
### Submit for review
|
||||
|
||||
After uploading, you should [submit your app for review][submit-for-review].
|
||||
After these steps, you can [submit your app for review][submit-for-review].
|
||||
|
||||
## Limitations of MAS Build
|
||||
|
||||
@@ -261,13 +181,13 @@ Also, due to the usage of app sandboxing, the resources which can be accessed by
|
||||
the app are strictly limited; you can read [App Sandboxing][app-sandboxing] for
|
||||
more information.
|
||||
|
||||
### Additional entitlements
|
||||
### Additional Entitlements
|
||||
|
||||
Depending on which Electron APIs your app uses, you may need to add additional
|
||||
entitlements to your app's entitlements file. Otherwise, the App Sandbox may
|
||||
prevent you from using them.
|
||||
entitlements to your `parent.plist` file to be able to use these APIs from your
|
||||
app's Mac App Store build.
|
||||
|
||||
#### Network access
|
||||
#### Network Access
|
||||
|
||||
Enable outgoing network connections to allow your app to connect to a server:
|
||||
|
||||
@@ -341,12 +261,15 @@ Electron uses following cryptographic algorithms:
|
||||
* RIPEMD - [ISO/IEC 10118-3](https://webstore.ansi.org/RecordDetail.aspx?sku=ISO%2FIEC%2010118-3:2004)
|
||||
|
||||
[developer-program]: https://developer.apple.com/support/compare-memberships/
|
||||
[electron-osx-sign]: https://github.com/electron/electron-osx-sign
|
||||
[app-sandboxing]: https://developer.apple.com/app-sandboxing/
|
||||
[app-notarization]: https://developer.apple.com/documentation/security/notarizing_macos_software_before_distribution
|
||||
[submitting-your-app]: https://developer.apple.com/library/mac/documentation/IDEs/Conceptual/AppDistributionGuide/SubmittingYourApp/SubmittingYourApp.html
|
||||
[nwjs-guide]: https://github.com/nwjs/nw.js/wiki/Mac-App-Store-%28MAS%29-Submission-Guideline#first-steps
|
||||
[enable-app-sandbox]: https://developer.apple.com/library/ios/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/EnablingAppSandbox.html
|
||||
[create-record]: https://developer.apple.com/library/ios/documentation/LanguagesUtilities/Conceptual/iTunesConnect_Guide/Chapters/CreatingiTunesConnectRecord.html
|
||||
[electron-osx-sign]: https://github.com/electron-userland/electron-osx-sign
|
||||
[electron-packager]: https://github.com/electron/electron-packager
|
||||
[submit-for-review]: https://developer.apple.com/library/ios/documentation/LanguagesUtilities/Conceptual/iTunesConnect_Guide/Chapters/SubmittingTheApp.html
|
||||
[app-sandboxing]: https://developer.apple.com/app-sandboxing/
|
||||
[export-compliance]: https://help.apple.com/app-store-connect/#/devc3f64248f
|
||||
[temporary-exception]: https://developer.apple.com/library/mac/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/AppSandboxTemporaryExceptionEntitlements.html
|
||||
[user-selected]: https://developer.apple.com/library/mac/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/EnablingAppSandbox.html#//apple_ref/doc/uid/TP40011195-CH4-SW6
|
||||
[network-access]: https://developer.apple.com/library/ios/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/EnablingAppSandbox.html#//apple_ref/doc/uid/TP40011195-CH4-SW9
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
# Configuring the macOS Dock
|
||||
# macOS Dock
|
||||
|
||||
## Overview
|
||||
|
||||
Electron has APIs to configure the app's icon in the macOS Dock. A macOS-only
|
||||
API exists to create a custom dock menu, but Electron also uses the app dock
|
||||
@@ -23,16 +25,7 @@ Starting with a working application from the
|
||||
following lines:
|
||||
|
||||
```javascript fiddle='docs/fiddles/features/macos-dock-menu'
|
||||
const { app, BrowserWindow, Menu } = require('electron')
|
||||
|
||||
function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
})
|
||||
|
||||
win.loadFile('index.html')
|
||||
}
|
||||
const { app, Menu } = require('electron')
|
||||
|
||||
const dockMenu = Menu.buildFromTemplate([
|
||||
{
|
||||
@@ -49,23 +42,8 @@ const dockMenu = Menu.buildFromTemplate([
|
||||
])
|
||||
|
||||
app.whenReady().then(() => {
|
||||
if (process.platform === 'darwin') {
|
||||
app.dock.setMenu(dockMenu)
|
||||
}
|
||||
}).then(createWindow)
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit()
|
||||
}
|
||||
app.dock.setMenu(dockMenu)
|
||||
})
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
|
||||
```
|
||||
|
||||
After launching the Electron application, right click the application icon.
|
||||
|
||||
@@ -14,46 +14,30 @@ API in response to the `ondragstart` event.
|
||||
|
||||
## Example
|
||||
|
||||
An example demonstrating how you can create a file on the fly to be dragged out of the window.
|
||||
|
||||
### Preload.js
|
||||
|
||||
In `preload.js` use the [`contextBridge`] to inject a method `window.electron.startDrag(...)` that will send an IPC message to the main process.
|
||||
|
||||
```js
|
||||
const { contextBridge, ipcRenderer } = require('electron')
|
||||
const path = require('path')
|
||||
|
||||
contextBridge.exposeInMainWorld('electron', {
|
||||
startDrag: (fileName) => {
|
||||
ipcRenderer.send('ondragstart', path.join(process.cwd(), fileName))
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
### Index.html
|
||||
|
||||
Add a draggable element to `index.html`, and reference your renderer script:
|
||||
Starting with a working application from the
|
||||
[Quick Start Guide](quick-start.md), add the following lines to the
|
||||
`index.html` file:
|
||||
|
||||
```html
|
||||
<div style="border:2px solid black;border-radius:3px;padding:5px;display:inline-block" draggable="true" id="drag">Drag me</div>
|
||||
<a href="#" id="drag">Drag me</a>
|
||||
<script src="renderer.js"></script>
|
||||
```
|
||||
|
||||
### Renderer.js
|
||||
|
||||
In `renderer.js` set up the renderer process to handle drag events by calling the method you added via the [`contextBridge`] above.
|
||||
and add the following lines to the `renderer.js` file:
|
||||
|
||||
```javascript
|
||||
const { ipcRenderer } = require('electron')
|
||||
|
||||
document.getElementById('drag').ondragstart = (event) => {
|
||||
event.preventDefault()
|
||||
window.electron.startDrag('drag-and-drop.md')
|
||||
ipcRenderer.send('ondragstart', '/absolute/path/to/the/item')
|
||||
}
|
||||
```
|
||||
|
||||
### Main.js
|
||||
The code above instructs the Renderer process to handle the `ondragstart` event
|
||||
and forward the information to the Main process.
|
||||
|
||||
In the Main process (`main.js` file), expand the received event with a path to the file that is
|
||||
In the Main process(`main.js` file), expand the received event with a path to the file that is
|
||||
being dragged and an icon:
|
||||
|
||||
```javascript fiddle='docs/fiddles/features/drag-and-drop'
|
||||
@@ -72,5 +56,3 @@ the item from the BrowserWindow onto your desktop. In this guide,
|
||||
the item is a Markdown file located in the root of the project:
|
||||
|
||||

|
||||
|
||||
[`contextBridge`]: ../api/context-bridge.md
|
||||
|
||||
@@ -39,6 +39,10 @@ To enable this mode, GPU acceleration has to be disabled by calling the
|
||||
|
||||
## Example
|
||||
|
||||
Starting with a working application from the
|
||||
[Quick Start Guide](quick-start.md), add the following lines to the
|
||||
`main.js` file:
|
||||
|
||||
```javascript fiddle='docs/fiddles/features/offscreen-rendering'
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
const fs = require('fs')
|
||||
@@ -59,5 +63,5 @@ app.whenReady().then(() => {
|
||||
```
|
||||
|
||||
After launching the Electron application, navigate to your application's
|
||||
working folder, where you'll find the rendered image.
|
||||
working folder.
|
||||
[disablehardwareacceleration]: ../api/app.md#appdisablehardwareacceleration
|
||||
|
||||
@@ -21,29 +21,83 @@ status of Electron, you should develop additional means for this check.
|
||||
|
||||
## Example
|
||||
|
||||
Starting with an HTML file `index.html`, this example will demonstrate how the `navigator.onLine` API can be used to build a connection status indicator.
|
||||
### Event detection in the Renderer process
|
||||
|
||||
```html title="index.html"
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Hello World!</title>
|
||||
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
|
||||
</head>
|
||||
<body>
|
||||
<h1>Connection status: <strong id='status'></strong></h1>
|
||||
<script src="renderer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Starting with a working application from the
|
||||
[Quick Start Guide](quick-start.md), update the `main.js` file
|
||||
with the following lines:
|
||||
|
||||
```javascript
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
|
||||
let onlineStatusWindow
|
||||
|
||||
app.whenReady().then(() => {
|
||||
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
|
||||
onlineStatusWindow.loadURL(`file://${__dirname}/index.html`)
|
||||
})
|
||||
```
|
||||
|
||||
In order to mutate the DOM, create a `renderer.js` file that adds event listeners to the `'online'` and `'offline'` `window` events. The event handler sets the content of the `<strong id='status'>` element depending on the result of `navigator.onLine`.
|
||||
in the `index.html` file, add the following line before the
|
||||
closing `</body>` tag:
|
||||
|
||||
```js title='renderer.js'
|
||||
function updateOnlineStatus () {
|
||||
document.getElementById('status').innerHTML = navigator.onLine ? 'online' : 'offline'
|
||||
}
|
||||
```html
|
||||
<script src="renderer.js"></script>
|
||||
```
|
||||
|
||||
and add the `renderer.js` file:
|
||||
|
||||
```javascript fiddle='docs/fiddles/features/online-detection/renderer'
|
||||
const alertOnlineStatus = () => { window.alert(navigator.onLine ? 'online' : 'offline') }
|
||||
|
||||
window.addEventListener('online', alertOnlineStatus)
|
||||
window.addEventListener('offline', alertOnlineStatus)
|
||||
|
||||
alertOnlineStatus()
|
||||
```
|
||||
|
||||
After launching the Electron application, you should see the notification:
|
||||
|
||||

|
||||
|
||||
### Event detection in the Main process
|
||||
|
||||
There may be situations when you want to respond to online/offline events in
|
||||
the Main process as well. The Main process, however, does not have a
|
||||
`navigator` object and cannot detect these events directly. In this case, you
|
||||
need to forward the events to the Main process using Electron's inter-process
|
||||
communication (IPC) utilities.
|
||||
|
||||
Starting with a working application from the
|
||||
[Quick Start Guide](quick-start.md), update the `main.js` file
|
||||
with the following lines:
|
||||
|
||||
```javascript
|
||||
const { app, BrowserWindow, ipcMain } = require('electron')
|
||||
let onlineStatusWindow
|
||||
|
||||
app.whenReady().then(() => {
|
||||
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false, webPreferences: { nodeIntegration: true } })
|
||||
onlineStatusWindow.loadURL(`file://${__dirname}/index.html`)
|
||||
})
|
||||
|
||||
ipcMain.on('online-status-changed', (event, status) => {
|
||||
console.log(status)
|
||||
})
|
||||
```
|
||||
|
||||
in the `index.html` file, add the following line before the
|
||||
closing `</body>` tag:
|
||||
|
||||
```html
|
||||
<script src="renderer.js"></script>
|
||||
```
|
||||
|
||||
and add the `renderer.js` file:
|
||||
|
||||
```javascript fiddle='docs/fiddles/features/online-detection/main'
|
||||
const { ipcRenderer } = require('electron')
|
||||
const updateOnlineStatus = () => { ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline') }
|
||||
|
||||
window.addEventListener('online', updateOnlineStatus)
|
||||
window.addEventListener('offline', updateOnlineStatus)
|
||||
@@ -51,39 +105,14 @@ window.addEventListener('offline', updateOnlineStatus)
|
||||
updateOnlineStatus()
|
||||
```
|
||||
|
||||
Finally, create a `main.js` file for main process that creates the window.
|
||||
After launching the Electron application, you should see the notification in the
|
||||
Console:
|
||||
|
||||
```js title='main.js'
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
```sh
|
||||
npm start
|
||||
|
||||
function createWindow () {
|
||||
const onlineStatusWindow = new BrowserWindow({
|
||||
width: 400,
|
||||
height: 100
|
||||
})
|
||||
> electron@1.0.0 start /electron
|
||||
> electron .
|
||||
|
||||
onlineStatusWindow.loadFile('index.html')
|
||||
}
|
||||
|
||||
app.whenReady().then(() => {
|
||||
createWindow()
|
||||
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit()
|
||||
}
|
||||
})
|
||||
online
|
||||
```
|
||||
|
||||
After launching the Electron application, you should see the notification:
|
||||
|
||||

|
||||
|
||||
> Note: If you need to communicate the connection status to the main process, use the [IPC renderer](../api/ipc-renderer.md) API.
|
||||
|
||||
@@ -1,206 +0,0 @@
|
||||
# Process Model
|
||||
|
||||
Electron inherits its multi-process architecture from Chromium, which makes the framework
|
||||
architecturally very similar to a modern web browser. In this guide, we'll expound on
|
||||
the conceptual knowledge of Electron that we applied in the minimal [quick start app][].
|
||||
|
||||
[quick start app]: ./quick-start.md
|
||||
|
||||
## Why not a single process?
|
||||
|
||||
Web browsers are incredibly complicated applications. Aside from their primary ability
|
||||
to display web content, they have many secondary responsibilities,
|
||||
such as managing multiple windows (or tabs) and loading third-party extensions.
|
||||
|
||||
In the earlier days, browsers usually used a single process for all of this
|
||||
functionality. Although this pattern meant less overhead for each tab you had open,
|
||||
it also meant that one website crashing or hanging would affect the entire browser.
|
||||
|
||||
## The multi-process model
|
||||
|
||||
To solve this problem, the Chrome team decided that each tab would render in its own
|
||||
process, limiting the harm that buggy or malicious code on a web page could cause to
|
||||
the app as a whole. A single browser process then controls these processes, as well
|
||||
as the application lifecycle as a whole. This diagram below from the [Chrome Comic]
|
||||
visualizes this model:
|
||||
|
||||

|
||||
|
||||
Electron applications are structured very similarly. As an app developer, you control
|
||||
two types of processes: main and renderer. These are analogous to Chrome's own browser
|
||||
and renderer processes outlined above.
|
||||
|
||||
[Chrome Comic]: https://www.google.com/googlebooks/chrome/
|
||||
|
||||
## The main process
|
||||
|
||||
Each Electron app has a single main process, which acts as the application's entry
|
||||
point. The main process runs in a Node.js environment, meaning it has the ability
|
||||
to `require` modules and use all of Node.js APIs.
|
||||
|
||||
### Window management
|
||||
|
||||
The main process' primary purpose is to create and manage application windows with the
|
||||
[`BrowserWindow`][browser-window] module.
|
||||
|
||||
Each instance of the `BrowserWindow` class creates an application window that loads
|
||||
a web page in a separate renderer process. You can interact with this web content
|
||||
from the main process using the window's [`webContents`][web-contents] object.
|
||||
|
||||
```js title='main.js'
|
||||
const { BrowserWindow } = require('electron')
|
||||
|
||||
const win = new BrowserWindow({ width: 800, height: 1500 })
|
||||
win.loadURL('https://github.com')
|
||||
|
||||
const contents = win.webContents
|
||||
console.log(contents)
|
||||
```
|
||||
|
||||
> Note: A renderer process is also created for [web embeds][web-embed] such as the
|
||||
> `BrowserView` module. The `webContents` object is also accessible for embedded
|
||||
> web content.
|
||||
|
||||
Because the `BrowserWindow` module is an [`EventEmitter`][event-emitter], you can also
|
||||
add handlers for various user events (for example, minimizing or maximizing your window).
|
||||
|
||||
When a `BrowserWindow` instance is destroyed, its corresponding renderer process gets
|
||||
terminated as well.
|
||||
|
||||
[browser-window]: ../api/browser-window.md
|
||||
[web-embed]: ./web-embeds.md
|
||||
[web-contents]: ../api/web-contents.md
|
||||
[event-emitter]: https://nodejs.org/api/events.html#events_class_eventemitter
|
||||
|
||||
### Application lifecycle
|
||||
|
||||
The main process also controls your application's lifecycle through Electron's
|
||||
[`app`][app] module. This module provides a large set of events and methods
|
||||
that you can use to add custom application behaviour (for instance, programatically
|
||||
quitting your application, modifying the application dock, or showing an About panel).
|
||||
|
||||
As a practical example, the app shown in the [quick start guide][quick-start-lifecycle]
|
||||
uses `app` APIs to create a more native application window experience.
|
||||
|
||||
```js title='main.js'
|
||||
// quitting the app when no windows are open on macOS
|
||||
app.on('window-all-closed', function () {
|
||||
if (process.platform !== 'darwin') app.quit()
|
||||
})
|
||||
```
|
||||
|
||||
[app]: ../api/app.md
|
||||
[quick-start-lifecycle]: ./quick-start.md#manage-your-windows-lifecycle
|
||||
|
||||
### Native APIs
|
||||
|
||||
To extend Electron's features beyond being a Chromium wrapper for web contents, the
|
||||
main process also adds custom APIs to interact with the user's operating system.
|
||||
Electron exposes various modules that control native desktop functionality, such
|
||||
as menus, dialogs, and tray icons.
|
||||
|
||||
For a full list of Electron's main process modules, check out our API documentation.
|
||||
|
||||
## The renderer process
|
||||
|
||||
Each Electron app spawns a separate renderer process for each open `BrowserWindow`
|
||||
(and each web embed). As its name implies, a renderer is responsible for
|
||||
*rendering* web content. For all intents and purposes, code ran in renderer processes
|
||||
should behave according to web standards (insofar as Chromium does, at least).
|
||||
|
||||
Therefore, all user interfaces and app functionality within a single browser
|
||||
window should be written with the same tools and paradigms that you use on the
|
||||
web.
|
||||
|
||||
Although explaining every web spec is out of scope for this guide, the bare minimum
|
||||
to understand is:
|
||||
|
||||
* An HTML file is your entry point for the renderer process.
|
||||
* UI styling is added through Cascading Style Sheets (CSS).
|
||||
* Executable JavaScript code can be added through `<script>` elements.
|
||||
|
||||
Moreover, this also means that the renderer has no direct access to `require`
|
||||
or other Node.js APIs. In order to directly include NPM modules in the renderer,
|
||||
you must use the same bundler toolchains (for example, `webpack` or `parcel`) that you
|
||||
use on the web.
|
||||
|
||||
> Note: Renderer processes can be spawned with a full Node.js environment for ease of
|
||||
> development. Historically, this used to be the default, but this feature was disabled
|
||||
> for security reasons.
|
||||
|
||||
At this point, you might be wondering how your renderer process user interfaces
|
||||
can interact with Node.js and Electron's native desktop functionality if these
|
||||
features are only accessible from the main process. In fact, there is no direct
|
||||
way to import Electron's content scripts.
|
||||
|
||||
## Preload scripts
|
||||
|
||||
<!-- Note: This guide doesn't take sandboxing into account, which might fundamentally
|
||||
change the statements here. -->
|
||||
Preload scripts contain code that executes in a renderer process before its web content
|
||||
begins loading. These scripts runs within the renderer context, but are granted more
|
||||
privileges by having access to Node.js APIs.
|
||||
|
||||
A preload script can be attached to the main process in the `BrowserWindow` constructor's
|
||||
`webPreferences` option.
|
||||
|
||||
```js title='main.js'
|
||||
const { BrowserWindow } = require('electron')
|
||||
//...
|
||||
const win = new BrowserWindow({
|
||||
preload: 'path/to/preload.js'
|
||||
})
|
||||
//...
|
||||
```
|
||||
|
||||
Because the preload script shares a global [`Window`][window-mdn] interface with the
|
||||
renderers and can access Node.js APIs, it serves to enhance your renderer by exposing
|
||||
arbitrary APIs in the `window` global that your web contents can then consume.
|
||||
|
||||
Although preload scripts share a `window` global with the renderer they're attached to,
|
||||
you cannot directly attach any variables from the preload script to `window` because of
|
||||
the [`contextIsolation`][context-isolation] default.
|
||||
|
||||
```js title='preload.js'
|
||||
window.myAPI = {
|
||||
desktop: true
|
||||
}
|
||||
```
|
||||
|
||||
```js title='renderer.js'
|
||||
console.log(window.myAPI)
|
||||
// => undefined
|
||||
```
|
||||
|
||||
Context Isolation means that preload scripts are isolated from the renderer's main world
|
||||
to avoid leaking any privileged APIs into your web content's code.
|
||||
|
||||
Instead, use the [`contextBridge`][context-bridge] module to accomplish this
|
||||
securely:
|
||||
|
||||
```js title='preload.js'
|
||||
const { contextBridge } = require('electron')
|
||||
|
||||
contextBridge.exposeInMainWorld('myAPI', {
|
||||
desktop: true
|
||||
})
|
||||
```
|
||||
|
||||
```js title='renderer.js'
|
||||
console.log(window.myAPI)
|
||||
// => { desktop: true }
|
||||
```
|
||||
|
||||
This feature is incredibly useful for two main purposes:
|
||||
|
||||
* By exposing [`ipcRenderer`][ipcRenderer] helpers to the renderer, you can use
|
||||
inter-process communication (IPC) to trigger main process tasks from the
|
||||
renderer (and vice-versa).
|
||||
* If you're developing an Electron wrapper for an existing web app hosted on a remote
|
||||
URL, you can add custom properties onto the renderer's `window` global that can
|
||||
be used for desktop-only logic on the web client's side.
|
||||
|
||||
[window-mdn]: https://developer.mozilla.org/en-US/docs/Web/API/Window
|
||||
[context-isolation]: ./context-isolation.md
|
||||
[context-bridge]: ../api/context-bridge.md
|
||||
[ipcRenderer]: ../api/ipc-renderer.md
|
||||
@@ -1,23 +1,20 @@
|
||||
# Quick Start
|
||||
# Quick Start Guide
|
||||
|
||||
This guide will step you through the process of creating a barebones Hello World app in
|
||||
Electron, similar to [`electron/electron-quick-start`][quick-start].
|
||||
## Quickstart
|
||||
|
||||
By the end of this tutorial, your app will open a browser window that displays a web page
|
||||
with information about which Chromium, Node.js, and Electron versions are running.
|
||||
Electron is a framework that enables you to create desktop applications with JavaScript, HTML, and CSS. These applications can then be packaged to run directly on macOS, Windows, or Linux, or distributed via the Mac App Store or the Microsoft Store.
|
||||
|
||||
[quick-start]: https://github.com/electron/electron-quick-start
|
||||
Typically, you create a desktop application for an operating system (OS) using each operating system's specific native application frameworks. Electron makes it possible to write your application once using technologies that you already know.
|
||||
|
||||
## Prerequisites
|
||||
### Prerequisites
|
||||
|
||||
To use Electron, you need to install [Node.js][node-download]. We recommend that you
|
||||
use the latest `LTS` version available.
|
||||
Before proceeding with Electron you need to install [Node.js][node-download].
|
||||
We recommend that you install either the latest `LTS` or `Current` version available.
|
||||
|
||||
> Please install Node.js using pre-built installers for your platform.
|
||||
> You may encounter incompatibility issues with different development tools otherwise.
|
||||
|
||||
To check that Node.js was installed correctly, type the following commands in your
|
||||
terminal client:
|
||||
To check that Node.js was installed correctly, type the following commands in your terminal client:
|
||||
|
||||
```sh
|
||||
node -v
|
||||
@@ -25,342 +22,44 @@ npm -v
|
||||
```
|
||||
|
||||
The commands should print the versions of Node.js and npm accordingly.
|
||||
If both commands succeeded, you are ready to install Electron.
|
||||
|
||||
**Note:** Since Electron embeds Node.js into its binary, the version of Node.js running
|
||||
your code is unrelated to the version running on your system.
|
||||
### Create a basic application
|
||||
|
||||
[node-download]: https://nodejs.org/en/download/
|
||||
From a development perspective, an Electron application is essentially a Node.js application. This means that the starting point of your Electron application will be a `package.json` file like in any other Node.js application. A minimal Electron application has the following structure:
|
||||
|
||||
## Create your application
|
||||
```plaintext
|
||||
my-electron-app/
|
||||
├── package.json
|
||||
├── main.js
|
||||
├── preload.js
|
||||
└── index.html
|
||||
```
|
||||
|
||||
### Scaffold the project
|
||||
Let's create a basic application based on the structure above.
|
||||
|
||||
Electron apps follow the same general structure as other Node.js projects.
|
||||
Start by creating a folder and initializing an npm package.
|
||||
#### Install Electron
|
||||
|
||||
```sh npm2yarn
|
||||
Create a folder for your project and install Electron there:
|
||||
|
||||
```sh
|
||||
mkdir my-electron-app && cd my-electron-app
|
||||
npm init
|
||||
npm init -y
|
||||
npm i --save-dev electron
|
||||
```
|
||||
|
||||
The interactive `init` command will prompt you to set some fields in your config.
|
||||
There are a few rules to follow for the purposes of this tutorial:
|
||||
#### Create the main script file
|
||||
|
||||
* `entry point` should be `main.js`.
|
||||
* `author` and `description` can be any value, but are necessary for
|
||||
[app packaging](#package-and-distribute-your-application).
|
||||
The main script specifies the entry point of your Electron application (in our case, the `main.js` file) that will run the Main process. Typically, the script that runs in the Main process controls the lifecycle of the application, displays the graphical user interface and its elements, performs native operating system interactions, and creates Renderer processes within web pages. An Electron application can have only one Main process.
|
||||
|
||||
Your `package.json` file should look something like this:
|
||||
The main script may look as follows:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "my-electron-app",
|
||||
"version": "1.0.0",
|
||||
"description": "Hello World!",
|
||||
"main": "main.js",
|
||||
"author": "Jane Doe",
|
||||
"license": "MIT"
|
||||
}
|
||||
```
|
||||
|
||||
Then, install the `electron` package into your app's `devDependencies`.
|
||||
|
||||
```sh npm2yarn
|
||||
$ npm install --save-dev electron
|
||||
```
|
||||
|
||||
> Note: If you're encountering any issues with installing Electron, please
|
||||
> refer to the [Advanced Installation][advanced-installation] guide.
|
||||
|
||||
Finally, you want to be able to execute Electron. In the [`scripts`][package-scripts]
|
||||
field of your `package.json` config, add a `start` command like so:
|
||||
|
||||
```json
|
||||
{
|
||||
"scripts": {
|
||||
"start": "electron ."
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
This `start` command will let you open your app in development mode.
|
||||
|
||||
```sh npm2yarn
|
||||
npm start
|
||||
```
|
||||
|
||||
> Note: This script tells Electron to run on your project's root folder. At this stage,
|
||||
> your app will immediately throw an error telling you that it cannot find an app to run.
|
||||
|
||||
[advanced-installation]: ./installation.md
|
||||
[package-scripts]: https://docs.npmjs.com/cli/v7/using-npm/scripts
|
||||
|
||||
### Run the main process
|
||||
|
||||
The entry point of any Electron application is its `main` script. This script controls the
|
||||
**main process**, which runs in a full Node.js environment and is responsible for
|
||||
controlling your app's lifecycle, displaying native interfaces, performing privileged
|
||||
operations, and managing renderer processes (more on that later).
|
||||
|
||||
During execution, Electron will look for this script in the [`main`][package-json-main]
|
||||
field of the app's `package.json` config, which you should have configured during the
|
||||
[app scaffolding](#scaffold-the-project) step.
|
||||
|
||||
To initialize the `main` script, create an empty file named `main.js` in the root folder
|
||||
of your project.
|
||||
|
||||
> Note: If you run the `start` script again at this point, your app will no longer throw
|
||||
> any errors! However, it won't do anything yet because we haven't added any code into
|
||||
> `main.js`.
|
||||
|
||||
[package-json-main]: https://docs.npmjs.com/cli/v7/configuring-npm/package-json#main
|
||||
|
||||
### Create a web page
|
||||
|
||||
Before we can create a window for our application, we need to create the content that
|
||||
will be loaded into it. In Electron, each window displays web contents that can be loaded
|
||||
from either from a local HTML file or a remote URL.
|
||||
|
||||
For this tutorial, you will be doing the former. Create an `index.html` file in the root
|
||||
folder of your project:
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
|
||||
<meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">
|
||||
<title>Hello World!</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
We are using Node.js <span id="node-version"></span>,
|
||||
Chromium <span id="chrome-version"></span>,
|
||||
and Electron <span id="electron-version"></span>.
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
> Note: Looking at this HTML document, you can observe that the version numbers are
|
||||
> missing from the body text. We'll manually insert them later using JavaScript.
|
||||
|
||||
### Opening your web page in a browser window
|
||||
|
||||
Now that you have a web page, load it into an application window. To do so, you'll
|
||||
need two Electron modules:
|
||||
|
||||
* The [`app`][app] module, which controls your application's event lifecycle.
|
||||
* The [`BrowserWindow`][browser-window] module, which creates and manages application
|
||||
windows.
|
||||
|
||||
Because the main process runs Node.js, you can import these as [CommonJS][commonjs]
|
||||
modules at the top of your file:
|
||||
|
||||
```js
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
```
|
||||
|
||||
Then, add a `createWindow()` function that loads `index.html` into a new `BrowserWindow`
|
||||
instance.
|
||||
|
||||
```js
|
||||
function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600
|
||||
})
|
||||
|
||||
win.loadFile('index.html')
|
||||
}
|
||||
```
|
||||
|
||||
Next, call this `createWindow()` function to open your window.
|
||||
|
||||
In Electron, browser windows can only be created after the `app` module's
|
||||
[`ready`][app-ready] event is fired. You can wait for this event by using the
|
||||
[`app.whenReady()`][app-when-ready] API. Call `createWindow()` after `whenReady()`
|
||||
resolves its Promise.
|
||||
|
||||
```js
|
||||
app.whenReady().then(() => {
|
||||
createWindow()
|
||||
})
|
||||
```
|
||||
|
||||
> Note: At this point, your Electron application should successfully
|
||||
> open a window that displays your web page!
|
||||
|
||||
[app]: ../api/app.md
|
||||
[browser-window]: ../api/browser-window.md
|
||||
[commonjs]: https://nodejs.org/docs/latest/api/modules.html#modules_modules_commonjs_modules
|
||||
[app-ready]: ../api/app.md#event-ready
|
||||
[app-when-ready]: ../api/app.md#appwhenready
|
||||
|
||||
### Manage your window's lifecycle
|
||||
|
||||
Although you can now open a browser window, you'll need some additional boilerplate code
|
||||
to make it feel more native to each platform. Application windows behave differently on
|
||||
each OS, and Electron puts the responsibility on developers to implement these
|
||||
conventions in their app.
|
||||
|
||||
In general, you can use the `process` global's [`platform`][node-platform] attribute
|
||||
to run code specifically for certain operating systems.
|
||||
|
||||
#### Quit the app when all windows are closed (Windows & Linux)
|
||||
|
||||
On Windows and Linux, exiting all windows generally quits an application entirely.
|
||||
|
||||
To implement this, listen for the `app` module's [`'window-all-closed'`][window-all-closed]
|
||||
event, and call [`app.quit()`][app-quit] if the user is not on macOS (`darwin`).
|
||||
|
||||
```js
|
||||
app.on('window-all-closed', function () {
|
||||
if (process.platform !== 'darwin') app.quit()
|
||||
})
|
||||
```
|
||||
|
||||
[node-platform]: https://nodejs.org/api/process.html#process_process_platform
|
||||
[window-all-closed]: ../api/app.md#event-window-all-closed
|
||||
[window-all-closed]: ../api/app.md#appquit
|
||||
|
||||
#### Open a window if none are open (macOS)
|
||||
|
||||
Whereas Linux and Windows apps quit when they have no windows open, macOS apps generally
|
||||
continue running even without any windows open, and activating the app when no windows
|
||||
are available should open a new one.
|
||||
|
||||
To implement this feature, listen for the `app` module's [`activate`][activate]
|
||||
event, and call your existing `createWindow()` method if no browser windows are open.
|
||||
|
||||
Because windows cannot be created before the `ready` event, you should only listen for
|
||||
`activate` events after your app is initialized. Do this by attaching your event listener
|
||||
from within your existing `whenReady()` callback.
|
||||
|
||||
[activate]: ../api/app.md#event-activate-macos
|
||||
|
||||
```js
|
||||
app.whenReady().then(() => {
|
||||
createWindow()
|
||||
|
||||
app.on('activate', function () {
|
||||
if (BrowserWindow.getAllWindows().length === 0) createWindow()
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
> Note: At this point, your window controls should be fully functional!
|
||||
|
||||
### Access Node.js from the renderer with a preload script
|
||||
|
||||
Now, the last thing to do is print out the version numbers for Electron and its
|
||||
dependencies onto your web page.
|
||||
|
||||
Accessing this information is trivial to do in the main process through Node's
|
||||
global `process` object. However, you can't just edit the DOM from the main
|
||||
process because it has no access to the renderer's `document` context.
|
||||
They're in entirely different processes!
|
||||
|
||||
> Note: If you need a more in-depth look at Electron processes, see the
|
||||
> [Process Model][] document.
|
||||
|
||||
This is where attaching a **preload** script to your renderer comes in handy.
|
||||
A preload script runs before the renderer process is loaded, and has access to both
|
||||
renderer globals (e.g. `window` and `document`) and a Node.js environment.
|
||||
|
||||
Create a new script named `preload.js` as such:
|
||||
|
||||
```js
|
||||
window.addEventListener('DOMContentLoaded', () => {
|
||||
const replaceText = (selector, text) => {
|
||||
const element = document.getElementById(selector)
|
||||
if (element) element.innerText = text
|
||||
}
|
||||
|
||||
for (const dependency of ['chrome', 'node', 'electron']) {
|
||||
replaceText(`${dependency}-version`, process.versions[dependency])
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
The above code accesses the Node.js `process.versions` object and runs a basic `replaceText`
|
||||
helper function to insert the version numbers into the HTML document.
|
||||
|
||||
To attach this script to your renderer process, pass in the path to your preload script
|
||||
to the `webPreferences.preload` option in your existing `BrowserWindow` constructor.
|
||||
|
||||
```js
|
||||
// include the Node.js 'path' module at the top of your file
|
||||
const path = require('path')
|
||||
|
||||
// modify your existing createWindow() function
|
||||
function createWindow () {
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
preload: path.join(__dirname, 'preload.js')
|
||||
})
|
||||
|
||||
win.loadFile('index.html')
|
||||
}
|
||||
// ...
|
||||
```
|
||||
|
||||
There are two Node.js concepts that are used here:
|
||||
|
||||
* The [`__dirname`][dirname] string points to the path of the currently executing script
|
||||
(in this case, your project's root folder).
|
||||
* The [`path.join`][path-join] API joins multiple path segments together, creating a
|
||||
combined path string that works across all platforms.
|
||||
|
||||
We use a path relative to the currently executing JavaScript file so that your relative
|
||||
path will work in both development and packaged mode.
|
||||
|
||||
[Process Model]: ./process-model.md
|
||||
[dirname]: https://nodejs.org/api/modules.html#modules_dirname
|
||||
[path-join]: https://nodejs.org/api/path.html#path_path_join_paths
|
||||
|
||||
### Bonus: Add functionality to your web contents
|
||||
|
||||
At this point, you might be wondering how to add more functionality to your application.
|
||||
|
||||
For any interactions with your web contents, you want to add scripts to your
|
||||
renderer process. Because the renderer runs in a normal web environment, you can add a
|
||||
`<script>` tag right before your `index.html` file's closing `</body>` tag to include
|
||||
any arbitrary scripts you want:
|
||||
|
||||
```html
|
||||
<script src="./renderer.js"></script>
|
||||
```
|
||||
|
||||
The code contained in `renderer.js` can then use the same JavaScript APIs and tooling
|
||||
you use for typical front-end development, such as using [`webpack`][webpack] to bundle
|
||||
and minify your code or [React][react] to manage your user interfaces.
|
||||
|
||||
[webpack]: https://webpack.js.org
|
||||
[react]: https://reactjs.org
|
||||
|
||||
### Recap
|
||||
|
||||
After following the above steps, you should have a fully functional
|
||||
Electron application that looks like this:
|
||||
|
||||

|
||||
|
||||
<!--TODO(erickzhao): Remove the individual code blocks for static website -->
|
||||
The full code is available below:
|
||||
|
||||
```js
|
||||
// main.js
|
||||
|
||||
// Modules to control application life and create native browser window
|
||||
```javascript fiddle='docs/fiddles/quick-start'
|
||||
const { app, BrowserWindow } = require('electron')
|
||||
const path = require('path')
|
||||
|
||||
function createWindow () {
|
||||
// Create the browser window.
|
||||
const mainWindow = new BrowserWindow({
|
||||
const win = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
@@ -368,100 +67,135 @@ function createWindow () {
|
||||
}
|
||||
})
|
||||
|
||||
// and load the index.html of the app.
|
||||
mainWindow.loadFile('index.html')
|
||||
|
||||
// Open the DevTools.
|
||||
// mainWindow.webContents.openDevTools()
|
||||
win.loadFile('index.html')
|
||||
}
|
||||
|
||||
// This method will be called when Electron has finished
|
||||
// initialization and is ready to create browser windows.
|
||||
// Some APIs can only be used after this event occurs.
|
||||
app.whenReady().then(() => {
|
||||
createWindow()
|
||||
|
||||
app.on('activate', function () {
|
||||
// On macOS it's common to re-create a window in the app when the
|
||||
// dock icon is clicked and there are no other windows open.
|
||||
if (BrowserWindow.getAllWindows().length === 0) createWindow()
|
||||
app.on('activate', () => {
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow()
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
// Quit when all windows are closed, except on macOS. There, it's common
|
||||
// for applications and their menu bar to stay active until the user quits
|
||||
// explicitly with Cmd + Q.
|
||||
app.on('window-all-closed', function () {
|
||||
if (process.platform !== 'darwin') app.quit()
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit()
|
||||
}
|
||||
})
|
||||
|
||||
// In this file you can include the rest of your app's specific main process
|
||||
// code. You can also put them in separate files and require them here.
|
||||
```
|
||||
|
||||
```js
|
||||
// preload.js
|
||||
##### What is going on above?
|
||||
|
||||
// All of the Node.js APIs are available in the preload process.
|
||||
// It has the same sandbox as a Chrome extension.
|
||||
1. Line 1: First, you import the `app` and `BrowserWindow` modules of the `electron` package to be able to manage your application's lifecycle events, as well as create and control browser windows.
|
||||
2. Line 2: Second, you import the `path` package which provides utility functions for file paths.
|
||||
3. Line 4: After that, you define a function that creates a [new browser window](../api/browser-window.md#new-browserwindowoptions) with a preload script, loads `index.html` file into this window (line 13, we will discuss the file later).
|
||||
4. Line 16: You create a new browser window by invoking the `createWindow` function once the Electron application [is initialized](../api/app.md#appwhenready).
|
||||
5. Line 18: You add a new listener that creates a new browser window only if when the application has no visible windows after being activated. For example, after launching the application for the first time, or re-launching the already running application.
|
||||
6. Line 25: You add a new listener that tries to quit the application when it no longer has any open windows. This listener is a no-op on macOS due to the operating system's [window management behavior](https://support.apple.com/en-ca/guide/mac-help/mchlp2469/mac).
|
||||
|
||||
#### Create a web page
|
||||
|
||||
This is the web page you want to display once the application is initialized. This web page represents the Renderer process. You can create multiple browser windows, where each window uses its own independent Renderer. You can optionally grant access to additional Node.js APIs by exposing them from your preload script.
|
||||
|
||||
The `index.html` page looks as follows:
|
||||
|
||||
```html fiddle='docs/fiddles/quick-start'
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Hello World!</title>
|
||||
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
|
||||
</head>
|
||||
<body style="background: white;">
|
||||
<h1>Hello World!</h1>
|
||||
<p>
|
||||
We are using Node.js <span id="node-version"></span>,
|
||||
Chromium <span id="chrome-version"></span>,
|
||||
and Electron <span id="electron-version"></span>.
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
#### Define a preload script
|
||||
|
||||
Your preload script (in our case, the `preload.js` file) acts as a bridge between Node.js and your web page. It allows you to expose specific APIs and behaviors to your web page rather than insecurely exposing the entire Node.js API. In this example we will use the preload script to read version information from the `process` object and update the web page with that info.
|
||||
|
||||
```javascript fiddle='docs/fiddles/quick-start'
|
||||
window.addEventListener('DOMContentLoaded', () => {
|
||||
const replaceText = (selector, text) => {
|
||||
const element = document.getElementById(selector)
|
||||
if (element) element.innerText = text
|
||||
}
|
||||
|
||||
for (const dependency of ['chrome', 'node', 'electron']) {
|
||||
replaceText(`${dependency}-version`, process.versions[dependency])
|
||||
for (const type of ['chrome', 'node', 'electron']) {
|
||||
replaceText(`${type}-version`, process.versions[type])
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
```html
|
||||
<!--index.html-->
|
||||
##### What's going on above?
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
|
||||
<meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">
|
||||
<title>Hello World!</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello World!</h1>
|
||||
We are using Node.js <span id="node-version"></span>,
|
||||
Chromium <span id="chrome-version"></span>,
|
||||
and Electron <span id="electron-version"></span>.
|
||||
1. On line 1: First you define an event listener that tells you when the web page has loaded
|
||||
2. On line 2: Second you define a utility function used to set the text of the placeholders in the `index.html`
|
||||
3. On line 7: Next you loop through the list of components whose version you want to display
|
||||
4. On line 8: Finally, you call `replaceText` to look up the version placeholders in `index.html` and set their text value to the values from `process.versions`
|
||||
|
||||
<!-- You can also require other files to run in this process -->
|
||||
<script src="./renderer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
#### Modify your package.json file
|
||||
|
||||
Your Electron application uses the `package.json` file as the main entry point (as any other Node.js application). The main script of your application is `main.js`, so modify the `package.json` file accordingly:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "my-electron-app",
|
||||
"version": "0.1.0",
|
||||
"author": "your name",
|
||||
"description": "My Electron app",
|
||||
"main": "main.js"
|
||||
}
|
||||
```
|
||||
|
||||
```fiddle docs/fiddles/quickstart
|
||||
> NOTE: If the `main` field is omitted, Electron will attempt to load an `index.js` file from the directory containing `package.json`.
|
||||
|
||||
> NOTE: The `author` and `description` fields are required for packaging, otherwise error will occur when running `npm run make`.
|
||||
|
||||
By default, the `npm start` command will run the main script with Node.js. To run the script with Electron, you need to change it as such:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "my-electron-app",
|
||||
"version": "0.1.0",
|
||||
"author": "your name",
|
||||
"description": "My Electron app",
|
||||
"main": "main.js",
|
||||
"scripts": {
|
||||
"start": "electron ."
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
To summarize all the steps we've done:
|
||||
#### Run your application
|
||||
|
||||
* We bootstrapped a Node.js application and added Electron as a dependency.
|
||||
* We created a `main.js` script that runs our main process, which controls our app
|
||||
and runs in a Node.js environment. In this script, we used Electron's `app` and
|
||||
`BrowserWindow` modules to create a browser window that displays web content
|
||||
in a separate process (the renderer).
|
||||
* In order to access certain Node.js functionality in the renderer, we attached
|
||||
a preload script to our `BrowserWindow` constructor.
|
||||
```sh
|
||||
npm start
|
||||
```
|
||||
|
||||
## Package and distribute your application
|
||||
Your running Electron app should look as follows:
|
||||
|
||||
The fastest way to distribute your newly created app is using
|
||||

|
||||
|
||||
### Package and distribute the application
|
||||
|
||||
The simplest and the fastest way to distribute your newly created app is using
|
||||
[Electron Forge](https://www.electronforge.io).
|
||||
|
||||
1. Add Electron Forge as a development dependency of your app, and use its `import` command to set up
|
||||
Forge's scaffolding:
|
||||
1. Import Electron Forge to your app folder:
|
||||
|
||||
```sh npm2yarn
|
||||
```sh
|
||||
npm install --save-dev @electron-forge/cli
|
||||
npx electron-forge import
|
||||
|
||||
@@ -477,12 +211,12 @@ Forge's scaffolding:
|
||||
Thanks for using "electron-forge"!!!
|
||||
```
|
||||
|
||||
1. Create a distributable using Forge's `make` command:
|
||||
1. Create a distributable:
|
||||
|
||||
```sh npm2yarn
|
||||
```sh
|
||||
npm run make
|
||||
|
||||
> my-electron-app@1.0.0 make /my-electron-app
|
||||
> my-gsod-electron-app@1.0.0 make /my-electron-app
|
||||
> electron-forge make
|
||||
|
||||
✔ Checking your system
|
||||
@@ -495,12 +229,109 @@ Forge's scaffolding:
|
||||
✔ Making for target: zip - On platform: darwin - For arch: x64
|
||||
```
|
||||
|
||||
Electron Forge creates the `out` folder where your package will be located:
|
||||
Electron-forge creates the `out` folder where your package will be located:
|
||||
|
||||
```plain
|
||||
// Example for macOS
|
||||
// Example for MacOS
|
||||
out/
|
||||
├── out/make/zip/darwin/x64/my-electron-app-darwin-x64-1.0.0.zip
|
||||
├── ...
|
||||
└── out/my-electron-app-darwin-x64/my-electron-app.app/Contents/MacOS/my-electron-app
|
||||
```
|
||||
|
||||
[node-download]: https://nodejs.org/en/download/
|
||||
|
||||
## Learning the basics
|
||||
|
||||
This section guides you through the basics of how Electron works under the hood. It aims at strengthening knowledge about Electron and the application created earlier in the Quickstart section.
|
||||
|
||||
### Application architecture
|
||||
|
||||
Electron consists of three main pillars:
|
||||
|
||||
* **Chromium** for displaying web content.
|
||||
* **Node.js** for working with the local filesystem and the operating system.
|
||||
* **Custom APIs** for working with often-needed OS native functions.
|
||||
|
||||
Developing an application with Electron is like building a Node.js app with a web interface or building web pages with seamless Node.js integration.
|
||||
|
||||
#### Main and Renderer Processes
|
||||
|
||||
As it was mentioned before, Electron has two types of processes: Main and Renderer.
|
||||
|
||||
* The Main process **creates** web pages by creating `BrowserWindow` instances. Each `BrowserWindow` instance runs the web page in its Renderer process. When a `BrowserWindow` instance is destroyed, the corresponding Renderer process gets terminated as well.
|
||||
* The Main process **manages** all web pages and their corresponding Renderer processes.
|
||||
|
||||
----
|
||||
|
||||
* The Renderer process **manages** only the corresponding web page. A crash in one Renderer process does not affect other Renderer processes.
|
||||
* The Renderer process **communicates** with the Main process via IPC to perform GUI operations in a web page. Calling native GUI-related APIs from the Renderer process directly is restricted due to security concerns and potential resource leakage.
|
||||
|
||||
----
|
||||
|
||||
The communication between processes is possible via Inter-Process Communication (IPC) modules: [`ipcMain`](../api/ipc-main.md) and [`ipcRenderer`](../api/ipc-renderer.md).
|
||||
|
||||
#### APIs
|
||||
|
||||
##### Electron API
|
||||
|
||||
Electron APIs are assigned based on the process type, meaning that some modules can be used from either the Main or Renderer process, and some from both. Electron's API documentation indicates which process each module can be used from.
|
||||
|
||||
For example, to access the Electron API in both processes, require its included module:
|
||||
|
||||
```js
|
||||
const electron = require('electron')
|
||||
```
|
||||
|
||||
To create a window, call the `BrowserWindow` class, which is only available in the Main process:
|
||||
|
||||
```js
|
||||
const { BrowserWindow } = require('electron')
|
||||
const win = new BrowserWindow()
|
||||
```
|
||||
|
||||
To call the Main process from the Renderer, use the IPC module:
|
||||
|
||||
```js
|
||||
// In the Main process
|
||||
const { ipcMain } = require('electron')
|
||||
|
||||
ipcMain.handle('perform-action', (event, ...args) => {
|
||||
// ... do actions on behalf of the Renderer
|
||||
})
|
||||
```
|
||||
|
||||
```js
|
||||
// In the Renderer process
|
||||
const { ipcRenderer } = require('electron')
|
||||
|
||||
ipcRenderer.invoke('perform-action', ...args)
|
||||
```
|
||||
|
||||
> NOTE: Because Renderer processes may run untrusted code (especially from third parties), it is important to carefully validate the requests that come to the Main process.
|
||||
|
||||
##### Node.js API
|
||||
|
||||
> NOTE: To access the Node.js API from the Renderer process, you need to set the `nodeIntegration` preference to `true` and the `contextIsolation` preference to `false`. Please note that access to the Node.js API in any renderer that loads remote content is not recommended for [security reasons](../tutorial/security.md#2-do-not-enable-nodejs-integration-for-remote-content).
|
||||
|
||||
Electron exposes full access to Node.js API and its modules both in the Main and the Renderer processes. For example, you can read all the files from the root directory:
|
||||
|
||||
```js
|
||||
const fs = require('fs')
|
||||
|
||||
const root = fs.readdirSync('/')
|
||||
|
||||
console.log(root)
|
||||
```
|
||||
|
||||
To use a Node.js module, you first need to install it as a dependency:
|
||||
|
||||
```sh
|
||||
npm install --save aws-sdk
|
||||
```
|
||||
|
||||
Then, in your Electron application, require the module:
|
||||
|
||||
```js
|
||||
const S3 = require('aws-sdk/clients/s3')
|
||||
```
|
||||
|
||||
@@ -83,22 +83,6 @@ following code snippet to your menu template:
|
||||
}
|
||||
```
|
||||
|
||||
Make sure the application menu is added after the [`'ready'`](../api/app.md#event-ready)
|
||||
event and not before, or the menu item will be disabled:
|
||||
|
||||
```javascript
|
||||
const { app, Menu } = require('electron')
|
||||
|
||||
const template = [
|
||||
// Menu template here
|
||||
]
|
||||
const menu = Menu.buildFromTemplate(template)
|
||||
|
||||
app.whenReady().then(() => {
|
||||
Menu.setApplicationMenu(menu)
|
||||
})
|
||||
```
|
||||
|
||||
![macOS Recent Documents menu item][menu-item-image]
|
||||
|
||||
When a file is requested from the recent documents menu, the `open-file` event
|
||||
|
||||
@@ -1,23 +1,27 @@
|
||||
# REPL
|
||||
|
||||
[Read-Eval-Print-Loop](https://en.wikipedia.org/wiki/Read%E2%80%93eval%E2%80%93print_loop) (REPL)
|
||||
is a simple, interactive computer programming environment that takes single user
|
||||
inputs (i.e. single expressions), evaluates them, and returns the result to the user.
|
||||
Read-Eval-Print-Loop (REPL) is a simple, interactive computer programming
|
||||
environment that takes single user inputs (i.e. single expressions), evaluates
|
||||
them, and returns the result to the user.
|
||||
|
||||
## Main process
|
||||
The `repl` module provides a REPL implementation that can be accessed using:
|
||||
|
||||
Electron exposes the [Node.js `repl` module](https://nodejs.org/dist/latest/docs/api/repl.html)
|
||||
through the `--interactive` CLI flag. Assuming you have `electron` installed as a local project
|
||||
dependency, you should be able to access the REPL with the following command:
|
||||
* Assuming you have `electron` or `electron-prebuilt` installed as a local
|
||||
project dependency:
|
||||
|
||||
```sh
|
||||
./node_modules/.bin/electron --interactive
|
||||
```
|
||||
|
||||
**Note:** `electron --interactive` is not available on Windows
|
||||
(see [electron/electron#5776](https://github.com/electron/electron/pull/5776) for more details).
|
||||
* Assuming you have `electron` or `electron-prebuilt` installed globally:
|
||||
|
||||
## Renderer process
|
||||
```sh
|
||||
electron --interactive
|
||||
```
|
||||
|
||||
You can use the DevTools Console tab to get a REPL for any renderer process.
|
||||
To learn more, read [the Chrome documentation](https://developer.chrome.com/docs/devtools/console/).
|
||||
This only creates a REPL for the main process. You can use the Console
|
||||
tab of the Dev Tools to get a REPL for the renderer processes.
|
||||
|
||||
**Note:** `electron --interactive` is not available on Windows.
|
||||
|
||||
More information can be found in the [Node.js REPL docs](https://nodejs.org/dist/latest/docs/api/repl.html).
|
||||
|
||||
@@ -1,169 +0,0 @@
|
||||
# Process Sandboxing
|
||||
|
||||
One key security feature in Chromium is that processes can be executed within a sandbox.
|
||||
The sandbox limits the harm that malicious code can cause by limiting access to most
|
||||
system resources — sandboxed processes can only freely use CPU cycles and memory.
|
||||
In order to perform operations requiring additional privilege, sandboxed processes
|
||||
use dedicated communication channels to delegate tasks to more privileged processes.
|
||||
|
||||
In Chromium, sandboxing is applied to most processes other than the main process.
|
||||
This includes renderer processes, as well as utility processes such as the audio service,
|
||||
the GPU service and the network service.
|
||||
|
||||
See Chromium's [Sandbox design document][sandbox] for more information.
|
||||
|
||||
## Electron's sandboxing policies
|
||||
|
||||
Electron comes with a mixed sandbox environment, meaning sandboxed processes can run
|
||||
alongside privileged ones. By default, renderer processes are not sandboxed, but
|
||||
utility processes are. Note that as in Chromium, the main (browser) process is
|
||||
privileged and cannot be sandboxed.
|
||||
|
||||
Historically, this mixed sandbox approach was established because having Node.js available
|
||||
in the renderer is an extremely powerful tool for app developers. Unfortunately, this
|
||||
feature is also an equally massive security vulnerability.
|
||||
|
||||
Theoretically, unsandboxed renderers are not a problem for desktop applications that
|
||||
only display trusted code, but they make Electron less secure than Chromium for
|
||||
displaying untrusted web content. However, even purportedly trusted code may be
|
||||
dangerous — there are countless attack vectors that malicious actors can use, from
|
||||
cross-site scripting to content injection to man-in-the-middle attacks on remotely loaded
|
||||
websites, just to name a few. For this reason, we recommend enabling renderer sandboxing
|
||||
for the vast majority of cases under an abundance of caution.
|
||||
|
||||
<!--TODO: update this guide when #28466 is either solved or closed -->
|
||||
Note that there is an active discussion in the issue tracker to enable renderer sandboxing
|
||||
by default. See [#28466][issue-28466]) for details.
|
||||
|
||||
## Sandbox behaviour in Electron
|
||||
|
||||
Sandboxed processes in Electron behave _mostly_ in the same way as Chromium's do, but
|
||||
Electron has a few additional concepts to consider because it interfaces with Node.js.
|
||||
|
||||
### Renderer processes
|
||||
|
||||
When renderer processes in Electron are sandboxed, they behave in the same way as a
|
||||
regular Chrome renderer would. A sandboxed renderer won't have a Node.js
|
||||
environment initialized.
|
||||
|
||||
<!-- TODO(erickzhao): when we have a solid guide for IPC, link it here -->
|
||||
Therefore, when the sandbox is enabled, renderer processes can only perform privileged
|
||||
tasks (such as interacting with the filesystem, making changes to the system, or spawning
|
||||
subprocesses) by delegating these tasks to the main process via inter-process
|
||||
communication (IPC).
|
||||
|
||||
### Preload scripts
|
||||
|
||||
In order to allow renderer processes to communicate with the main process, preload
|
||||
scripts attached to sandboxed renderers will still have a polyfilled subset of Node.js
|
||||
APIs available. A `require` function similar to Node's `require` module is exposed,
|
||||
but can only import a subset of Electron and Node's built-in modules:
|
||||
|
||||
* `electron` (only renderer process modules)
|
||||
* [`events`](https://nodejs.org/api/events.html)
|
||||
* [`timers`](https://nodejs.org/api/timers.html)
|
||||
* [`url`](https://nodejs.org/api/url.html)
|
||||
|
||||
In addition, the preload script also polyfills certain Node.js primitives as globals:
|
||||
|
||||
* [`Buffer`](https://nodejs.org/api/Buffer.html)
|
||||
* [`process`](../api/process.md)
|
||||
* [`clearImmediate`](https://nodejs.org/api/timers.html#timers_clearimmediate_immediate)
|
||||
* [`setImmediate`](https://nodejs.org/api/timers.html#timers_setimmediate_callback_args)
|
||||
|
||||
Because the `require` function is a polyfill with limited functionality, you will not be
|
||||
able to use [CommonJS modules][commonjs] to separate your preload script into multiple
|
||||
files. If you need to split your preload code, use a bundler such as [webpack][webpack]
|
||||
or [Parcel][parcel].
|
||||
|
||||
Note that because the environment presented to the `preload` script is substantially
|
||||
more privileged than that of a sandboxed renderer, it is still possible to leak
|
||||
privileged APIs to untrusted code running in the renderer process unless
|
||||
[`contextIsolation`][contextIsolation] is enabled.
|
||||
|
||||
## Configuring the sandbox
|
||||
|
||||
### Enabling the sandbox for a single process
|
||||
|
||||
In Electron, renderer sandboxing can be enabled on a per-process basis with
|
||||
the `sandbox: true` preference in the [`BrowserWindow`][browser-window] constructor.
|
||||
|
||||
```js
|
||||
// main.js
|
||||
app.whenReady().then(() => {
|
||||
const win = new BrowserWindow({
|
||||
webPreferences: {
|
||||
sandbox: true
|
||||
}
|
||||
})
|
||||
win.loadURL('https://google.com')
|
||||
})
|
||||
```
|
||||
|
||||
### Enabling the sandbox globally
|
||||
|
||||
If you want to force sandboxing for all renderers, you can also use the
|
||||
[`app.enableSandbox`][enable-sandbox] API. Note that this API has to be called before the
|
||||
app's `ready` event.
|
||||
|
||||
```js
|
||||
// main.js
|
||||
app.enableSandbox()
|
||||
app.whenReady().then(() => {
|
||||
// no need to pass `sandbox: true` since `app.enableSandbox()` was called.
|
||||
const win = new BrowserWindow()
|
||||
win.loadURL('https://google.com')
|
||||
})
|
||||
```
|
||||
|
||||
### Disabling Chromium's sandbox (testing only)
|
||||
|
||||
You can also disable Chromium's sandbox entirely with the [`--no-sandbox`][no-sandbox]
|
||||
CLI flag, which will disable the sandbox for all processes (including utility processes).
|
||||
We highly recommend that you only use this flag for testing purposes, and **never**
|
||||
in production.
|
||||
|
||||
Note that the `sandbox: true` option will still disable the renderer's Node.js
|
||||
environment.
|
||||
|
||||
## A note on rendering untrusted content
|
||||
|
||||
Rendering untrusted content in Electron is still somewhat uncharted territory,
|
||||
though some apps are finding success (e.g. [Beaker Browser][beaker]).
|
||||
Our goal is to get as close to Chrome as we can in terms of the security of
|
||||
sandboxed content, but ultimately we will always be behind due to a few fundamental
|
||||
issues:
|
||||
|
||||
1. We do not have the dedicated resources or expertise that Chromium has to
|
||||
apply to the security of its product. We do our best to make use of what we
|
||||
have, to inherit everything we can from Chromium, and to respond quickly to
|
||||
security issues, but Electron cannot be as secure as Chromium without the
|
||||
resources that Chromium is able to dedicate.
|
||||
2. Some security features in Chrome (such as Safe Browsing and Certificate
|
||||
Transparency) require a centralized authority and dedicated servers, both of
|
||||
which run counter to the goals of the Electron project. As such, we disable
|
||||
those features in Electron, at the cost of the associated security they
|
||||
would otherwise bring.
|
||||
3. There is only one Chromium, whereas there are many thousands of apps built
|
||||
on Electron, all of which behave slightly differently. Accounting for those
|
||||
differences can yield a huge possibility space, and make it challenging to
|
||||
ensure the security of the platform in unusual use cases.
|
||||
4. We can't push security updates to users directly, so we rely on app vendors
|
||||
to upgrade the version of Electron underlying their app in order for
|
||||
security updates to reach users.
|
||||
|
||||
While we make our best effort to backport Chromium security fixes to older
|
||||
versions of Electron, we do not make a guarantee that every fix will be
|
||||
backported. Your best chance at staying secure is to be on the latest stable
|
||||
version of Electron.
|
||||
|
||||
[sandbox]: https://chromium.googlesource.com/chromium/src/+/master/docs/design/sandbox.md
|
||||
[issue-28466]: https://github.com/electron/electron/issues/28466
|
||||
[browser-window]: ../api/browser-window.md
|
||||
[enable-sandbox]: ../api/app.md#appenablesandbox
|
||||
[no-sandbox]: ../api/command-line-switches.md#--no-sandbox
|
||||
[commonjs]: https://nodejs.org/api/modules.html#modules_modules_commonjs_modules
|
||||
[webpack]: https://webpack.js.org/
|
||||
[parcel]: https://parceljs.org/
|
||||
[context-isolation]: ./context-isolation.md
|
||||
[beaker]: https://github.com/beakerbrowser/beaker
|
||||
@@ -692,5 +692,5 @@ which potential security issues are not as widely known.
|
||||
[window-open-handler]: ../api/web-contents.md#contentssetwindowopenhandlerhandler
|
||||
[will-navigate]: ../api/web-contents.md#event-will-navigate
|
||||
[open-external]: ../api/shell.md#shellopenexternalurl-options
|
||||
[sandbox]: ../tutorial/sandbox.md
|
||||
[sandbox]: ../api/sandbox-option.md
|
||||
[responsible-disclosure]: https://en.wikipedia.org/wiki/Responsible_disclosure
|
||||
|
||||
@@ -29,6 +29,7 @@ auto_filenames = {
|
||||
"docs/api/incoming-message.md",
|
||||
"docs/api/ipc-main.md",
|
||||
"docs/api/ipc-renderer.md",
|
||||
"docs/api/locales.md",
|
||||
"docs/api/menu-item.md",
|
||||
"docs/api/menu.md",
|
||||
"docs/api/message-channel-main.md",
|
||||
@@ -42,7 +43,7 @@ auto_filenames = {
|
||||
"docs/api/power-save-blocker.md",
|
||||
"docs/api/process.md",
|
||||
"docs/api/protocol.md",
|
||||
"docs/api/remote.md",
|
||||
"docs/api/sandbox-option.md",
|
||||
"docs/api/screen.md",
|
||||
"docs/api/service-workers.md",
|
||||
"docs/api/session.md",
|
||||
@@ -128,33 +129,26 @@ auto_filenames = {
|
||||
"docs/api/structures/upload-data.md",
|
||||
"docs/api/structures/upload-file.md",
|
||||
"docs/api/structures/upload-raw-data.md",
|
||||
"docs/api/structures/user-default-types.md",
|
||||
"docs/api/structures/web-source.md",
|
||||
]
|
||||
|
||||
sandbox_bundle_deps = [
|
||||
"lib/browser/api/module-names.ts",
|
||||
"lib/common/api/clipboard.ts",
|
||||
"lib/common/api/deprecate.ts",
|
||||
"lib/common/api/module-list.ts",
|
||||
"lib/common/api/shell.ts",
|
||||
"lib/common/define-properties.ts",
|
||||
"lib/common/ipc-messages.ts",
|
||||
"lib/common/remote/ipc-messages.ts",
|
||||
"lib/common/type-utils.ts",
|
||||
"lib/common/web-view-events.ts",
|
||||
"lib/common/web-view-methods.ts",
|
||||
"lib/common/webpack-globals-provider.ts",
|
||||
"lib/renderer/api/context-bridge.ts",
|
||||
"lib/renderer/api/crash-reporter.ts",
|
||||
"lib/renderer/api/desktop-capturer.ts",
|
||||
"lib/renderer/api/ipc-renderer.ts",
|
||||
"lib/renderer/api/native-image.ts",
|
||||
"lib/renderer/api/remote.ts",
|
||||
"lib/renderer/api/web-frame.ts",
|
||||
"lib/renderer/inspector.ts",
|
||||
"lib/renderer/ipc-renderer-internal-utils.ts",
|
||||
"lib/renderer/ipc-renderer-internal.ts",
|
||||
"lib/renderer/remote/callbacks-registry.ts",
|
||||
"lib/renderer/security-warnings.ts",
|
||||
"lib/renderer/web-frame-init.ts",
|
||||
"lib/renderer/web-view/guest-view-internal.ts",
|
||||
@@ -239,8 +233,6 @@ auto_filenames = {
|
||||
"lib/browser/ipc-main-internal.ts",
|
||||
"lib/browser/message-port-main.ts",
|
||||
"lib/browser/navigation-controller.ts",
|
||||
"lib/browser/remote/objects-registry.ts",
|
||||
"lib/browser/remote/server.ts",
|
||||
"lib/browser/rpc-server.ts",
|
||||
"lib/common/api/clipboard.ts",
|
||||
"lib/common/api/deprecate.ts",
|
||||
@@ -250,7 +242,6 @@ auto_filenames = {
|
||||
"lib/common/init.ts",
|
||||
"lib/common/ipc-messages.ts",
|
||||
"lib/common/parse-features-string.ts",
|
||||
"lib/common/remote/ipc-messages.ts",
|
||||
"lib/common/reset-search-paths.ts",
|
||||
"lib/common/type-utils.ts",
|
||||
"lib/common/web-view-events.ts",
|
||||
@@ -266,7 +257,6 @@ auto_filenames = {
|
||||
]
|
||||
|
||||
renderer_bundle_deps = [
|
||||
"lib/browser/api/module-names.ts",
|
||||
"lib/common/api/clipboard.ts",
|
||||
"lib/common/api/deprecate.ts",
|
||||
"lib/common/api/module-list.ts",
|
||||
@@ -274,12 +264,10 @@ auto_filenames = {
|
||||
"lib/common/define-properties.ts",
|
||||
"lib/common/init.ts",
|
||||
"lib/common/ipc-messages.ts",
|
||||
"lib/common/remote/ipc-messages.ts",
|
||||
"lib/common/reset-search-paths.ts",
|
||||
"lib/common/type-utils.ts",
|
||||
"lib/common/web-view-events.ts",
|
||||
"lib/common/web-view-methods.ts",
|
||||
"lib/common/webpack-globals-provider.ts",
|
||||
"lib/common/webpack-provider.ts",
|
||||
"lib/renderer/api/context-bridge.ts",
|
||||
"lib/renderer/api/crash-reporter.ts",
|
||||
@@ -288,13 +276,11 @@ auto_filenames = {
|
||||
"lib/renderer/api/ipc-renderer.ts",
|
||||
"lib/renderer/api/module-list.ts",
|
||||
"lib/renderer/api/native-image.ts",
|
||||
"lib/renderer/api/remote.ts",
|
||||
"lib/renderer/api/web-frame.ts",
|
||||
"lib/renderer/init.ts",
|
||||
"lib/renderer/inspector.ts",
|
||||
"lib/renderer/ipc-renderer-internal-utils.ts",
|
||||
"lib/renderer/ipc-renderer-internal.ts",
|
||||
"lib/renderer/remote/callbacks-registry.ts",
|
||||
"lib/renderer/security-warnings.ts",
|
||||
"lib/renderer/web-frame-init.ts",
|
||||
"lib/renderer/web-view/guest-view-internal.ts",
|
||||
@@ -312,7 +298,6 @@ auto_filenames = {
|
||||
]
|
||||
|
||||
worker_bundle_deps = [
|
||||
"lib/browser/api/module-names.ts",
|
||||
"lib/common/api/clipboard.ts",
|
||||
"lib/common/api/deprecate.ts",
|
||||
"lib/common/api/module-list.ts",
|
||||
@@ -320,10 +305,8 @@ auto_filenames = {
|
||||
"lib/common/define-properties.ts",
|
||||
"lib/common/init.ts",
|
||||
"lib/common/ipc-messages.ts",
|
||||
"lib/common/remote/ipc-messages.ts",
|
||||
"lib/common/reset-search-paths.ts",
|
||||
"lib/common/type-utils.ts",
|
||||
"lib/common/webpack-globals-provider.ts",
|
||||
"lib/common/webpack-provider.ts",
|
||||
"lib/renderer/api/context-bridge.ts",
|
||||
"lib/renderer/api/crash-reporter.ts",
|
||||
@@ -332,11 +315,9 @@ auto_filenames = {
|
||||
"lib/renderer/api/ipc-renderer.ts",
|
||||
"lib/renderer/api/module-list.ts",
|
||||
"lib/renderer/api/native-image.ts",
|
||||
"lib/renderer/api/remote.ts",
|
||||
"lib/renderer/api/web-frame.ts",
|
||||
"lib/renderer/ipc-renderer-internal-utils.ts",
|
||||
"lib/renderer/ipc-renderer-internal.ts",
|
||||
"lib/renderer/remote/callbacks-registry.ts",
|
||||
"lib/worker/init.ts",
|
||||
"package.json",
|
||||
"tsconfig.electron.json",
|
||||
|
||||
@@ -1,194 +0,0 @@
|
||||
libcxx_headers = [
|
||||
"//buildtools/third_party/libc++/trunk/include/CMakeLists.txt",
|
||||
"//buildtools/third_party/libc++/trunk/include/__availability",
|
||||
"//buildtools/third_party/libc++/trunk/include/__bit_reference",
|
||||
"//buildtools/third_party/libc++/trunk/include/__bits",
|
||||
"//buildtools/third_party/libc++/trunk/include/__bsd_locale_defaults.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__bsd_locale_fallbacks.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__config",
|
||||
"//buildtools/third_party/libc++/trunk/include/__config_site.in",
|
||||
"//buildtools/third_party/libc++/trunk/include/__debug",
|
||||
"//buildtools/third_party/libc++/trunk/include/__errc",
|
||||
"//buildtools/third_party/libc++/trunk/include/__functional_03",
|
||||
"//buildtools/third_party/libc++/trunk/include/__functional_base",
|
||||
"//buildtools/third_party/libc++/trunk/include/__functional_base_03",
|
||||
"//buildtools/third_party/libc++/trunk/include/__hash_table",
|
||||
"//buildtools/third_party/libc++/trunk/include/__libcpp_version",
|
||||
"//buildtools/third_party/libc++/trunk/include/__locale",
|
||||
"//buildtools/third_party/libc++/trunk/include/__memory/allocator_traits.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__memory/base.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__memory/pointer_traits.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__memory/utilities.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__mutex_base",
|
||||
"//buildtools/third_party/libc++/trunk/include/__node_handle",
|
||||
"//buildtools/third_party/libc++/trunk/include/__nullptr",
|
||||
"//buildtools/third_party/libc++/trunk/include/__split_buffer",
|
||||
"//buildtools/third_party/libc++/trunk/include/__sso_allocator",
|
||||
"//buildtools/third_party/libc++/trunk/include/__std_stream",
|
||||
"//buildtools/third_party/libc++/trunk/include/__string",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/android/locale_bionic.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/fuchsia/xlocale.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/ibm/limits.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/ibm/locale_mgmt_aix.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/ibm/nanosleep.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/ibm/support.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/ibm/xlocale.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/musl/xlocale.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/newlib/xlocale.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/nuttx/xlocale.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/openbsd/xlocale.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/solaris/floatingpoint.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/solaris/wchar.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/solaris/xlocale.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/win32/limits_msvc_win32.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/win32/locale_win32.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/xlocale/__nop_locale_mgmt.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/xlocale/__posix_l_fallback.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__support/xlocale/__strtonum_fallback.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/__threading_support",
|
||||
"//buildtools/third_party/libc++/trunk/include/__tree",
|
||||
"//buildtools/third_party/libc++/trunk/include/__tuple",
|
||||
"//buildtools/third_party/libc++/trunk/include/__undef_macros",
|
||||
"//buildtools/third_party/libc++/trunk/include/algorithm",
|
||||
"//buildtools/third_party/libc++/trunk/include/any",
|
||||
"//buildtools/third_party/libc++/trunk/include/array",
|
||||
"//buildtools/third_party/libc++/trunk/include/atomic",
|
||||
"//buildtools/third_party/libc++/trunk/include/barrier",
|
||||
"//buildtools/third_party/libc++/trunk/include/bit",
|
||||
"//buildtools/third_party/libc++/trunk/include/bitset",
|
||||
"//buildtools/third_party/libc++/trunk/include/cassert",
|
||||
"//buildtools/third_party/libc++/trunk/include/ccomplex",
|
||||
"//buildtools/third_party/libc++/trunk/include/cctype",
|
||||
"//buildtools/third_party/libc++/trunk/include/cerrno",
|
||||
"//buildtools/third_party/libc++/trunk/include/cfenv",
|
||||
"//buildtools/third_party/libc++/trunk/include/cfloat",
|
||||
"//buildtools/third_party/libc++/trunk/include/charconv",
|
||||
"//buildtools/third_party/libc++/trunk/include/chrono",
|
||||
"//buildtools/third_party/libc++/trunk/include/cinttypes",
|
||||
"//buildtools/third_party/libc++/trunk/include/ciso646",
|
||||
"//buildtools/third_party/libc++/trunk/include/climits",
|
||||
"//buildtools/third_party/libc++/trunk/include/clocale",
|
||||
"//buildtools/third_party/libc++/trunk/include/cmath",
|
||||
"//buildtools/third_party/libc++/trunk/include/codecvt",
|
||||
"//buildtools/third_party/libc++/trunk/include/compare",
|
||||
"//buildtools/third_party/libc++/trunk/include/complex",
|
||||
"//buildtools/third_party/libc++/trunk/include/complex.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/concepts",
|
||||
"//buildtools/third_party/libc++/trunk/include/condition_variable",
|
||||
"//buildtools/third_party/libc++/trunk/include/csetjmp",
|
||||
"//buildtools/third_party/libc++/trunk/include/csignal",
|
||||
"//buildtools/third_party/libc++/trunk/include/cstdarg",
|
||||
"//buildtools/third_party/libc++/trunk/include/cstdbool",
|
||||
"//buildtools/third_party/libc++/trunk/include/cstddef",
|
||||
"//buildtools/third_party/libc++/trunk/include/cstdint",
|
||||
"//buildtools/third_party/libc++/trunk/include/cstdio",
|
||||
"//buildtools/third_party/libc++/trunk/include/cstdlib",
|
||||
"//buildtools/third_party/libc++/trunk/include/cstring",
|
||||
"//buildtools/third_party/libc++/trunk/include/ctgmath",
|
||||
"//buildtools/third_party/libc++/trunk/include/ctime",
|
||||
"//buildtools/third_party/libc++/trunk/include/ctype.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/cwchar",
|
||||
"//buildtools/third_party/libc++/trunk/include/cwctype",
|
||||
"//buildtools/third_party/libc++/trunk/include/deque",
|
||||
"//buildtools/third_party/libc++/trunk/include/errno.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/exception",
|
||||
"//buildtools/third_party/libc++/trunk/include/execution",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/__config",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/__memory",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/algorithm",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/coroutine",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/deque",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/filesystem",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/forward_list",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/functional",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/iterator",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/list",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/map",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/memory_resource",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/propagate_const",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/regex",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/set",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/simd",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/string",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/type_traits",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/unordered_map",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/unordered_set",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/utility",
|
||||
"//buildtools/third_party/libc++/trunk/include/experimental/vector",
|
||||
"//buildtools/third_party/libc++/trunk/include/ext/__hash",
|
||||
"//buildtools/third_party/libc++/trunk/include/ext/hash_map",
|
||||
"//buildtools/third_party/libc++/trunk/include/ext/hash_set",
|
||||
"//buildtools/third_party/libc++/trunk/include/fenv.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/filesystem",
|
||||
"//buildtools/third_party/libc++/trunk/include/float.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/format",
|
||||
"//buildtools/third_party/libc++/trunk/include/forward_list",
|
||||
"//buildtools/third_party/libc++/trunk/include/fstream",
|
||||
"//buildtools/third_party/libc++/trunk/include/functional",
|
||||
"//buildtools/third_party/libc++/trunk/include/future",
|
||||
"//buildtools/third_party/libc++/trunk/include/initializer_list",
|
||||
"//buildtools/third_party/libc++/trunk/include/inttypes.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/iomanip",
|
||||
"//buildtools/third_party/libc++/trunk/include/ios",
|
||||
"//buildtools/third_party/libc++/trunk/include/iosfwd",
|
||||
"//buildtools/third_party/libc++/trunk/include/iostream",
|
||||
"//buildtools/third_party/libc++/trunk/include/istream",
|
||||
"//buildtools/third_party/libc++/trunk/include/iterator",
|
||||
"//buildtools/third_party/libc++/trunk/include/latch",
|
||||
"//buildtools/third_party/libc++/trunk/include/limits",
|
||||
"//buildtools/third_party/libc++/trunk/include/limits.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/list",
|
||||
"//buildtools/third_party/libc++/trunk/include/locale",
|
||||
"//buildtools/third_party/libc++/trunk/include/locale.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/map",
|
||||
"//buildtools/third_party/libc++/trunk/include/math.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/memory",
|
||||
"//buildtools/third_party/libc++/trunk/include/module.modulemap",
|
||||
"//buildtools/third_party/libc++/trunk/include/mutex",
|
||||
"//buildtools/third_party/libc++/trunk/include/new",
|
||||
"//buildtools/third_party/libc++/trunk/include/numbers",
|
||||
"//buildtools/third_party/libc++/trunk/include/numeric",
|
||||
"//buildtools/third_party/libc++/trunk/include/optional",
|
||||
"//buildtools/third_party/libc++/trunk/include/ostream",
|
||||
"//buildtools/third_party/libc++/trunk/include/queue",
|
||||
"//buildtools/third_party/libc++/trunk/include/random",
|
||||
"//buildtools/third_party/libc++/trunk/include/ratio",
|
||||
"//buildtools/third_party/libc++/trunk/include/regex",
|
||||
"//buildtools/third_party/libc++/trunk/include/scoped_allocator",
|
||||
"//buildtools/third_party/libc++/trunk/include/semaphore",
|
||||
"//buildtools/third_party/libc++/trunk/include/set",
|
||||
"//buildtools/third_party/libc++/trunk/include/setjmp.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/shared_mutex",
|
||||
"//buildtools/third_party/libc++/trunk/include/span",
|
||||
"//buildtools/third_party/libc++/trunk/include/sstream",
|
||||
"//buildtools/third_party/libc++/trunk/include/stack",
|
||||
"//buildtools/third_party/libc++/trunk/include/stdbool.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/stddef.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/stdexcept",
|
||||
"//buildtools/third_party/libc++/trunk/include/stdint.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/stdio.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/stdlib.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/streambuf",
|
||||
"//buildtools/third_party/libc++/trunk/include/string",
|
||||
"//buildtools/third_party/libc++/trunk/include/string.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/string_view",
|
||||
"//buildtools/third_party/libc++/trunk/include/strstream",
|
||||
"//buildtools/third_party/libc++/trunk/include/system_error",
|
||||
"//buildtools/third_party/libc++/trunk/include/tgmath.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/thread",
|
||||
"//buildtools/third_party/libc++/trunk/include/tuple",
|
||||
"//buildtools/third_party/libc++/trunk/include/type_traits",
|
||||
"//buildtools/third_party/libc++/trunk/include/typeindex",
|
||||
"//buildtools/third_party/libc++/trunk/include/typeinfo",
|
||||
"//buildtools/third_party/libc++/trunk/include/unordered_map",
|
||||
"//buildtools/third_party/libc++/trunk/include/unordered_set",
|
||||
"//buildtools/third_party/libc++/trunk/include/utility",
|
||||
"//buildtools/third_party/libc++/trunk/include/valarray",
|
||||
"//buildtools/third_party/libc++/trunk/include/variant",
|
||||
"//buildtools/third_party/libc++/trunk/include/vector",
|
||||
"//buildtools/third_party/libc++/trunk/include/version",
|
||||
"//buildtools/third_party/libc++/trunk/include/wchar.h",
|
||||
"//buildtools/third_party/libc++/trunk/include/wctype.h",
|
||||
]
|
||||
|
||||
libcxx_licenses = [ "//buildtools/third_party/libc++/trunk/LICENSE.TXT" ]
|
||||
@@ -1,6 +0,0 @@
|
||||
libcxxabi_headers = [
|
||||
"//buildtools/third_party/libc++abi/trunk/include/__cxxabi_config.h",
|
||||
"//buildtools/third_party/libc++abi/trunk/include/cxxabi.h",
|
||||
]
|
||||
|
||||
libcxxabi_licenses = [ "//buildtools/third_party/libc++abi/trunk/LICENSE.TXT" ]
|
||||
@@ -1,7 +1,7 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
|
||||
import { deprecate, Menu } from 'electron/main';
|
||||
import { Menu } from 'electron/main';
|
||||
|
||||
const bindings = process._linkedBinding('electron_browser_app');
|
||||
const commandLine = process._linkedBinding('electron_common_command_line');
|
||||
@@ -63,9 +63,6 @@ Object.defineProperty(app, 'applicationMenu', {
|
||||
return execFile !== 'electron';
|
||||
})();
|
||||
|
||||
// The native implementation is not provided on non-windows platforms
|
||||
app.setAppUserModelId = app.setAppUserModelId || (() => {});
|
||||
|
||||
app._setDefaultAppPaths = (packagePath) => {
|
||||
// Set the user path according to application's name.
|
||||
app.setPath('userData', path.join(app.getPath('appData'), app.name!));
|
||||
@@ -132,7 +129,3 @@ for (const name of events) {
|
||||
webContents.emit(name, event, ...args);
|
||||
});
|
||||
}
|
||||
|
||||
// Deprecate allowRendererProcessReuse but only if they set it to false, no need to log if
|
||||
// they are setting it to true
|
||||
deprecate.removeProperty({ __proto__: app } as any, 'allowRendererProcessReuse', [false]);
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user