wrangler 0.0.0-e3cab74 → 0.0.0-e452a35

package/src/logger.ts

@@ -0,0 +1,66 @@
+import { format } from "node:util";
+import { formatMessagesSync } from "esbuild";
+
+const LOGGER_LEVELS = {
+  error: 0,
+  warn: 1,
+  log: 2,
+  debug: 3,
+} as const;
+
+type LoggerLevel = keyof typeof LOGGER_LEVELS;
+
+/** A map from LOGGER_LEVEL to the error `kind` needed by `formatMessagesSync()`. */
+const LOGGER_LEVEL_FORMAT_TYPE_MAP = {
+  error: "error",
+  warn: "warning",
+  log: undefined,
+  debug: undefined,
+} as const;
+
+class Logger {
+  constructor(public loggerLevel: LoggerLevel = "log") {}
+
+  columns = process.stdout.columns;
+
+  debug = (...args: unknown[]) => this.doLog("debug", args);
+  log = (...args: unknown[]) => this.doLog("log", args);
+  warn = (...args: unknown[]) => this.doLog("warn", args);
+  error = (...args: unknown[]) => this.doLog("error", args);
+
+  private doLog(messageLevel: LoggerLevel, args: unknown[]) {
+    if (LOGGER_LEVELS[this.loggerLevel] >= LOGGER_LEVELS[messageLevel]) {
+      console[messageLevel](this.formatMessage(messageLevel, format(...args)));
+    }
+  }
+
+  private formatMessage(level: LoggerLevel, message: string): string {
+    const kind = LOGGER_LEVEL_FORMAT_TYPE_MAP[level];
+    if (kind) {
+      // Format the message using the esbuild formatter.
+      // The first line of the message is the main `text`,
+      // subsequent lines are put into the `notes`.
+      const [firstLine, ...otherLines] = message.split("\n");
+      const notes =
+        otherLines.length > 0
+          ? otherLines.map((text) => ({ text }))
+          : undefined;
+      return formatMessagesSync([{ text: firstLine, notes }], {
+        color: true,
+        kind,
+        terminalWidth: this.columns,
+      })[0];
+    } else {
+      return message;
+    }
+  }
+}
+
+/**
+ * A drop-in replacement for `console` for outputting logging messages.
+ *
+ * Errors and Warnings will get additional formatting to highlight them to the user.
+ * You can also set a `logger.loggerLevel` value to one of "debug", "log", "warn" or "error",
+ * to filter out logging messages.
+ */
+export const logger = new Logger();

package/src/miniflare-cli/README.md

@@ -0,0 +1,30 @@
+# Custom Miniflare CLI
+
+This directory contains a simple wrapper around the programmatic Miniflare API,
+which Wrangler spawns when running `wrangler dev` in local mode.
+
+## Building
+
+This CLI is built at the same time as Wrangler by running
+
+```
+npm run -w wrangler build
+```
+
+The output of the build is `miniflare-dist/index.mjs`.
+
+## Running
+
+The CLI expects a single command line argument which is the Miniflare options formatted as a string of JSON.
+
+```bash
+node --no-warnings ./packages/wrangler/miniflare-dist/index.mjs '{"watch": true, "script": ""}' --log VERBOSE
+```
+
+The `--log` argument is optional and takes one of Miniflare's LogLevels: "NONE", "ERROR", "WARN", "INFO", "DEBUG", "VERBOSE".
+It defaults to `INFO`.
+
+## Debugging
+
+Simply place a breakpoint in the code and run the above command in the VS Code "JavaScript Debug Terminal".
+The code will stop at the breakpoint as expected.

package/src/miniflare-cli/enum-keys.ts

@@ -0,0 +1,17 @@
+export type EnumKeys<Enum> = Exclude<keyof Enum, number>;
+
+export const enumObject = <Enum extends Record<string, number | string>>(
+  e: Enum
+) => {
+  const copy = { ...e } as { [K in EnumKeys<Enum>]: Enum[K] };
+  Object.values(e).forEach(
+    (value) => typeof value === "number" && delete copy[value]
+  );
+  return copy;
+};
+
+export const enumKeys = <Enum extends Record<string, number | string>>(
+  e: Enum
+) => {
+  return Object.keys(enumObject(e)) as EnumKeys<Enum>[];
+};

