Add additional __STATIC_CONTENT_MANIFEST module for Workers Sites

Ref: cloudflare/wrangler-legacy#2126

Author: mrbbot

packages/core/src/index.ts

@@ -1,6 +1,7 @@
 import fs from "fs/promises";
 import path from "path";
 import {
+  AdditionalModules,
   BeforeSetupResult,
   Compatibility,
   Context,
@@ -411,6 +412,7 @@ export class MiniflareCore<
 
     let script: ScriptBlueprint | undefined = undefined;
     let requiresModuleExports = false;
+    const additionalModules: AdditionalModules = {};
     for (const [name] of this.#plugins) {
       // Run beforeReload hook
       const instance = this.#instances![name];
@@ -419,7 +421,7 @@ export class MiniflareCore<
         await instance.beforeReload();
       }
 
-      // Build global scope and extract script blueprints
+      // Build global scope, extracting script blueprints and additional modules
       const result = this.#setupResults!.get(name);
       Object.assign(globals, result?.globals);
       Object.assign(bindings, result?.bindings);
@@ -430,6 +432,9 @@ export class MiniflareCore<
         script = result.script;
       }
       if (result?.requiresModuleExports) requiresModuleExports = true;
+      if (result?.additionalModules) {
+        Object.assign(additionalModules, result.additionalModules);
+      }
 
       // Extract watch paths
       const beforeSetupWatch = this.#beforeSetupWatch!.get(name);
@@ -466,7 +471,12 @@ export class MiniflareCore<
       }
 
       this.log.verbose("Running script...");
-      res = await this.#scriptRunner.run(globalScope, script, rules);
+      res = await this.#scriptRunner.run(
+        globalScope,
+        script,
+        rules,
+        additionalModules
+      );
 
       this.#scriptWatchPaths.clear();
       this.#scriptWatchPaths.add(script.filePath);

packages/core/src/standards/event.ts

