Fuck you Mozilla

browser/background.js

@@ -1,32 +0,0 @@
-/**
- * @template T
- * @param {T[]} arr
- * @param {(v: T) => boolean} predicate
- */
-function removeFirst(arr, predicate) {
-    const idx = arr.findIndex(predicate);
-    if (idx !== -1) arr.splice(idx, 1);
-}
-
-chrome.webRequest.onHeadersReceived.addListener(
-    ({ responseHeaders, type, url }) => {
-        if (!responseHeaders) return;
-
-        if (type === "main_frame") {
-            // In main frame requests, the CSP needs to be removed to enable fetching of custom css
-            // as desired by the user
-            removeFirst(responseHeaders, h => h.name.toLowerCase() === "content-security-policy");
-        } else if (type === "stylesheet" && url.startsWith("https://raw.githubusercontent.com/")) {
-            // Most users will load css from GitHub, but GitHub doesn't set the correct content type,
-            // so we fix it here
-            removeFirst(responseHeaders, h => h.name.toLowerCase() === "content-type");
-            responseHeaders.push({
-                name: "Content-Type",
-                value: "text/css"
-            });
-        }
-        return { responseHeaders };
-    },
-    { urls: ["https://raw.githubusercontent.com/*", "*://*.discord.com/*"], types: ["main_frame", "stylesheet"] },
-    ["blocking", "responseHeaders"]
-);

browser/manifestv2.json

@@ -26,11 +26,7 @@
         }
     ],
 