package/src/miniflare-cli/index.ts

@@ -0,0 +1,41 @@
+import { Log, LogLevel, Miniflare } from "miniflare";
+import yargs from "yargs";
+import { hideBin } from "yargs/helpers";
+import { enumKeys } from "./enum-keys";
+import { getRequestContextCheckOptions } from "./request-context";
+
+async function main() {
+  const args = await yargs(hideBin(process.argv))
+    .help(false)
+    .version(false)
+    .option("log", {
+      choices: enumKeys(LogLevel),
+    }).argv;
+
+  const logLevel = LogLevel[args.log ?? "INFO"];
+  const requestContextCheckOptions = await getRequestContextCheckOptions();
+  const config = {
+    ...JSON.parse((args._[0] as string) ?? "{}"),
+    ...requestContextCheckOptions,
+    log: new Log(logLevel),
+  };
+
+  if (logLevel > LogLevel.INFO) {
+    console.log("OPTIONS:\n", JSON.stringify(config, null, 2));
+  }
+
+  const mf = new Miniflare(config);
+
+  try {
+    // Start Miniflare development server
+    await mf.startServer();
+    await mf.startScheduler();
+  } catch (e) {
+    mf.log.error(e as Error);
+    process.exitCode = 1;
+    // Unmount any mounted workers
+    await mf.dispose();
+  }
+}
+
+await main();

package/src/miniflare-cli/request-context.ts

@@ -0,0 +1,40 @@
+import type { MiniflareOptions } from "miniflare";
+
+/**
+ * Certain runtime APIs are only available to workers during the "request context",
+ * which is any code that returns after receiving a request and before returning
+ * a response.
+ *
+ * Miniflare emulates this behavior by using an [`AsyncLocalStorage`](https://nodejs.org/api/async_context.html#class-asynclocalstorage) and
+ * [checking at runtime](https://github.com/cloudflare/miniflare/blob/master/packages/shared/src/context.ts#L21-L36)
+ * to see if you're using those APIs during the request context.
+ *
+ * In certain environments `AsyncLocalStorage` is unavailable, such as in a
+ * [webcontainer](https://github.com/stackblitz/webcontainer-core).
+ * This function figures out if we're able to run those "request context" checks
+ * and returns [a set of options](https://miniflare.dev/core/standards#global-functionality-limits)
+ * that indicate to miniflare whether to run the checks or not.
+ */
+export const getRequestContextCheckOptions = async (): Promise<
+  Pick<MiniflareOptions, "globalAsyncIO" | "globalTimers" | "globalRandom">
+> => {
+  // check that there's an implementation of AsyncLocalStorage
+  let hasAsyncLocalStorage = true;
+  try {
+    // ripped from  the example here https://nodejs.org/api/async_context.html#class-asynclocalstorage
+    const { AsyncLocalStorage } = await import("node:async_hooks");
+    const storage = new AsyncLocalStorage<string>();
+
+    hasAsyncLocalStorage = storage.run("some-value", () => {
+      return storage.getStore() === "some-value";
+    });
+  } catch (e) {
+    hasAsyncLocalStorage = false;
+  }
+
+  return {
+    globalAsyncIO: hasAsyncLocalStorage,
+    globalRandom: hasAsyncLocalStorage,
+    globalTimers: hasAsyncLocalStorage,
+  };
+};

package/src/module-collection.ts

@@ -2,8 +2,9 @@ import crypto from "node:crypto";
 import { readFile } from "node:fs/promises";
 import path from "node:path";
 import globToRegExp from "glob-to-regexp";
-import type { CfModule, CfModuleType, CfScriptFormat } from "./api/worker";
+import { logger } from "./logger";
 import type { Config, ConfigModuleRuleType } from "./config";
