diff options
-rw-r--r-- | package.json | 2 | ||||
-rw-r--r-- | packages/main/package.json | 2 | ||||
-rw-r--r-- | packages/main/src/infrastructure/electron/impl/ElectronMainWindow.ts | 1 | ||||
-rw-r--r-- | packages/main/src/infrastructure/electron/impl/ElectronServiceView.ts | 2 | ||||
-rw-r--r-- | packages/preload/package.json | 2 | ||||
-rw-r--r-- | packages/service-preload/package.json | 3 | ||||
-rw-r--r-- | packages/service-preload/src/index.ts | 57 | ||||
-rw-r--r-- | yarn.lock | 55 |
8 files changed, 20 insertions, 104 deletions
diff --git a/package.json b/package.json index 1ade0bb..adeb6ff 100644 --- a/package.json +++ b/package.json | |||
@@ -64,7 +64,7 @@ | |||
64 | "@vitejs/plugin-react": "^1.3.1", | 64 | "@vitejs/plugin-react": "^1.3.1", |
65 | "chokidar": "^3.5.3", | 65 | "chokidar": "^3.5.3", |
66 | "cross-env": "^7.0.3", | 66 | "cross-env": "^7.0.3", |
67 | "electron": "18.0.3", | 67 | "electron": "^19.0.0-alpha.1", |
68 | "electron-builder": "^23.0.6", | 68 | "electron-builder": "^23.0.6", |
69 | "esbuild": "^0.14.36", | 69 | "esbuild": "^0.14.36", |
70 | "eslint": "^8.13.0", | 70 | "eslint": "^8.13.0", |
diff --git a/packages/main/package.json b/packages/main/package.json index 4ebc994..b8e00c8 100644 --- a/packages/main/package.json +++ b/packages/main/package.json | |||
@@ -12,7 +12,7 @@ | |||
12 | "@sophie/shared": "workspace:*", | 12 | "@sophie/shared": "workspace:*", |
13 | "chalk": "^5.0.1", | 13 | "chalk": "^5.0.1", |
14 | "deep-equal": "^2.0.5", | 14 | "deep-equal": "^2.0.5", |
15 | "electron": "18.0.3", | 15 | "electron": "^19.0.0-alpha.1", |
16 | "fs-extra": "^10.0.1", | 16 | "fs-extra": "^10.0.1", |
17 | "i18next": "^21.6.16", | 17 | "i18next": "^21.6.16", |
18 | "json5": "^2.2.1", | 18 | "json5": "^2.2.1", |
diff --git a/packages/main/src/infrastructure/electron/impl/ElectronMainWindow.ts b/packages/main/src/infrastructure/electron/impl/ElectronMainWindow.ts index 6144d89..edc6592 100644 --- a/packages/main/src/infrastructure/electron/impl/ElectronMainWindow.ts +++ b/packages/main/src/infrastructure/electron/impl/ElectronMainWindow.ts | |||
@@ -153,7 +153,6 @@ export default class ElectronMainWindow implements MainWindow { | |||
153 | } | 153 | } |
154 | if (serviceView instanceof ElectronServiceView) { | 154 | if (serviceView instanceof ElectronServiceView) { |
155 | this.browserWindow.setBrowserView(serviceView.browserView); | 155 | this.browserWindow.setBrowserView(serviceView.browserView); |
156 | serviceView.browserView.setBackgroundColor('#fff'); | ||
157 | return; | 156 | return; |
158 | } | 157 | } |
159 | throw new TypeError( | 158 | throw new TypeError( |
diff --git a/packages/main/src/infrastructure/electron/impl/ElectronServiceView.ts b/packages/main/src/infrastructure/electron/impl/ElectronServiceView.ts index 340c523..2e64269 100644 --- a/packages/main/src/infrastructure/electron/impl/ElectronServiceView.ts +++ b/packages/main/src/infrastructure/electron/impl/ElectronServiceView.ts | |||
@@ -55,6 +55,8 @@ export default class ElectronServiceView implements ServiceView { | |||
55 | }, | 55 | }, |
56 | }); | 56 | }); |
57 | 57 | ||
58 | this.browserView.setBackgroundColor('#fff'); | ||
59 | |||
58 | const { webContents } = this.browserView; | 60 | const { webContents } = this.browserView; |
59 | 61 | ||
60 | function setLocation(url: string) { | 62 | function setLocation(url: string) { |
diff --git a/packages/preload/package.json b/packages/preload/package.json index ce6d433..5e5f0bf 100644 --- a/packages/preload/package.json +++ b/packages/preload/package.json | |||
@@ -10,7 +10,7 @@ | |||
10 | }, | 10 | }, |
11 | "dependencies": { | 11 | "dependencies": { |
12 | "@sophie/shared": "workspace:*", | 12 | "@sophie/shared": "workspace:*", |
13 | "electron": "18.0.3", | 13 | "electron": "^19.0.0-alpha.1", |
14 | "i18next": "^21.6.16", | 14 | "i18next": "^21.6.16", |
15 | "loglevel": "^1.8.0", | 15 | "loglevel": "^1.8.0", |
16 | "mobx": "^6.5.0", | 16 | "mobx": "^6.5.0", |
diff --git a/packages/service-preload/package.json b/packages/service-preload/package.json index 4650f10..28d1129 100644 --- a/packages/service-preload/package.json +++ b/packages/service-preload/package.json | |||
@@ -10,8 +10,7 @@ | |||
10 | "dependencies": { | 10 | "dependencies": { |
11 | "@sophie/service-inject": "workspace:*", | 11 | "@sophie/service-inject": "workspace:*", |
12 | "@sophie/service-shared": "workspace:*", | 12 | "@sophie/service-shared": "workspace:*", |
13 | "color-string": "^1.9.0", | 13 | "electron": "^19.0.0-alpha.1" |
14 | "electron": "18.0.3" | ||
15 | }, | 14 | }, |
16 | "devDependencies": { | 15 | "devDependencies": { |
17 | "@types/color-string": "^1.5.2" | 16 | "@types/color-string": "^1.5.2" |
diff --git a/packages/service-preload/src/index.ts b/packages/service-preload/src/index.ts index 99d02ec..eee8551 100644 --- a/packages/service-preload/src/index.ts +++ b/packages/service-preload/src/index.ts | |||
@@ -18,67 +18,10 @@ | |||
18 | * SPDX-License-Identifier: AGPL-3.0-only | 18 | * SPDX-License-Identifier: AGPL-3.0-only |
19 | */ | 19 | */ |
20 | 20 | ||
21 | import colorString from 'color-string'; | ||
22 | import { webFrame } from 'electron'; | 21 | import { webFrame } from 'electron'; |
23 | // eslint-disable-next-line import/no-unresolved -- Synthetic import provided by an eslint plugin. | 22 | // eslint-disable-next-line import/no-unresolved -- Synthetic import provided by an eslint plugin. |
24 | import injectSource from 'sophie-src:@sophie/service-inject'; | 23 | import injectSource from 'sophie-src:@sophie/service-inject'; |
25 | 24 | ||
26 | const DEFAULT_BG_COLOR = '#fff'; | ||
27 | |||
28 | /** | ||
29 | * Styles a HTML element such that its background is opaque. | ||
30 | * | ||
31 | * If there is an existing background color, it will be made maximally opaque. | ||
32 | * | ||
33 | * If there is a background image, transparent areas will be colored `DEFAULT_BG_COLOR`. | ||
34 | * | ||
35 | * If the element was completely transparent, the function returns `false` instead. | ||
36 | * This allows leaving a `html` element transparent to let the background of the `body` | ||
37 | * element render in its palce. | ||
38 | * | ||
39 | * @param element The HTML element to style. | ||
40 | * @returns `true` if the background was made opaque. | ||
41 | * @see https://www.w3.org/TR/css-backgrounds-3/#body-background | ||
42 | */ | ||
43 | function tryMakeOpaque(element: HTMLElement): boolean { | ||
44 | const style = getComputedStyle(element); | ||
45 | const bgColor = colorString.get.rgb(style.backgroundColor); | ||
46 | if (bgColor[3] > 0) { | ||
47 | if (bgColor[3] < 1) { | ||
48 | bgColor[3] = 1; | ||
49 | // eslint-disable-next-line no-param-reassign -- Deliberately add element style. | ||
50 | element.style.backgroundColor = colorString.to.rgb(bgColor); | ||
51 | } | ||
52 | return true; | ||
53 | } | ||
54 | if (style.backgroundImage !== 'none') { | ||
55 | // eslint-disable-next-line no-param-reassign -- Deliberately add element style. | ||
56 | element.style.backgroundColor = DEFAULT_BG_COLOR; | ||
57 | return true; | ||
58 | } | ||
59 | return false; | ||
60 | } | ||
61 | |||
62 | if (webFrame.parent === null) { | ||
63 | // Inject CSS to simulate `browserView.setBackgroundColor`. | ||
64 | // This is injected before the page loads, so the styles from the website will overwrite it. | ||
65 | document.addEventListener('DOMContentLoaded', () => { | ||
66 | if ( | ||
67 | document.documentElement.style.contain === '' && | ||
68 | document.body.style.contain === '' | ||
69 | ) { | ||
70 | if ( | ||
71 | !tryMakeOpaque(document.documentElement) && | ||
72 | !tryMakeOpaque(document.body) | ||
73 | ) { | ||
74 | document.body.style.backgroundColor = DEFAULT_BG_COLOR; | ||
75 | } | ||
76 | } else if (!tryMakeOpaque(document.documentElement)) { | ||
77 | document.documentElement.style.backgroundColor = DEFAULT_BG_COLOR; | ||
78 | } | ||
79 | }); | ||
80 | } | ||
81 | |||
82 | /** | 25 | /** |
83 | * Executes the service inject script in the isolated world. | 26 | * Executes the service inject script in the isolated world. |
84 | * | 27 | * |
@@ -507,9 +507,9 @@ __metadata: | |||
507 | languageName: node | 507 | languageName: node |
508 | linkType: hard | 508 | linkType: hard |
509 | 509 | ||
510 | "@electron/get@npm:^1.13.0": | 510 | "@electron/get@npm:^1.14.1": |
511 | version: 1.13.1 | 511 | version: 1.14.1 |
512 | resolution: "@electron/get@npm:1.13.1" | 512 | resolution: "@electron/get@npm:1.14.1" |
513 | dependencies: | 513 | dependencies: |
514 | debug: ^4.1.1 | 514 | debug: ^4.1.1 |
515 | env-paths: ^2.2.0 | 515 | env-paths: ^2.2.0 |
@@ -525,7 +525,7 @@ __metadata: | |||
525 | optional: true | 525 | optional: true |
526 | global-tunnel-ng: | 526 | global-tunnel-ng: |
527 | optional: true | 527 | optional: true |
528 | checksum: ea9863b73e8aedefb19cfe9b849c585b8bda29e11b90189b115680da4e9ab0167405efe63e5d141da2d13cde24eacacfde62f730f2730d047e58819fe69352f8 | 528 | checksum: 21fec5e82bbee8f9fa183b46e05675b137c3130c7999d3b2b34a0047d1a06ec3c76347b9bbdb9911ba9b2123697804e360a15dda9db614c0226d5d4dcc4d6d15 |
529 | languageName: node | 529 | languageName: node |
530 | linkType: hard | 530 | linkType: hard |
531 | 531 | ||
@@ -1273,7 +1273,7 @@ __metadata: | |||
1273 | "@types/source-map-support": ^0.5.4 | 1273 | "@types/source-map-support": ^0.5.4 |
1274 | chalk: ^5.0.1 | 1274 | chalk: ^5.0.1 |
1275 | deep-equal: ^2.0.5 | 1275 | deep-equal: ^2.0.5 |
1276 | electron: 18.0.3 | 1276 | electron: ^19.0.0-alpha.1 |
1277 | electron-devtools-installer: ^3.2.0 | 1277 | electron-devtools-installer: ^3.2.0 |
1278 | esbuild: ^0.14.36 | 1278 | esbuild: ^0.14.36 |
1279 | fs-extra: ^10.0.1 | 1279 | fs-extra: ^10.0.1 |
@@ -1302,7 +1302,7 @@ __metadata: | |||
1302 | "@jest/globals": ^27.5.1 | 1302 | "@jest/globals": ^27.5.1 |
1303 | "@sophie/shared": "workspace:*" | 1303 | "@sophie/shared": "workspace:*" |
1304 | "@types/jest": ^27.4.1 | 1304 | "@types/jest": ^27.4.1 |
1305 | electron: 18.0.3 | 1305 | electron: ^19.0.0-alpha.1 |
1306 | i18next: ^21.6.16 | 1306 | i18next: ^21.6.16 |
1307 | jest: ^27.5.1 | 1307 | jest: ^27.5.1 |
1308 | jest-mock: ^27.5.1 | 1308 | jest-mock: ^27.5.1 |
@@ -1363,8 +1363,7 @@ __metadata: | |||
1363 | "@sophie/service-inject": "workspace:*" | 1363 | "@sophie/service-inject": "workspace:*" |
1364 | "@sophie/service-shared": "workspace:*" | 1364 | "@sophie/service-shared": "workspace:*" |
1365 | "@types/color-string": ^1.5.2 | 1365 | "@types/color-string": ^1.5.2 |
1366 | color-string: ^1.9.0 | 1366 | electron: ^19.0.0-alpha.1 |
1367 | electron: 18.0.3 | ||
1368 | languageName: unknown | 1367 | languageName: unknown |
1369 | linkType: soft | 1368 | linkType: soft |
1370 | 1369 | ||
@@ -2876,23 +2875,13 @@ __metadata: | |||
2876 | languageName: node | 2875 | languageName: node |
2877 | linkType: hard | 2876 | linkType: hard |
2878 | 2877 | ||
2879 | "color-name@npm:^1.0.0, color-name@npm:~1.1.4": | 2878 | "color-name@npm:~1.1.4": |
2880 | version: 1.1.4 | 2879 | version: 1.1.4 |
2881 | resolution: "color-name@npm:1.1.4" | 2880 | resolution: "color-name@npm:1.1.4" |
2882 | checksum: b0445859521eb4021cd0fb0cc1a75cecf67fceecae89b63f62b201cca8d345baf8b952c966862a9d9a2632987d4f6581f0ec8d957dfacece86f0a7919316f610 | 2881 | checksum: b0445859521eb4021cd0fb0cc1a75cecf67fceecae89b63f62b201cca8d345baf8b952c966862a9d9a2632987d4f6581f0ec8d957dfacece86f0a7919316f610 |
2883 | languageName: node | 2882 | languageName: node |
2884 | linkType: hard | 2883 | linkType: hard |
2885 | 2884 | ||
2886 | "color-string@npm:^1.9.0": | ||
2887 | version: 1.9.0 | ||
2888 | resolution: "color-string@npm:1.9.0" | ||
2889 | dependencies: | ||
2890 | color-name: ^1.0.0 | ||
2891 | simple-swizzle: ^0.2.2 | ||
2892 | checksum: 93c6678b847f8cfa47d19677fd19e1d4b19d7a33f100644400357c298266080b5bca64e5f874fa8ac8cc0aa0606ad44f7a838b4e6fd05e6affea190a68555bb4 | ||
2893 | languageName: node | ||
2894 | linkType: hard | ||
2895 | |||
2896 | "color-support@npm:^1.1.2": | 2885 | "color-support@npm:^1.1.2": |
2897 | version: 1.1.3 | 2886 | version: 1.1.3 |
2898 | resolution: "color-support@npm:1.1.3" | 2887 | resolution: "color-support@npm:1.1.3" |
@@ -3528,16 +3517,16 @@ __metadata: | |||
3528 | languageName: node | 3517 | languageName: node |
3529 | linkType: hard | 3518 | linkType: hard |
3530 | 3519 | ||
3531 | "electron@npm:18.0.3": | 3520 | "electron@npm:^19.0.0-alpha.1": |
3532 | version: 18.0.3 | 3521 | version: 19.0.0-alpha.1 |
3533 | resolution: "electron@npm:18.0.3" | 3522 | resolution: "electron@npm:19.0.0-alpha.1" |
3534 | dependencies: | 3523 | dependencies: |
3535 | "@electron/get": ^1.13.0 | 3524 | "@electron/get": ^1.14.1 |
3536 | "@types/node": ^16.11.26 | 3525 | "@types/node": ^16.11.26 |
3537 | extract-zip: ^1.0.3 | 3526 | extract-zip: ^1.0.3 |
3538 | bin: | 3527 | bin: |
3539 | electron: cli.js | 3528 | electron: cli.js |
3540 | checksum: 3a3e21748d44c7e83719808b3a8494895c9f9ef76aed644fe792ec45d6009d3177077253ae88f9a22a0abb2add166ec8cd13435e1961d15516d00002441f7a1d | 3529 | checksum: 47cc4d9e34246e787421ca1dfa5a0b98c02f4d2882d6074d55a14492bff1a590c467e6c6d647a80eca27265bd7d5cc1b13876ee958525c2dc0daafe7e9cccb93 |
3541 | languageName: node | 3530 | languageName: node |
3542 | linkType: hard | 3531 | linkType: hard |
3543 | 3532 | ||
@@ -5236,13 +5225,6 @@ __metadata: | |||
5236 | languageName: node | 5225 | languageName: node |
5237 | linkType: hard | 5226 | linkType: hard |
5238 | 5227 | ||
5239 | "is-arrayish@npm:^0.3.1": | ||
5240 | version: 0.3.2 | ||
5241 | resolution: "is-arrayish@npm:0.3.2" | ||
5242 | checksum: 977e64f54d91c8f169b59afcd80ff19227e9f5c791fa28fa2e5bce355cbaf6c2c356711b734656e80c9dd4a854dd7efcf7894402f1031dfc5de5d620775b4d5f | ||
5243 | languageName: node | ||
5244 | linkType: hard | ||
5245 | |||
5246 | "is-bigint@npm:^1.0.1": | 5228 | "is-bigint@npm:^1.0.1": |
5247 | version: 1.0.4 | 5229 | version: 1.0.4 |
5248 | resolution: "is-bigint@npm:1.0.4" | 5230 | resolution: "is-bigint@npm:1.0.4" |
@@ -8142,15 +8124,6 @@ __metadata: | |||
8142 | languageName: node | 8124 | languageName: node |
8143 | linkType: hard | 8125 | linkType: hard |
8144 | 8126 | ||
8145 | "simple-swizzle@npm:^0.2.2": | ||
8146 | version: 0.2.2 | ||
8147 | resolution: "simple-swizzle@npm:0.2.2" | ||
8148 | dependencies: | ||
8149 | is-arrayish: ^0.3.1 | ||
8150 | checksum: a7f3f2ab5c76c4472d5c578df892e857323e452d9f392e1b5cf74b74db66e6294a1e1b8b390b519fa1b96b5b613f2a37db6cffef52c3f1f8f3c5ea64eb2d54c0 | ||
8151 | languageName: node | ||
8152 | linkType: hard | ||
8153 | |||
8154 | "sisteransi@npm:^1.0.5": | 8127 | "sisteransi@npm:^1.0.5": |
8155 | version: 1.0.5 | 8128 | version: 1.0.5 |
8156 | resolution: "sisteransi@npm:1.0.5" | 8129 | resolution: "sisteransi@npm:1.0.5" |
@@ -8242,7 +8215,7 @@ __metadata: | |||
8242 | "@vitejs/plugin-react": ^1.3.1 | 8215 | "@vitejs/plugin-react": ^1.3.1 |
8243 | chokidar: ^3.5.3 | 8216 | chokidar: ^3.5.3 |
8244 | cross-env: ^7.0.3 | 8217 | cross-env: ^7.0.3 |
8245 | electron: 18.0.3 | 8218 | electron: ^19.0.0-alpha.1 |
8246 | electron-builder: ^23.0.6 | 8219 | electron-builder: ^23.0.6 |
8247 | esbuild: ^0.14.36 | 8220 | esbuild: ^0.14.36 |
8248 | eslint: ^8.13.0 | 8221 | eslint: ^8.13.0 |