fix(service-preload): Browser view canvas background

Due to `BrowserView.setBackgroundColor` not working under linux, we have
to inject styles to make sure our `BrowserView` is opaque.

We try to cover more edge cases to avoid the interference of the
injected style and the web site's own styles according to the CSS
specification:

https://www.w3.org/TR/css-backgrounds-3/#body-background

In particular, we avoid overwriting the styles for the `html` element
if `body` already has an opaque background so that the background of
`body` can extend to the whole canvas.

This might still interfere with the web site if it updates the
background color on the fly (dark mode), but a reload should solve
most of such issues.

Hopefully, after

https://github.com/electron/electron/issues/32898

is resolved, we can get rid of the hack entirely.

Signed-off-by: Kristóf Marussy <kristof@marussy.com>

1 files changed, 4 insertions, 0 deletions

diff --git a/packages/service-preload/package.json b/packages/service-preload/package.json
index 1cfa74c..2090cf9 100644
--- a/packages/service-preload/package.json
+++ b/packages/service-preload/package.json
@@ -9,6 +9,10 @@
   },
   "dependencies": {
     "@sophie/service-shared": "workspace:*",
+    "color-string": "^1.9.0",
     "electron": "17.1.0"
+  },
+  "devDependencies": {
+    "@types/color-string": "^1"
   }
 }