+import type { CfModule, CfModuleType, CfScriptFormat } from "./worker";
 import type esbuild from "esbuild";
 
 const RuleTypeToModuleType: Record<ConfigModuleRuleType, CfModuleType> = {
@@ -28,9 +29,15 @@ export const DEFAULT_MODULE_RULES: Config["rules"] = [
   { type: "CompiledWasm", globs: ["**/*.wasm"] },
 ];
 
-export default function makeModuleCollector(props: {
+export default function createModuleCollector(props: {
   format: CfScriptFormat;
   rules?: Config["rules"];
+  // a collection of "legacy" style module references, which are just file names
+  // we will eventually deprecate this functionality, hence the verbose greppable name
+  wrangler1xlegacyModuleReferences: {
+    rootDirectory: string;
+    fileNames: Set<string>;
+  };
 }): {
   modules: CfModule[];
   plugin: esbuild.Plugin;
@@ -41,6 +48,10 @@ export default function makeModuleCollector(props: {
     ...DEFAULT_MODULE_RULES!,
   ];
 
+  // First, we want to add some validations to the module rules
+  // We want to warn if rules are accidentally configured in such a way that
+  // subsequent rules will never match because `fallthrough` hasn't been set
+
   const completedRuleLocations: Record<string, number> = {};
   let index = 0;
   const rulesToRemove: Config["rules"] = [];
@@ -48,7 +59,7 @@ export default function makeModuleCollector(props: {
     if (rule.type in completedRuleLocations) {
       if (rules[completedRuleLocations[rule.type]].fallthrough !== false) {
         if (index < (props.rules || []).length) {
-          console.warn(
+          logger.warn(
             `The module rule at position ${index} (${JSON.stringify(
               rule
             )}) has the same type as a previous rule (at position ${
@@ -58,7 +69,7 @@ export default function makeModuleCollector(props: {
             )}). This rule will be ignored. To the previous rule, add \`fallthrough = true\` to allow this one to also be used, or \`fallthrough = false\` to silence this warning.`
           );
         } else {
-          console.warn(
+          logger.warn(
             `The default module rule ${JSON.stringify(
               rule
             )} has the same type as a previous rule (at position ${
@@ -92,6 +103,84 @@ export default function makeModuleCollector(props: {
           modules.splice(0);
         });
 
+        // ~ start legacy module specifier support ~
+
+        // This section detects usage of "legacy" 1.x style module specifiers
+        // and modifies them so they "work" in wrangler v2, but with a warning
+
+        const rulesMatchers = rules.flatMap((rule) => {
+          return rule.globs.map((glob) => {
+            const regex = globToRegExp(glob);
+            return {
+              regex,
+              rule,
+            };
+          });
+        });
+
+        if (props.wrangler1xlegacyModuleReferences.fileNames.size > 0) {
+          build.onResolve(
+            {
+              filter: new RegExp(
+                "^(" +
+                  [...props.wrangler1xlegacyModuleReferences.fileNames].join(
+                    "|"
+                  ) +
+                  ")$"
+              ),
+            },
+            async (args: esbuild.OnResolveArgs) => {
+              if (
+                args.kind !== "import-statement" &&
+                args.kind !== "require-call"
+              ) {
+                return;
+              }
+              // In the future, this will simply throw an error
+              logger.warn(
+                `Deprecation: detected a legacy module import in "./${path.relative(
+                  process.cwd(),
+                  args.importer
+                )}". This will stop working in the future. Replace references to "${
+                  args.path
+                }" with "./${args.path}";`
+              );
+
+              // take the file and massage it to a
+              // transportable/manageable format
+              const filePath = path.join(
+                props.wrangler1xlegacyModuleReferences.rootDirectory,
+                args.path
+              );
+              const fileContent = await readFile(filePath);
+              const fileHash = crypto
+                .createHash("sha1")
+                .update(fileContent)
+                .digest("hex");
+              const fileName = `./${fileHash}-${path.basename(args.path)}`;
+
+              const { rule } =
+                rulesMatchers.find(({ regex }) => regex.test(fileName)) || {};
+              if (rule) {
+                // add the module to the array
+                modules.push({
+                  name: fileName,
+                  content: fileContent,
+                  type: RuleTypeToModuleType[rule.type],
+                });
+                return {
+                  path: fileName, // change the reference to the changed module
+                  external: props.format === "modules", // mark it as external in the bundle
+                  namespace: `wrangler-module-${rule.type}`, // just a tag, this isn't strictly necessary
+                  watchFiles: [filePath], // we also add the file to esbuild's watch list
+                };
+              }
+            }
+          );
+        }
+
+        // ~ end legacy module specifier support ~
+
         rules?.forEach((rule) => {
           if (rule.type === "ESModule" || rule.type === "CommonJS") return; // TODO: we should treat these as js files, and use the jsx loader
 
@@ -133,10 +222,9 @@ export default function makeModuleCollector(props: {
                   return {
                     // We replace the the module with an identifier
                     // that we'll separately add to the form upload
-                    // as part of [wasm_modules]/[text_blobs]. This identifier has to be a valid
+                    // as part of [wasm_modules]/[text_blobs]/[data_blobs]. This identifier has to be a valid
                     // JS identifier, so we replace all non alphanumeric characters
                     // with an underscore.
-                    // TODO: what of "Data"?
                     contents: `export default ${args.path.replace(
                       /[^a-zA-Z0-9_$]/g,
                       "_"

package/src/open-in-browser.ts

@@ -1,13 +1,19 @@
 import open from "open";
+import { logger } from "./logger";
+
 /**
  * An extremely simple wrapper around the open command.
  * Specifically, it adds an 'error' event handler so that when this function
- * is called in environments where we can't open the browser (e.g. github codespaces,
- * stackblitz, remote servers), it doesn't just crash the process.
+ * is called in environments where we can't open the browser (e.g. GitHub Codespaces,
+ * StackBlitz, remote servers), it doesn't just crash the process.
+ *
+ * @param url the URL to point the browser at
  */
 export default async function openInBrowser(url: string): Promise<void> {
+  const errorMessage = `Failed to open ${url} in a browser`;
+
   const childProcess = await open(url);
   childProcess.on("error", () => {
-    console.warn(`Failed to open ${url} in a browser`);
+    logger.warn(errorMessage);
   });
 }

package/src/package-manager.ts

@@ -1,6 +1,7 @@
 import { existsSync } from "node:fs";
 import { join } from "node:path";
 import { execa, execaCommandSync } from "execa";
+import { logger } from "./logger";
 
 export interface PackageManager {
   cwd: string;
@@ -16,26 +17,26 @@ export async function getPackageManager(cwd: string): Promise<PackageManager> {
 
   if (hasNpmLock) {
     if (hasNpm) {
-      console.log(
+      logger.log(
         "Using npm as package manager, as there is already a package-lock.json file."
       );
       return { ...NpmPackageManager, cwd };
     } else if (hasYarn) {
-      console.log("Using yarn as package manager.");
-      console.warn(
+      logger.log("Using yarn as package manager.");
+      logger.warn(
         "There is already a package-lock.json file but could not find npm on the PATH."
       );
       return { ...YarnPackageManager, cwd };
     }
   } else if (hasYarnLock) {
     if (hasYarn) {
-      console.log(
+      logger.log(
         "Using yarn as package manager, as there is already a yarn.lock file."
       );
       return { ...YarnPackageManager, cwd };
     } else if (hasNpm) {
-      console.log("Using npm as package manager.");
-      console.warn(
+      logger.log("Using npm as package manager.");
+      logger.warn(
         "There is already a yarn.lock file but could not find yarn on the PATH."
       );
       return { ...NpmPackageManager, cwd };
@@ -43,10 +44,10 @@ export async function getPackageManager(cwd: string): Promise<PackageManager> {
   }
 
   if (hasNpm) {
-    console.log("Using npm as package manager.");
+    logger.log("Using npm as package manager.");
     return { ...NpmPackageManager, cwd };
   } else if (hasYarn) {
-    console.log("Using yarn as package manager.");
+    logger.log("Using yarn as package manager.");
     return { ...YarnPackageManager, cwd };
   } else {
     throw new Error(