diff options
author | Kristóf Marussy <kristof@marussy.com> | 2021-12-24 02:01:31 +0100 |
---|---|---|
committer | Kristóf Marussy <kristof@marussy.com> | 2021-12-24 02:01:31 +0100 |
commit | ddbd710be5c9f5a3a84d9415791deec415ea3e9d (patch) | |
tree | 80f39e48de649cfbf1df8bcf0bdb46b12ee15979 | |
parent | feat: Service to main process communication (diff) | |
download | sophie-ddbd710be5c9f5a3a84d9415791deec415ea3e9d.tar.gz sophie-ddbd710be5c9f5a3a84d9415791deec415ea3e9d.tar.zst sophie-ddbd710be5c9f5a3a84d9415791deec415ea3e9d.zip |
feat: Alternative background color workaround
Let's try injecting CSS to set the background color of html to
white (instead of transparent) into the loaded pages. The CSS is
injected before the website's own styles load, so they should always
have the lowest priority.
-rw-r--r-- | packages/main/src/index.ts | 11 | ||||
-rw-r--r-- | packages/renderer/src/components/BrowserViewPlaceholder.tsx | 3 |
2 files changed, 11 insertions, 3 deletions
diff --git a/packages/main/src/index.ts b/packages/main/src/index.ts index 857c15d..617a8dd 100644 --- a/packages/main/src/index.ts +++ b/packages/main/src/index.ts | |||
@@ -155,6 +155,17 @@ async function createWindow(): Promise<void> { | |||
155 | } | 155 | } |
156 | }); | 156 | }); |
157 | 157 | ||
158 | // Inject CSS to simulate `browserView.setBackgroundColor`. | ||
159 | // This is injected before the page loads, so the styles from the website will overwrite it. | ||
160 | browserView.webContents.on('did-navigate', () => { | ||
161 | browserView.webContents.insertCSS( | ||
162 | 'html { background-color: #fff; }', | ||
163 | { | ||
164 | cssOrigin: 'author', | ||
165 | }, | ||
166 | ); | ||
167 | }); | ||
168 | |||
158 | autorun(() => { | 169 | autorun(() => { |
159 | browserView.setBounds(store.shared.browserViewBounds); | 170 | browserView.setBounds(store.shared.browserViewBounds); |
160 | }); | 171 | }); |
diff --git a/packages/renderer/src/components/BrowserViewPlaceholder.tsx b/packages/renderer/src/components/BrowserViewPlaceholder.tsx index 06dc7fe..0187fee 100644 --- a/packages/renderer/src/components/BrowserViewPlaceholder.tsx +++ b/packages/renderer/src/components/BrowserViewPlaceholder.tsx | |||
@@ -118,9 +118,6 @@ export const BrowserViewPlaceholder = observer(function BrowserViewPlaceholder() | |||
118 | <Box | 118 | <Box |
119 | sx={{ | 119 | sx={{ |
120 | flex: 1, | 120 | flex: 1, |
121 | // Workaround: display a plain white background if we fail to set the BrowserView background color. | ||
122 | // https://github.com/electron/electron/issues/31019 | ||
123 | background: '#fff', | ||
124 | }} | 121 | }} |
125 | ref={ref} | 122 | ref={ref} |
126 | /> | 123 | /> |