refactor: polyfills review

package.json

@@ -35,7 +35,6 @@
     "dayjs": "1.11.5",
     "i18next": "^23.11.3",
     "lodash-es": "^4.17.21",
-    "matchmedia-polyfill": "^0.3.2",
     "meta-json-schema": "1.18.5-alpha",
     "monaco-editor": "^0.49.0",
     "monaco-yaml": "^5.1.1",

pnpm-lock.yaml

@@ -58,9 +58,6 @@ importers:
       lodash-es:
         specifier: ^4.17.21
         version: 4.17.21
-      matchmedia-polyfill:
-        specifier: ^0.3.2
-        version: 0.3.2
       meta-json-schema:
         specifier: 1.18.5-alpha
         version: 1.18.5-alpha
@@ -3224,12 +3221,6 @@ packages:
         integrity: sha512-iIRwTIf0QKV3UAnYK4PU8uiEc4SRh5jX0mwpIwETPpHdhVM4f53RSwS/vXvN1JhGX+Cs7B8qIq3d6AH49O5fAQ==,
       }
 
-  matchmedia-polyfill@0.3.2:
-    resolution:
-      {
-        integrity: sha512-B2zRzjqxZFUusBZrZux59XFFLoTN99SbGranxIHfjZVLGZuy8Iaf/s5iNR3qJwRQZBjBKsU6qBSUCltLV82gdw==,
-      }
-
   mdast-util-from-markdown@2.0.1:
     resolution:
       {
@@ -6432,8 +6423,6 @@ snapshots:
     dependencies:
       "@jridgewell/sourcemap-codec": 1.4.15
 
-  matchmedia-polyfill@0.3.2: {}
-
   mdast-util-from-markdown@2.0.1:
     dependencies:
       "@types/mdast": 4.0.4

src/polyfills/RegExp.js

@@ -1,50 +1,30 @@
-(function (global) {
-  if (typeof global === "object" && global) {
-    if (typeof global.RegExp !== "undefined") {
-      const OriginalRegExp = global.RegExp;
-      const CustomRegExp = function (pattern, flags) {
-        if (typeof pattern === "string" && typeof flags === "string") {
-          flags = flags;
-        } else if (pattern instanceof OriginalRegExp && flags === undefined) {
-          flags = pattern.flags;
-        }
-
-        if (flags) {
-          if (!global.RegExp.prototype.hasOwnProperty("unicodeSets")) {
-            if (flags.includes("v")) {
-              flags = flags.replace("v", "u");
-            }
-          }
-
-          if (!global.RegExp.prototype.hasOwnProperty("hasIndices")) {
-            if (flags.includes("d")) {
-              flags = flags.replace("d", "");
-            }
-          }
-        }
-
-        return new OriginalRegExp(pattern, flags);
-      };
-
-      CustomRegExp.prototype = OriginalRegExp.prototype;
-
-      global.RegExp = CustomRegExp;
-    }
+(function () {
+  if (typeof window.RegExp === "undefined") {
+    return;
   }
-})(
-  (function () {
-    switch (true) {
-      case typeof globalThis === "object" && !!globalThis:
-        return globalThis;
-      case typeof self === "object" && !!self:
-        return self;
-      case typeof window === "object" && !!window:
-        return window;
-      case typeof global === "object" && !!global:
-        return global;
-      case typeof Function === "function":
-        return Function("return this")();
+
+  const originalRegExp = window.RegExp;
+
+  window.RegExp = function (pattern, flags) {
+    if (pattern instanceof originalRegExp && flags === undefined) {
+      flags = pattern.flags;
     }
-    return null;
-  })()
-);
+
+    if (flags) {
+      if (!originalRegExp.prototype.hasOwnProperty("unicodeSets")) {
+        if (flags.includes("v")) {
+          flags = flags.replace("v", "u");
+        }
+      }
+
+      if (!originalRegExp.prototype.hasOwnProperty("hasIndices")) {
+        if (flags.includes("d")) {
+          flags = flags.replace("d", "");
+        }
+      }
+    }
+
+    return new originalRegExp(pattern, flags);
+  };
+  window.RegExp.prototype = originalRegExp.prototype;
+})();

src/polyfills/WeakRef.js

@@ -1,33 +1,16 @@
-(function (global) {
-  if (typeof global === "object" && global) {
-    if (typeof global["WeakRef"] === "undefined") {
-      global.WeakRef = (function (wm) {
-        function WeakRef(target) {
-          wm.set(this, target);
-        }
-
-        WeakRef.prototype.deref = function () {
-          return wm.get(this);
-        };
-
-        return WeakRef;
-      })(new WeakMap());
-    }
+(function () {
+  if (typeof window.WeakRef !== "undefined") {
+    return;
   }
-})(
-  (function () {
-    switch (true) {
-      case typeof globalThis === "object" && !!globalThis:
-        return globalThis;
-      case typeof self === "object" && !!self:
-        return self;
-      case typeof window === "object" && !!window:
-        return window;
-      case typeof global === "object" && !!global:
-        return global;
-      case typeof Function === "function":
-        return Function("return this")();
+
+  window.WeakRef = (function (weakMap) {
+    function WeakRef(target) {
+      weakMap.set(this, target);
     }
-    return null;
-  })()
-);
+    WeakRef.prototype.deref = function () {
+      return weakMap.get(this);
+    };
+
+    return WeakRef;
+  })(new WeakMap());
+})();

src/polyfills/matchMedia.js

@@ -0,0 +1,36 @@
+(function () {
+  if (window.matchMedia && window.matchMedia("all").addEventListener) {
+    return;
+  }
+
+  const originalMatchMedia = window.matchMedia;
+
+  window.matchMedia = function (query) {
+    const mediaQueryList = originalMatchMedia(query);
+
+    if (!mediaQueryList.addEventListener) {
+      mediaQueryList.addEventListener = function (eventType, listener) {
+        if (eventType !== "change" || typeof listener !== "function") {
+          console.error("Invalid arguments for addEventListener:", arguments);
+          return;
+        }
+        mediaQueryList.addListener(listener);
+      };
+    }
+
+    if (!mediaQueryList.removeEventListener) {
+      mediaQueryList.removeEventListener = function (eventType, listener) {
+        if (eventType !== "change" || typeof listener !== "function") {
+          console.error(
+            "Invalid arguments for removeEventListener:",
+            arguments
+          );
+          return;
+        }
+        mediaQueryList.removeListener(listener);
+      };
+    }
+
+    return mediaQueryList;
+  };
+})();

vite.config.ts

@@ -16,8 +16,7 @@ export default defineConfig({
       modernPolyfills: true,
       polyfills: ["web.structured-clone"],
       additionalModernPolyfills: [
-        "matchmedia-polyfill",
-        "matchmedia-polyfill/matchMedia.addListener",
+        path.resolve("./src/polyfills/matchMedia.js"),
         path.resolve("./src/polyfills/WeakRef.js"),
         path.resolve("./src/polyfills/RegExp.js"),
       ],