✨ Mock .matchMedia in global/window

CHANGES.md

@@ -81,6 +81,7 @@ A non exhaustive list of changes:
 - Copy to SVG from contextual menu [Github #838](https://github.com/penpot/penpot/issues/838)
 - Add styles for Inkeep Chat at workspace [Taiga #10708](https://tree.taiga.io/project/penpot/us/10708)
 - Add configuration for air gapped installations with Docker
+- Support system color scheme [Github #5030](https://github.com/penpot/penpot/issues/5030)
 
 ### :bug: Bugs fixed
 - Fix getCurrentUser for plugins api [Taiga #11057](https://tree.taiga.io/project/penpot/issue/11057)

frontend/src/app/util/globals.js

@@ -17,7 +17,7 @@
 
 goog.provide("app.util.globals");
 
-goog.scope(function() {
+goog.scope(function () {
   app.util.globals.global = goog.global;
 
   function createGlobalEventEmitter(k) {
@@ -25,22 +25,27 @@ goog.scope(function() {
      * may subscribe to them.
      */
     return {
-      addListener(...args) {
+      addListener(...args) {},
-      },
+      removeListener(...args) {},
-      removeListener(...args) {
+      addEventListener(...args) {},
-      },
+      removeEventListener(...args) {},
-      addEventListener(...args) {
+      dispatchEvent(...args) { return true; },
-      },
+    };
-      removeEventListener(...args) {
-      }
-    }
   }
 
-  app.util.globals.window = (function() {
+  app.util.globals.window = (function () {
     if (typeof goog.global.window !== "undefined") {
       return goog.global.window;
     } else {
-      return createGlobalEventEmitter();
+      const mockWindow = createGlobalEventEmitter();
+      mockWindow.matchMedia = function (query) {
+        const mediaObj = createGlobalEventEmitter();
+        mediaObj.matches = false;
+        mediaObj.media = query;
+        mediaObj.onchange = null;
+        return mediaObj;
+      };
+      return mockWindow;
     }
   })();