-    "background": {
+    "web_accessible_resources": ["dist/*", "third-party/*"],
-        "scripts": ["background.js"]
-    },
-
-    "web_accessible_resources": ["dist/Vencord.js", "dist/Vencord.css"],
 
     "browser_specific_settings": {
         "gecko": {

scripts/build/buildWeb.mjs

@@ -145,11 +145,11 @@ async function loadDir(dir, basePath = "") {
 /**
   * @type {(target: string, files: string[]) => Promise<void>}
  */
-async function buildExtension(target, files) {
+async function buildExtension(target, files, noMonaco = false) {
     const entries = {
         "dist/Vencord.js": await readFile("dist/extension.js"),
         "dist/Vencord.css": await readFile("dist/extension.css"),
-        ...await loadDir("dist/monaco"),
+        ...(noMonaco ? {} : await loadDir("dist/monaco")),
         ...Object.fromEntries(await Promise.all(RnNoiseFiles.map(async file =>
             [`third-party/rnnoise/${file.replace(/^dist\//, "")}`, await readFile(`node_modules/@sapphi-red/web-noise-suppressor/${file}`)]
         ))),
@@ -195,7 +195,7 @@ const appendCssRuntime = readFile("dist/Vencord.user.css", "utf-8").then(content
 await Promise.all([
     appendCssRuntime,
     buildExtension("chromium-unpacked", ["modifyResponseHeaders.json", "content.js", "manifest.json", "icon.png"]),
-    buildExtension("firefox-unpacked", ["background.js", "content.js", "manifestv2.json", "icon.png"]),
+    buildExtension("firefox-unpacked", ["content.js", "manifestv2.json", "icon.png"], true),
 ]);
 
 Zip.sync.zip("dist/chromium-unpacked").compress().save("dist/extension.zip");

src/components/VencordSettings/ThemesTab.tsx

@@ -18,8 +18,10 @@
 
 import { useSettings } from "@api/Settings";
 import { classNameFactory } from "@api/Styles";
+import { ErrorCard } from "@components/ErrorCard";
 import { Flex } from "@components/Flex";
 import { Link } from "@components/Link";
+import { IsFirefox } from "@utils/constants";
 import { Margins } from "@utils/margins";
 import { classes } from "@utils/misc";
 import { showItemInFolder } from "@utils/native";
@@ -249,12 +251,14 @@ function ThemesTab() {
                             >
                                 Load missing Themes
                             </Button>
+                            {!IsFirefox && (
                                 <Button
                                     onClick={() => VencordNative.quickCss.openEditor()}
                                     size={Button.Sizes.SMALL}
                                 >
                                     Edit QuickCSS
                                 </Button>
+                            )}
                         </>
                     </Card>
 
@@ -316,6 +320,15 @@ function ThemesTab() {
 
     return (
         <SettingsTab title="Themes">
+            {IsFirefox && (
+                <ErrorCard>
+                    <Forms.FormTitle tag="h5">Warning</Forms.FormTitle>
+                    <Forms.FormText>
+                        You are using Firefox. Expect the vast majority of themes to not work.
+                        If this is a problem, use a chromium browser or Discord Desktop / Vesktop.
+                    </Forms.FormText>
+                </ErrorCard>
+            )}
             <TabBar
                 type="top"
                 look="brand"

src/components/VencordSettings/VencordTab.tsx

@@ -21,6 +21,7 @@ import { Settings, useSettings } from "@api/Settings";
 import { classNameFactory } from "@api/Styles";
 import DonateButton from "@components/DonateButton";
 import { ErrorCard } from "@components/ErrorCard";
+import { IsFirefox } from "@utils/constants";
 import { Margins } from "@utils/margins";
 import { identity } from "@utils/misc";
 import { relaunch, showItemInFolder } from "@utils/native";
@@ -109,12 +110,14 @@ function VencordSettings() {
                                 Restart Client
                             </Button>
                         )}
+                        {!IsFirefox && (
                             <Button
                                 onClick={() => VencordNative.quickCss.openEditor()}
                                 size={Button.Sizes.SMALL}
                                 disabled={settingsDir === "Loading..."}>
                                 Open QuickCSS File
                             </Button>
+                        )}
                         {!IS_WEB && (
                             <Button
                                 onClick={() => showItemInFolder(settingsDir)}

src/plugins/_core/supportHelper.tsx

@@ -17,7 +17,7 @@
 */
 
 import { DataStore } from "@api/index";
-import { Devs, SUPPORT_CHANNEL_ID } from "@utils/constants";
+import { Devs, IsFirefox, SUPPORT_CHANNEL_ID } from "@utils/constants";
 import { isPluginDev } from "@utils/misc";
 import { makeCodeblock } from "@utils/text";
 import definePlugin from "@utils/types";
@@ -30,6 +30,7 @@ import plugins from "~plugins";
 import settings from "./settings";
 
 const REMEMBER_DISMISS_KEY = "Vencord-SupportHelper-Dismiss";
+const FIREFOX_DISMISS_KEY = "Vencord-Firefox-Warning-Dismiss";
 
 const AllowedChannelIds = [
     SUPPORT_CHANNEL_ID,
@@ -115,6 +116,22 @@ ${makeCodeblock(enabledPlugins.join(", ") + "\n\n" + enabledApiPlugins.join(", "
                     onConfirm: rememberDismiss
                 });
             }
+
+            if (IsFirefox) {
+                const rememberDismiss = () => DataStore.set(FIREFOX_DISMISS_KEY, true);
+
+                Alerts.show({
+                    title: "Hold on!",
+                    body: <div>
+                        <Forms.FormText>You are using Firefox.</Forms.FormText>
+                        <Forms.FormText>Due to Firefox's stupid extension guidelines, most themes and many plugins will not function correctly.</Forms.FormText>
+                        <Forms.FormText>Do not report bugs. Do not ask for help with broken plugins.</Forms.FormText>
+                        <Forms.FormText>Instead, use a chromium browser, Discord Desktop, or Vesktop.</Forms.FormText>
+                    </div>,
+                    onCancel: rememberDismiss,
+                    onConfirm: rememberDismiss
+                });
+            }
         }
     }
 });

src/utils/constants.ts

@@ -385,3 +385,5 @@ export const DevsById = /* #__PURE__*/ (() =>
             .map(([_, v]) => [v.id, v] as const)
     ))
 )() as Record<string, Dev>;
+
+export const IsFirefox = IS_EXTENSION && navigator.userAgent.toLowerCase().includes("firefox");