Make engine background color driven by theme setting (#1842)

* Bump ts lib

* Make engine background color driven by theme setting

* A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)

* Force snapshots to dark mode, fix theme init

* A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)

* Don't assume we have engineCommandManager in CameraControls,
because for some reason it's being loaded before engineConnection in test environments?

* Merge branch 'main' into change-bg-color

* Replace optional chaining with this.engineCommandManager

* A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)

* Okay now all snapshot tests are actually in dark mode

* A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)

* trigger ci

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Kurt Hutten Irev-Dev <k.hutten@protonmail.ch>

src/lib/theme.ts

@@ -6,7 +6,8 @@ export enum Themes {
 
 // Get the theme from the system settings manually
 export function getSystemTheme(): Exclude<Themes, 'system'> {
-  return typeof window !== 'undefined' && 'matchMedia' in window
+  return typeof globalThis.window !== 'undefined' &&
+    'matchMedia' in globalThis.window
     ? window.matchMedia('(prefers-color-scheme: dark)').matches
       ? Themes.Dark
       : Themes.Light
@@ -21,3 +22,12 @@ export function setThemeClass(theme: Themes) {
     document.body.classList.remove('dark')
   }
 }
+
+export function getThemeColorForEngine(theme: Themes) {
+  const resolvedTheme = theme === Themes.System ? getSystemTheme() : theme
+  const dark = 28 / 255
+  const light = 242 / 255
+  return resolvedTheme === Themes.Dark
+    ? { r: dark, g: dark, b: dark, a: 1 }
+    : { r: light, g: light, b: light, a: 1 }
+}