DarkTheme auto change when prefers color scheme change

src/js/DarkTheme.js

@@ -12,18 +12,28 @@ DarkTheme.isDarkThemeEnabled = function (val) {
     return val === 0 || val === 2 && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
 };
 
-DarkTheme.setConfig = function (result) {
+DarkTheme.apply = function() {
-    if (this.configEnabled != result) {
-        this.configEnabled = result;
-
     if (this.isDarkThemeEnabled(this.configEnabled)) {
         this.applyDark();
     } else {
         this.applyNormal();
     }
 
+    if (chrome.app.window !== undefined) {
         windowWatcherUtil.passValue(chrome.app.window.get("receiver_msp"), 'darkTheme', this.isDarkThemeEnabled(this.configEnabled));
+    }
+};
 
+DarkTheme.autoSet = function() {
+    if (this.configEnabled === 2) {
+        this.apply();
+    }
+};
+
+DarkTheme.setConfig = function (result) {
+    if (this.configEnabled != result) {
+        this.configEnabled = result;
+        this.apply();
     }
 };
 

src/js/main.js

@@ -501,6 +501,9 @@ function startProcess() {
             setDarkTheme(result.darkTheme);
         }
     });
+    window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", function() {
+        DarkTheme.autoSet();
+    });
 }
 
 function setDarkTheme(enabled) {