From 1969c27e06dedf196d25d68ebfc0095581ccbd9f Mon Sep 17 00:00:00 2001
From: fkwp <github-fkwp@w4ve.de>
Date: Thu, 24 Sep 2026 12:24:00 +0200
Subject: [PATCH] Let background effects run under the dev server

- nodePolyfills rewrites any module that mentions process, and MediaPipe's
  WASM loader does. The loader is a classic script that sets
  self.ModuleFactory; as a module it sets nothing, so under pnpm dev the
  segmenter failed with "ModuleFactory not set". Blur on main fails the
  same way there. Production is unaffected: the loader ships as a static
  asset.
- The plugin's transform now skips that loader. Checked with main's own
  BlurBackgroundTransformer: it initialises with this and fails without.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
---
 vite.config.ts | 44 ++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 40 insertions(+), 4 deletions(-)

diff --git a/vite.config.ts b/vite.config.ts
index 678a86fab..2abba3dca 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -42,10 +42,12 @@ export const vitePluginsConfig = ({
     }),
     react(),
     wasm(),
-    nodePolyfills({
-      // Enables the 'events' module, which is required by the matrix-js-sdk
-      include: ["events"],
-    }),
+    exceptMediaPipeWasm(
+      nodePolyfills({
+        // Enables the 'events' module, which is required by the matrix-js-sdk
+        include: ["events"],
+      }),
+    ),
     svgrPlugin({
       svgrOptions: {
         // This enables ref forwarding on SVGR components, which is needed, for
@@ -176,3 +178,37 @@ export default ({
     },
   };
 };
+
+/**
+ * Keeps a plugin's transform off MediaPipe's WASM loader. The loader is a
+ * classic script that sets `self.ModuleFactory`; transformed into a module it
+ * sets nothing, and the segmenter fails with "ModuleFactory not set".
+ */
+function exceptMediaPipeWasm(plugins: PluginOption): PluginOption {
+  const isLoader = (id: string): boolean =>
+    id.includes("tasks-vision") && id.includes("wasm");
+  return (Array.isArray(plugins) ? plugins : [plugins]).map((plugin) => {
+    if (
+      !plugin ||
+      typeof plugin !== "object" ||
+      !("transform" in plugin) ||
+      typeof plugin.transform !== "function"
+    )
+      return plugin;
+    const transform = plugin.transform;
+    return {
+      ...plugin,
+      transform(this: unknown, code: string, id: string, options: unknown) {
+        if (isLoader(id)) return null;
+        return (
+          transform as (
+            this: unknown,
+            c: string,
+            i: string,
+            o: unknown,
+          ) => unknown
+        ).call(this, code, id, options);
+      },
+    } as PluginOption;
+  });
+}