wrangler 0.0.0-cf88928 → 0.0.0-d12d8d1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wrangler",
-  "version": "0.0.0-cf88928",
+  "version": "0.0.0-d12d8d1",
   "author": "wrangler@cloudflare.com",
   "description": "Command-line interface for all things Cloudflare Workers",
   "bin": {
@@ -45,24 +45,30 @@
     "fsevents": "~2.3.2"
   },
   "devDependencies": {
+    "@babel/types": "^7.16.0",
     "@iarna/toml": "^2.2.5",
+    "@types/mime": "^2.0.3",
+    "@types/estree": "^0.0.50",
     "@types/react": "^17.0.37",
+    "@types/serve-static": "^1.13.10",
     "@types/signal-exit": "^3.0.1",
     "@types/ws": "^8.2.1",
     "@types/yargs": "^17.0.7",
     "acorn": "^8.6.0",
+    "acorn-walk": "^8.2.0",
     "chokidar": "^3.5.2",
     "clipboardy": "^3.0.0",
     "command-exists": "^1.2.9",
     "execa": "^6.0.0",
+    "faye-websocket": "^0.11.4",
     "finalhandler": "^1.1.2",
     "find-up": "^6.2.0",
     "formdata-node": "^4.3.1",
-    "http-proxy": "^1.18.1",
     "ink": "^3.2.0",
     "ink-select-input": "^4.2.1",
     "ink-table": "^3.0.0",
     "ink-text-input": "^4.0.2",
+    "mime": "^3.0.0",
     "node-fetch": "^3.1.0",
     "open": "^8.4.0",
     "react": "^17.0.2",
@@ -77,7 +83,7 @@
   "files": [
     "src",
     "bin",
-    "lib",
+    "pages",
     "miniflare-config-stubs",
     "wrangler-dist",
     "static-asset-facade.js",

package/{lib → pages}/functions/buildWorker.ts

@@ -1,12 +1,19 @@
 import path from "path";
 import { build } from "esbuild";
 import { fileURLToPath } from "url";
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+let sanitizedDirname;
+try {
+  sanitizedDirname = path.dirname(fileURLToPath(import.meta.url));
+} catch {
+  sanitizedDirname = __dirname;
+}
 
 type Options = {
   routesModule: string;
   outfile: string;
   minify?: boolean;
+  sourcemap?: boolean;
   watch?: boolean;
 };
 
@@ -14,12 +21,13 @@ export function buildWorker({
   routesModule,
   outfile = "bundle.js",
   minify = false,
+  sourcemap = false,
   watch = false,
 }: Options) {
   console.log(`Compiling worker to "${outfile}"`);
   return build({
     entryPoints: [
-      path.resolve(__dirname, "../lib/functions/template-worker.ts"),
+      path.resolve(sanitizedDirname, "../pages/functions/template-worker.ts"),
     ],
     inject: [routesModule],
     bundle: true,
@@ -27,6 +35,7 @@ export function buildWorker({
     target: "esnext",
     outfile,
     minify,
+    sourcemap,
     watch,
     allowOverwrite: true,
   });

package/pages/functions/filepath-routing.test.ts

@@ -0,0 +1,32 @@
+import { compareRoutes } from "./filepath-routing";
+
+describe("compareRoutes()", () => {
+  test("routes with fewer segments come after those with more segments", () => {
+    expect(compareRoutes("/foo", "/foo/bar")).toBe(1);
+  });
+
+  test("routes with wildcard segments come after those without", () => {
+    expect(compareRoutes("/:foo*", "/foo")).toBe(1);
+    expect(compareRoutes("/:foo*", "/:foo")).toBe(1);
+  });
+
+  test("routes with dynamic segments come after those without", () => {
+    expect(compareRoutes("/:foo", "/foo")).toBe(1);
+  });
+
+  test("routes with dynamic segments occuring earlier come after those with dynamic segments in later positions", () => {
+    expect(compareRoutes("/foo/:id/bar", "/foo/bar/:id")).toBe(1);
+  });
+
+  test("routes with no HTTP method come after those specifying a method", () => {
+    expect(compareRoutes("/foo", "GET /foo")).toBe(1);
+  });
+
+  test("two equal routes are sorted according to their original position in the list", () => {
+    expect(compareRoutes("GET /foo", "GET /foo")).toBe(0);
+  });
+
+  test("it returns -1 if the first argument should appear first in the list", () => {
+    expect(compareRoutes("GET /foo", "/foo")).toBe(-1);
+  });
+});

package/pages/functions/filepath-routing.ts

@@ -0,0 +1,223 @@
+import path from "path";
+import fs from "fs/promises";
+import { transform } from "esbuild";
+import * as acorn from "acorn";
+import * as acornWalk from "acorn-walk";
+import type { Config } from "./routes";
+import type { Identifier } from "estree";
+import type { ExportNamedDeclaration } from "@babel/types";
+
+type Arguments = {
+  baseDir: string;
+  baseURL: string;
+};
+
+export async function generateConfigFromFileTree({
+  baseDir,
+  baseURL,
+}: Arguments) {
+  let routeEntries: [
+    string,
+    { [key in "module" | "middleware"]?: string[] }
+  ][] = [] as any;
+
+  if (!baseURL.startsWith("/")) {
+    baseURL = `/${baseURL}`;
+  }
+
+  if (baseURL.endsWith("/")) {
+    baseURL = baseURL.slice(0, -1);
+  }
+
+  await forEachFile(baseDir, async (filepath) => {
+    const ext = path.extname(filepath);
+    if (/\.(mjs|js|ts)/.test(ext)) {
+      // transform the code to ensure we're working with vanilla JS + ESM
+      const { code } = await transform(await fs.readFile(filepath, "utf-8"), {
+        loader: ext === ".ts" ? "ts" : "js",
+      });
+
+      // parse each file into an AST and search for module exports that match "onRequest" and friends
+      const ast = acorn.parse(code, {
+        ecmaVersion: "latest",
+        sourceType: "module",
+      });
+      acornWalk.simple(ast, {
+        ExportNamedDeclaration(_node) {
+          const node: ExportNamedDeclaration = _node as any;
+
+          // this is an array because multiple things can be exported from a single statement
+          // i.e. `export {foo, bar}` or `export const foo = "f", bar = "b"`
+          const exportNames: string[] = [];
+
+          if (node.declaration) {
+            const declaration = node.declaration;
+
+            // `export async function onRequest() {...}`
+            if (declaration.type === "FunctionDeclaration") {
+              exportNames.push(declaration.id.name);
+            }
+
+            // `export const onRequestGet = () => {}, onRequestPost = () => {}`
+            if (declaration.type === "VariableDeclaration") {
+              exportNames.push(
+                ...declaration.declarations.map(
+                  (variableDeclarator) =>
+                    (variableDeclarator.id as unknown as Identifier).name
+                )
+              );
+            }
+          }
+
+          // `export {foo, bar}`
+          if (node.specifiers.length) {
+            exportNames.push(
+              ...node.specifiers.map(
+                (exportSpecifier) =>
+                  (exportSpecifier.exported as unknown as Identifier).name
+              )
+            );
+          }
+
+          for (const exportName of exportNames) {
+            const [match, method] =
+              exportName.match(
+                /^onRequest(Get|Post|Put|Patch|Delete|Options|Head)?$/
+              ) ?? [];
+
+            if (match) {
+              const basename = path.basename(filepath).slice(0, -ext.length);
+
+              const isIndexFile = basename === "index";
+              // TODO: deprecate _middleware_ in favor of _middleware
+              const isMiddlewareFile =
+                basename === "_middleware" || basename === "_middleware_";
+
+              let routePath = path
+                .relative(baseDir, filepath)
+                .slice(0, -ext.length);
+
+              if (isIndexFile || isMiddlewareFile) {
+                routePath = path.dirname(routePath);
+              }
+
+              if (routePath === ".") {
+                routePath = "";
+              }
+
+              routePath = `${baseURL}/${routePath}`;
+
+              routePath = routePath.replace(/\[\[(.+)]]/g, ":$1*"); // transform [[id]] => :id*
+              routePath = routePath.replace(/\[(.+)]/g, ":$1"); // transform [id] => :id
+
+              if (method) {
+                routePath = `${method.toUpperCase()} ${routePath}`;
+              }
+
+              routeEntries.push([
+                routePath,
+                {
+                  [isMiddlewareFile ? "middleware" : "module"]: [
+                    `${path.relative(baseDir, filepath)}:${exportName}`,
+                  ],
+                },
+              ]);
+            }
+          }
+        },
+      });
+    }
+  });
+
+  // Combine together any routes (index routes) which contain both a module and a middleware
+  routeEntries = routeEntries.reduce(
+    (acc: typeof routeEntries, [routePath, routeHandler]) => {
+      const existingRouteEntry = acc.find(
+        (routeEntry) => routeEntry[0] === routePath
+      );
+      if (existingRouteEntry !== undefined) {
+        existingRouteEntry[1] = {
+          ...existingRouteEntry[1],
+          ...routeHandler,
+        };
+      } else {
+        acc.push([routePath, routeHandler]);
+      }
+      return acc;
+    },
+    []
+  );
+
+  routeEntries.sort(([pathA], [pathB]) => compareRoutes(pathA, pathB));
+
+  return { routes: Object.fromEntries(routeEntries) } as Config;
+}
+
+// Ensure routes are produced in order of precedence so that
+// more specific routes aren't occluded from matching due to
+// less specific routes appearing first in the route list.
+export function compareRoutes(a: string, b: string) {
+  function parseRoutePath(routePath: string) {
+    let [method, path] = routePath.split(" ");
+    if (!path) {
+      path = method;
+      method = null;
+    }
+
+    const segments = path.slice(1).split("/");
+    return [method, segments];
+  }
+
+  const [methodA, segmentsA] = parseRoutePath(a);
+  const [methodB, segmentsB] = parseRoutePath(b);
+
+  // sort routes with fewer segments after those with more segments
+  if (segmentsA.length !== segmentsB.length) {
+    return segmentsB.length - segmentsA.length;
+  }
+
+  for (let i = 0; i < segmentsA.length; i++) {
+    const isWildcardA = segmentsA[i].includes("*");
+    const isWildcardB = segmentsB[i].includes("*");
+    const isParamA = segmentsA[i].includes(":");
+    const isParamB = segmentsB[i].includes(":");
+
+    // sort wildcard segments after non-wildcard segments
+    if (isWildcardA && !isWildcardB) return 1;
+    if (!isWildcardA && isWildcardB) return -1;
+
+    // sort dynamic param segments after non-param segments
+    if (isParamA && !isParamB) return 1;
+    if (!isParamA && isParamB) return -1;
+  }
+
+  // sort routes that specify an HTTP before those that don't
+  if (methodA && !methodB) return -1;
+  if (!methodA && methodB) return 1;
+
+  // all else equal, just sort them lexicographically
+  return a.localeCompare(b);
+}
+
+async function forEachFile<T>(
+  baseDir: string,
+  fn: (filepath: string) => T | Promise<T>
+) {
+  const searchPaths = [baseDir];
+  const returnValues: T[] = [];
+
+  while (searchPaths.length) {
+    const cwd = searchPaths.shift();
+    const dir = await fs.readdir(cwd, { withFileTypes: true });
+    for (const entry of dir) {
+      const pathname = path.join(cwd, entry.name);
+      if (entry.isDirectory()) {
+        searchPaths.push(pathname);
+      } else if (entry.isFile()) {
+        returnValues.push(await fn(pathname));
+      }
+    }
+  }
+
+  return returnValues;
+}

package/pages/functions/identifiers.ts

@@ -0,0 +1,78 @@
+export const RESERVED_KEYWORDS = [
+  "do",
+  "if",
+  "in",
+  "for",
+  "let",
+  "new",
+  "try",
+  "var",
+  "case",
+  "else",
+  "enum",
+  "eval",
+  "null",
+  "this",
+  "true",
+  "void",
+  "with",
+  "await",
+  "break",
+  "catch",
+  "class",
+  "const",
+  "false",
+  "super",
+  "throw",
+  "while",
+  "yield",
+  "delete",
+  "export",
+  "import",
+  "public",
+  "return",
+  "static",
+  "switch",
+  "typeof",
+  "default",
+  "extends",
+  "finally",
+  "package",
+  "private",
+  "continue",
+  "debugger",
+  "function",
+  "arguments",
+  "interface",
+  "protected",
+  "implements",
+  "instanceof",
+  "NaN",
+  "Infinity",
+  "undefined",
+];
+
+export const reservedKeywordRegex = new RegExp(
+  `^${RESERVED_KEYWORDS.join("|")}$`
+);
+
+export const identifierStartRegex = /[$_\p{ID_Start}]/u;
+
+export const identifierPartRegex = /[$_\u200C\u200D\p{ID_Continue}]/u;
+
+export const identifierNameRegex =
+  /^(?:[$_\p{ID_Start}])(?:[$_\u200C\u200D\p{ID_Continue}])*$/u;
+
+export const validIdentifierRegex = new RegExp(
+  `(?!(${reservedKeywordRegex.source})$)${identifierNameRegex.source}`,
+  "u"
+);
+
+export const isValidIdentifer = (identifier: string) =>
+  validIdentifierRegex.test(identifier);
+
+export const normalizeIdentifier = (identifier: string) =>
+  identifier.replace(
+    /(?:^[^$_\p{ID_Start}])|[^$_\u200C\u200D\p{ID_Continue}]/gu,
+    "_"
+  );

package/pages/functions/routes.ts

@@ -0,0 +1,156 @@
+import path from "path";
+import fs from "fs/promises";
+import { isValidIdentifer, normalizeIdentifier } from "./identifiers";
+
+export const HTTP_METHODS = [
+  "HEAD",
+  "OPTIONS",
+  "GET",
+  "POST",
+  "PUT",
+  "PATCH",
+  "DELETE",
+] as const;
+export type HTTPMethod = typeof HTTP_METHODS[number];
+export function isHTTPMethod(
+  maybeHTTPMethod: string
+): maybeHTTPMethod is HTTPMethod {
+  return HTTP_METHODS.includes(maybeHTTPMethod as any);
+}
+
+export type RoutesCollection = Array<{
+  routePath: string;
+  methods: HTTPMethod[];
+  modules: string[];
+  middlewares: string[];
+}>;
+
+export type Config = {
+  routes?: RoutesConfig;
+  schedules?: any;
+};
+
+export type RoutesConfig = {
+  [route: string]: {
+    middleware?: string | string[];
+    module?: string | string[];
+  };
+};
+
+type ImportMap = Map<
+  string,
+  {
+    filepath: string;
+    name: string;
+    identifier: string;
+  }
+>;
+
+type Arguments = {
+  config: Config;
+  outfile: string;
+  srcDir: string;
+};
+
+export async function writeRoutesModule({
+  config,
+  srcDir,
+  outfile = "_routes.js",
+}: Arguments) {
+  const { importMap, routes } = parseConfig(config, srcDir);
+  const routesModule = generateRoutesModule(importMap, routes);
+
+  await fs.writeFile(outfile, routesModule);
+
+  return outfile;
+}
+
+export function parseConfig(config: Config, baseDir: string) {
+  const routes: RoutesCollection = [];
+  const importMap: ImportMap = new Map();
+  const identifierCount = new Map<string, number>(); // to keep track of identifier collisions
+
+  function parseModuleIdentifiers(paths: string | string[] | undefined) {
+    if (typeof paths === "undefined") {
+      paths = [];
+    }
+
+    if (typeof paths === "string") {
+      paths = [paths];
+    }
+
+    return paths.map((modulePath) => {
+      const [filepath, name = "default"] = modulePath.split(":");
+      let { identifier } = importMap.get(modulePath) ?? {};
+
+      const resolvedPath = path.resolve(baseDir, filepath);
+
+      // ensure the filepath isn't attempting to resolve to anything outside of the project
+      if (path.relative(baseDir, resolvedPath).startsWith("..")) {
+        throw new Error(`Invalid module path "${filepath}"`);
+      }
+
+      // ensure the module name (if provided) is a valid identifier to guard against injection attacks
+      if (name !== "default" && !isValidIdentifer(name)) {
+        throw new Error(`Invalid module identifier "${name}"`);
+      }
+
+      if (!identifier) {
+        identifier = normalizeIdentifier(`__${filepath}_${name}`);
+
+        let count = identifierCount.get(identifier) ?? 0;
+        identifierCount.set(identifier, ++count);
+
+        if (count > 1) {
+          identifier += `_${count}`;
+        }
+
+        importMap.set(modulePath, { filepath: resolvedPath, name, identifier });
+      }
+
+      return identifier;
+    });
+  }
+
+  for (const [route, props] of Object.entries(config.routes)) {
+    let [_methods, routePath] = route.split(" ");
+    if (!routePath) {
+      routePath = _methods;
+      _methods = "";
+    }
+
+    routes.push({
+      routePath,
+      methods: _methods.split("|").filter(isHTTPMethod),
+      middlewares: parseModuleIdentifiers(props.middleware),
+      modules: parseModuleIdentifiers(props.module),
+    });
+  }
+
+  return { routes, importMap };
+}
+
+export function generateRoutesModule(
+  importMap: ImportMap,
+  routes: RoutesCollection
+) {
+  return `${[...importMap.values()]
+    .map(
+      ({ filepath, name, identifier }) =>
+        `import { ${name} as ${identifier} } from ${JSON.stringify(filepath)}`
+    )
+    .join("\n")}
+
+export const routes = [
+  ${routes
+    .map(
+      (route) => `  {
+      routePath: "${route.routePath}",
+      methods: ${JSON.stringify(route.methods)},
+      middlewares: [${route.middlewares.join(", ")}],
+      modules: [${route.modules.join(", ")}],
+    },`
+    )
+    .join("\n")}
+  ]`;
+}

package/{lib → pages}/functions/template-worker.ts

@@ -1,5 +1,5 @@
 import { match } from "path-to-regexp";
-import { HTTPMethod } from "./routes";
+import type { HTTPMethod } from "./routes";
 
 /* TODO: Grab these from @cloudflare/workers-types instead */
 type Params<P extends string = any> = Record<P, string | string[]>;