wrangler 0.0.0-e14e589 → 0.0.0-e2a26a0

package/README.md

@@ -0,0 +1,51 @@
+## 🤠 wrangler
+
+`wrangler` is a command line tool for building [Cloudflare Workers](https://workers.cloudflare.com/).
+
+[(Read the full stack week launch blog post.)](https://blog.cloudflare.com/wrangler-v2-beta/)
+
+**DISCLAIMER**: This is a work in progress, and is NOT recommended for use in production. We are opening this preview for feedback from the community, and to openly share our [roadmap](https://github.com/cloudflare/wrangler2/issues/12) for the future. As such, expect APIs and documentation to change before the end of the preview.
+
+Further, we will NOT do a general release until we are both feature complete, and have a full backward compatibility and incremental migration plan in place. For more details, follow the [parent roadmap issue](https://github.com/cloudflare/wrangler2/issues/12).
+
+## Quick Start
+
+```bash
+# Make a javascript file
+$ echo "export default { fetch() { return new Response('hello world') } }" > index.js
+# try it out
+$ npx wrangler@beta dev index.js
+# and then publish it
+$ npx wrangler@beta publish index.js --name my-worker
+# visit https://my-worker.<your workers subdomain>.workers.dev
+```
+
+## Installation:
+
+```bash
+$ npm install wrangler@beta
+```
+
+## Commands
+
+### `wrangler init [name]`
+
+Creates a `wrangler.toml` configuration file. For more details on the configuration keys and values, refer to the [documentation](https://developers.cloudflare.com/workers/cli-wrangler/configuration).
+
+### `wrangler dev [script]`
+
+Start a local development server, with live reloading and devtools.
+
+### `wrangler publish [script] --name [name]`
+
+Publish the given script to the worldwide Cloudflare network.
+
+For more commands and options, refer to the [documentation](https://developers.cloudflare.com/workers/cli-wrangler/commands).
+
+### `wrangler pages dev [directory] [-- command]`
+
+Either serves a static build asset directory, or proxies itself in front of a command.
+
+Builds and runs functions from a `./functions` directory or uses a `_worker.js` file inside the static build asset directory.
+
+For more commands and options, refer to the [documentation](https://developers.cloudflare.com/pages/platform/functions#develop-and-preview-locally) or run `wrangler pages dev --help`.

package/bin/wrangler.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
-const { spawn } = require("child_process");
-const { join } = require("path");
+const { spawn } = require("node:child_process");
+const { join } = require("node:path");
 const semiver = require("semiver");
 
 const MIN_NODE_VERSION = "16.7.0";

package/package.json

@@ -1,9 +1,12 @@
 {
   "name": "wrangler",
-  "version": "0.0.0-e14e589",
+  "version": "0.0.0-e2a26a0",
   "author": "wrangler@cloudflare.com",
   "description": "Command-line interface for all things Cloudflare Workers",
-  "bin": "./bin/wrangler.js",
+  "bin": {
+    "wrangler": "./bin/wrangler.js",
+    "wrangler2": "./bin/wrangler.js"
+  },
   "license": "MIT OR Apache-2.0",
   "bugs": {
     "url": "https://github.com/cloudflare/wrangler/issues"
@@ -33,72 +36,85 @@
     "cli"
   ],
   "dependencies": {
-    "@cloudflare/pages-functions-compiler": "0.3.4",
-    "esbuild": "0.13.12",
-    "miniflare": "2.0.0-rc.2",
+    "esbuild": "0.14.14",
+    "miniflare": "2.2.0",
+    "path-to-regexp": "^6.2.0",
     "semiver": "^1.1.0",
-    "serve": "^13.0.2"
+    "xxhash-addon": "^1.4.0"
   },
   "optionalDependencies": {
     "fsevents": "~2.3.2"
   },
   "devDependencies": {
+    "@babel/types": "^7.16.0",
     "@iarna/toml": "^2.2.5",
-    "@types/cloudflare": "^2.7.6",
-    "@types/express": "^4.17.13",
-    "@types/react": "^17.0.34",
+    "@types/estree": "^0.0.50",
+    "@types/mime": "^2.0.3",
+    "@types/react": "^17.0.37",
+    "@types/serve-static": "^1.13.10",
     "@types/signal-exit": "^3.0.1",
-    "@types/ws": "^8.2.0",
-    "@types/yargs": "^17.0.5",
+    "@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",
+    "cmd-shim": "^4.1.0",
     "command-exists": "^1.2.9",
-    "execa": "^5.1.1",
-    "express": "^4.17.1",
+    "devtools-protocol": "^0.0.955664",
+    "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",
-    "http-proxy-middleware": "^2.0.1",
+    "ignore": "^5.2.0",
     "ink": "^3.2.0",
-    "ink-select-input": "^4.2.0",
+    "ink-select-input": "^4.2.1",
     "ink-table": "^3.0.0",
-    "ink-text-input": "^4.0.1",
-    "node-fetch": "^3.1.0",
+    "ink-testing-library": "^2.1.0",
+    "ink-text-input": "^4.0.2",
+    "jest-fetch-mock": "^3.0.3",
+    "mime": "^3.0.0",
     "open": "^8.4.0",
-    "path-to-regexp": "^6.2.0",
     "react": "^17.0.2",
+    "react-error-boundary": "^3.1.4",
     "serve-static": "^1.14.1",
-    "signal-exit": "^3.0.5",
+    "signal-exit": "^3.0.6",
     "tmp-promise": "^3.0.3",
-    "ws": "^8.2.3",
-    "yargs": "^17.2.1"
+    "undici": "4.13.0",
+    "ws": "^8.3.0",
+    "yargs": "^17.3.0"
   },
   "files": [
     "src",
     "bin",
+    "pages",
     "miniflare-config-stubs",
     "wrangler-dist",
-    "static-asset-facade.js",
+    "templates",
     "vendor",
     "import_meta_url.js"
   ],
   "scripts": {
     "clean": "rm -rf wrangler-dist",
+    "check:type": "tsc",
     "bundle": "node -r esbuild-register scripts/bundle.ts",
     "build": "npm run clean && npm run bundle",
     "start": "npm run bundle && NODE_OPTIONS=--enable-source-maps ./bin/wrangler.js",
-    "test": "CF_API_TOKEN=some-api-token CF_ACCOUNT_ID=some-account-id jest --silent=false --verbose=true"
+    "test": "jest --silent=false --verbose=true",
+    "test-watch": "npm run test -- --runInBand --testTimeout=50000 --watch"
   },
   "engines": {
-    "node": ">=16.0.0"
+    "node": ">=16.7.0"
   },
   "jest": {
+    "restoreMocks": true,
+    "testTimeout": 30000,
     "testRegex": ".*.(test|spec)\\.[jt]sx?$",
     "transformIgnorePatterns": [
-      "node_modules/(?!node-fetch|fetch-blob|find-up|locate-path|p-locate|p-limit|yocto-queue|path-exists|data-uri-to-buffer|formdata-polyfill)"
+      "node_modules/(?!find-up|locate-path|p-locate|p-limit|yocto-queue|path-exists|execa|strip-final-newline|npm-run-path|path-key|onetime|mimic-fn|human-signals|is-stream)"
     ],
     "moduleNameMapper": {
-      "clipboardy": "<rootDir>/src/__tests__/clipboardy-mock.js"
+      "clipboardy": "<rootDir>/src/__tests__/helpers/clipboardy-mock.js"
     },
     "transform": {
       "^.+\\.c?(t|j)sx?$": [
@@ -107,6 +123,9 @@
           "sourcemap": true
         }
       ]
-    }
+    },
+    "setupFilesAfterEnv": [
+      "<rootDir>/src/__tests__/jest.setup.ts"
+    ]
   }
-}
+}

package/pages/functions/buildWorker.ts

@@ -0,0 +1,62 @@
+import path from "node:path";
+import { build } from "esbuild";
+
+type Options = {
+  routesModule: string;
+  outfile: string;
+  minify?: boolean;
+  sourcemap?: boolean;
+  fallbackService?: string;
+  watch?: boolean;
+  onEnd?: () => void;
+};
+
+export function buildWorker({
+  routesModule,
+  outfile = "bundle.js",
+  minify = false,
+  sourcemap = false,
+  fallbackService = "ASSETS",
+  watch = false,
+  onEnd = () => {},
+}: Options) {
+  return build({
+    entryPoints: [
+      path.resolve(__dirname, "../pages/functions/template-worker.ts"),
+    ],
+    inject: [routesModule],
+    bundle: true,
+    format: "esm",
+    target: "esnext",
+    outfile,
+    minify,
+    sourcemap,
+    watch,
+    allowOverwrite: true,
+    define: {
+      __FALLBACK_SERVICE__: JSON.stringify(fallbackService),
+    },
+    plugins: [
+      {
+        name: "wrangler notifier and monitor",
+        setup(pluginBuild) {
+          pluginBuild.onEnd((result) => {
+            if (result.errors.length > 0) {
+              console.error(
+                `${result.errors.length} error(s) and ${result.warnings.length} warning(s) when compiling Worker.`
+              );
+            } else if (result.warnings.length > 0) {
+              console.warn(
+                `${result.warnings.length} warning(s) when compiling Worker.`
+              );
+              onEnd();
+            } else {
+              console.log("Compiled Worker successfully.");
+              onEnd();
+            }
+          });
+        },
+      },
+    ],
+  });
+}

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

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

package/pages/functions/filepath-routing.ts

@@ -0,0 +1,231 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+import * as acorn from "acorn";
+import * as acornWalk from "acorn-walk";
+import { transform } from "esbuild";
+import { toUrlPath } from "../../src/paths";
+import type { UrlPath } from "../../src/paths";
+import type { Config, RouteConfig } from "./routes";
+import type { ExportNamedDeclaration, Identifier } from "estree";
+
+type Arguments = {
+  baseDir: string;
+  baseURL: UrlPath;
+};
+
+type Method = "GET" | "POST" | "PUT" | "PATCH" | "DELETE" | "OPTIONS" | "HEAD";
+type RouteKey = [UrlPath, Method] | [UrlPath, undefined] | [UrlPath];
+
+export async function generateConfigFromFileTree({
+  baseDir,
+  baseURL,
+}: Arguments) {
+  let routeEntries: [RouteKey, RouteConfig][] = [];
+
+  if (!baseURL.startsWith("/")) {
+    baseURL = `/${baseURL}` as UrlPath;
+  }
+
+  if (baseURL.endsWith("/")) {
+    baseURL = baseURL.slice(0, -1) as UrlPath;
+  }
+
+  await forEachFile(baseDir, async (filepath) => {
+    const ext = path.extname(filepath);
+    if (/^\.(mjs|js|ts|tsx|jsx)$/.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: unknown) {
+          // This dynamic cast assumes that the AST generated by acornWalk will generate nodes that
+          // are compatible with the eslint AST nodes.
+          const node = _node as ExportNamedDeclaration;
+
+          // 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" && declaration.id) {
+              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
+
+              const routeUrlPath = toUrlPath(routePath);
+              const routeKey: RouteKey = [
+                routeUrlPath,
+                method ? (method.toUpperCase() as Method) : undefined,
+              ];
+
+              routeEntries.push([
+                routeKey,
+                {
+                  [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(([a], [b]) => compareRoutes(a, b));
+
+  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(
+  [routePathA, methodA]: RouteKey,
+  [routePathB, methodB]: RouteKey
+) {
+  function parseRoutePath(routePath: UrlPath): string[] {
+    return routePath.slice(1).split("/").filter(Boolean);
+  }
+
+  const segmentsA = parseRoutePath(routePathA);
+  const segmentsB = parseRoutePath(routePathB);
+
+  // 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 the paths lexicographically
+  return routePathA.localeCompare(routePathB);
+}
+
+async function forEachFile<T>(
+  baseDir: string,
+  fn: (filepath: string) => T | Promise<T>
+) {
+  const searchPaths = [baseDir];
+  const returnValues: T[] = [];
+
+  while (isNotEmpty(searchPaths)) {
+    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;
+}
+
+interface NonEmptyArray<T> extends Array<T> {
+  shift(): T;
+}
+function isNotEmpty<T>(array: T[]): array is NonEmptyArray<T> {
+  return array.length > 0;
+}

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 isValidIdentifier = (identifier: string) =>
+  validIdentifierRegex.test(identifier);
+
+export const normalizeIdentifier = (identifier: string) =>
+  identifier.replace(
+    /(?:^[^$_\p{ID_Start}])|[^$_\u200C\u200D\p{ID_Continue}]/gu,
+    "_"
+  );