fix wasm loading in component build

src/matrix-rtc-sdk/index.ts

@@ -98,8 +98,15 @@ export async function initMatrixRtcSdk(
  * until needed. Asked for explicitly, rather than leaving the package to its
  * `import.meta.url` default, so that the dev server's dependency
  * pre-bundling, which rewrites module URLs, cannot lose track of it.
+ *
+ * `no-inline` because the library build would otherwise embed the wasm as a
+ * base64 `data:` URL: a megabyte in the JavaScript, and one a host's Content
+ * Security Policy may well refuse to `fetch` (Element Web's does). As a file
+ * next to the bundle, referenced through `import.meta.url`, the host's own
+ * bundler copies it along with everything else.
  */
 async function bundledWasm(): Promise<string> {
-  const { default: url } = await import("@element-hq/matrix-rtc/wasm?url");
+  const { default: url } =
+    await import("@element-hq/matrix-rtc/wasm?url&no-inline");
   return url;
 }

vite-component.config.ts

@@ -37,6 +37,11 @@ export default defineConfig(({ mode }) => {
     // A host's document is not ours to style: everything in the stylesheet is
     // confined to the element Element Call is mounted in
     css: { postcss: { plugins: [scopeStylesToRoot()] } },
+    // A library does not know where its host will serve it from, so the few
+    // assets that are not inlined (the MatrixRTC wasm) are addressed relative
+    // to the bundle, through `import.meta.url`, which a host's bundler follows.
+    // With the default `/` they would be absolute paths on the host's origin.
+    base: "./",
     build: {
       // Into the package directory, so that `component/package.json` describes
       // what sits next to it and the directory can be installed as a package