@@ -210,6 +210,13 @@ export class ServiceWorkerGlobalScope extends WorkerGlobalScope {
     if (modules) {
       // Error when trying to access bindings using the global in modules mode
       for (const key of Object.keys(bindings)) {
+        // @cloudflare/kv-asset-handler checks the typeof these keys which
+        // triggers an access. We want this typeof to return "undefined", not
+        // throw, so skip these specific keys.
+        if (key === "__STATIC_CONTENT" || key === "__STATIC_CONTENT_MANIFEST") {
+          break;
+        }
+
         Object.defineProperty(this, key, {
           get() {
             throw new ReferenceError(

packages/runner-vm/src/index.ts

@@ -1,5 +1,6 @@
 import vm from "vm";
 import {
+  AdditionalModules,
   Context,
   ProcessedModuleRule,
   ScriptBlueprint,
@@ -41,7 +42,8 @@ export class VMScriptRunner implements ScriptRunner {
   async run(
     globalScope: Context,
     blueprint: ScriptBlueprint,
-    modulesRules?: ProcessedModuleRule[]
+    modulesRules?: ProcessedModuleRule[],
+    additionalModules?: AdditionalModules
   ): Promise<ScriptRunnerResult> {
     // If we're using modules, make sure --experimental-vm-modules is enabled
     if (modulesRules && !("SourceTextModule" in vm)) {
@@ -51,7 +53,8 @@ export class VMScriptRunner implements ScriptRunner {
       );
     }
     // Also build a linker if we're using modules
-    const linker = modulesRules && new ModuleLinker(modulesRules);
+    const linker =
+      modulesRules && new ModuleLinker(modulesRules, additionalModules ?? {});
 
     // Add proxied globals so cross-realm instanceof works correctly.
     // globalScope will be fresh for each call of run so it's fine to mutate it.

packages/runner-vm/src/linker.ts

@@ -3,6 +3,7 @@ import fs from "fs/promises";
 import path from "path";
 import vm from "vm";
 import {
+  AdditionalModules,
   Context,
   ProcessedModuleRule,
   STRING_SCRIPT_PATH,
@@ -19,7 +20,10 @@ export class ModuleLinker {
   readonly #moduleCache = new Map<string, vm.Module>();
   readonly #cjsModuleCache = new Map<string, CommonJSModule>();
 
-  constructor(private moduleRules: ProcessedModuleRule[]) {
+  constructor(
+    private moduleRules: ProcessedModuleRule[],
+    private additionalModules: AdditionalModules
+  ) {
     this.linker = this.linker.bind(this);
   }
 
@@ -45,13 +49,35 @@ export class ModuleLinker {
       );
     }
 
-    // Get path to specified module relative to referencing module
-    const identifier = path.resolve(path.dirname(referencing.identifier), spec);
+    const additionalModule = this.additionalModules[spec];
+    const identifier = additionalModule
+      ? spec
+      : // Get path to specified module relative to referencing module
+        path.resolve(path.dirname(referencing.identifier), spec);
+
     // If we've already seen a module with the same identifier, return it, to
     // handle import cycles
     const cached = this.#moduleCache.get(identifier);
     if (cached) return cached;
 
+    const moduleOptions = { identifier, context: referencing.context };
+    let module: vm.Module;
+
+    // If this is an additional module, construct and return it immediately
+    if (additionalModule) {
+      module = new vm.SyntheticModule(
+        Object.keys(additionalModule),
+        function () {
+          for (const [key, value] of Object.entries(additionalModule)) {
+            this.setExport(key, value);
+          }
+        },
+        moduleOptions
+      );
+      this.#moduleCache.set(identifier, module);
+      return module;
+    }
+
     // Find first matching module rule ("ignore" requires relative paths)
     const relativeIdentifier = path.relative("", identifier);
     const rule = this.moduleRules.find((rule) =>
@@ -67,8 +93,6 @@ export class ModuleLinker {
     // Load module based on rule type
     const data = await fs.readFile(identifier);
     this.#referencedPathSizes.set(identifier, data.byteLength);
-    const moduleOptions = { identifier, context: referencing.context };
-    let module: vm.Module;
     switch (rule.type) {
       case "ESModule":
         module = new vm.SourceTextModule(data.toString("utf8"), moduleOptions);

packages/runner-vm/test/linker.spec.ts

@@ -124,6 +124,19 @@ test("ModuleLinker: throws error for unsupported module type via ES module", asy
     message: /PNG modules are unsupported$/,
   });
 });
+test("ModuleLinker: links additional module via ES module", async (t) => {
+  const callback = (defaultExport: string, namedExport: number) => {
+    t.is(defaultExport, "test");
+    t.is(namedExport, 42);
+  };
+  const additionalModules = { ADDITIONAL: { default: "test", n: 42 } };
+  await runner.run(
+    { callback },
+    { code: 'import s, { n } from "ADDITIONAL"; callback(s, n);', filePath },
+    processedModuleRules,
+    additionalModules
+  );
+});
 
 test("ModuleLinker: throws error when linking ESModule via CommonJS module", async (t) => {
   // Technically Workers "supports" this, in that it doesn't throw an error,

packages/shared/src/plugin.ts

@@ -8,6 +8,9 @@ import { WranglerConfig } from "./wrangler";
 
 export type Context = { [key: string | symbol]: any };
 
+// Maps module specifiers to module namespace
+export type AdditionalModules = { [key: string]: Context };
+
 export enum OptionType {
   NONE, // never
   BOOLEAN, // boolean
@@ -69,6 +72,7 @@ export interface SetupResult extends BeforeSetupResult {
   bindings?: Context;
   script?: ScriptBlueprint;
   requiresModuleExports?: boolean;
+  additionalModules?: AdditionalModules;
 }
 
 export abstract class Plugin<Options extends Context = never> {

packages/shared/src/runner.ts

@@ -1,5 +1,5 @@
 import { Matcher } from "./data";
-import { Context } from "./plugin";
+import { AdditionalModules, Context } from "./plugin";
 
 export type ModuleRuleType =
   | "ESModule"
@@ -37,6 +37,7 @@ export interface ScriptRunner {
   run(
     globalScope: Context,
     blueprint: ScriptBlueprint,
-    modulesRules?: ProcessedModuleRule[]
+    modulesRules?: ProcessedModuleRule[],
+    additionalModules?: AdditionalModules
   ): Promise<ScriptRunnerResult>;
 }

packages/sites/package.json

@@ -36,7 +36,8 @@
     "extends": "../../package.json"
   },
   "entryPoints": [
-    "test/fixtures/plugin.assetHandler.js"
+    "test/fixtures/plugin.assetHandler.js",
+    "test/fixtures/plugin.assetHandler.modules.js"
   ],
   "dependencies": {
     "@miniflare/kv": "2.0.0-next.3",

packages/sites/src/plugin.ts

@@ -71,10 +71,14 @@ export class SitesPlugin extends Plugin<SitesOptions> implements SitesOptions {
       // path as the file path and won't edge cache files
       __STATIC_CONTENT_MANIFEST: {},
     };
+    // Allow `import manifest from "__STATIC_CONTENT_MANIFEST"`
+    const additionalModules = {
+      __STATIC_CONTENT_MANIFEST: { default: "{}" },
+    };
 
     // Whilst FileStorage will always serve the latest files, we want to
     // force a reload when these files change for live reload.
-    return { bindings, watch: [this.sitePath] };
+    return { bindings, watch: [this.sitePath], additionalModules };
   }
 
   async setup(): Promise<SetupResult> {

packages/sites/test/fixtures/plugin.assetHandler.modules.js

@@ -0,0 +1,21 @@
+import { getAssetFromKV } from "@cloudflare/kv-asset-handler";
+// noinspection NpmUsedModulesInstalled
+import manifestJSON from "__STATIC_CONTENT_MANIFEST";
+const manifest = JSON.parse(manifestJSON);
+
+export default {
+  async fetch(request, env, ctx) {
+    return await getAssetFromKV(
+      {
+        request,
+        waitUntil(promise) {
+          return ctx.waitUntil(promise);
+        },
+      },
+      {
+        ASSET_NAMESPACE: env.__STATIC_CONTENT,
+        ASSET_MANIFEST: manifest,
+      }
+    );
+  },
+};