wrangler 0.0.0-dfa31a7 → 0.0.0-e14e589

package/bin/wrangler.js

@@ -1,2 +1,36 @@
-#!/usr/bin/env node --no-warnings
-require("../wrangler-dist/index_node.js");
+#!/usr/bin/env node
+const { spawn } = require("child_process");
+const { join } = require("path");
+const semiver = require("semiver");
+
+const MIN_NODE_VERSION = "16.7.0";
+
+async function main() {
+  if (semiver(process.versions.node, MIN_NODE_VERSION) < 0) {
+    // Note Volta and nvm are also recommended in the official docs:
+    // https://developers.cloudflare.com/workers/get-started/guide#2-install-the-workers-cli
+    console.error(
+      `Wrangler requires at least Node.js v${MIN_NODE_VERSION}. You are using v${process.versions.node}.
+You should use the latest Node.js version if possible, as Cloudflare Workers use a very up-to-date version of V8.
+Consider using a Node.js version manager such as https://volta.sh/ or https://github.com/nvm-sh/nvm.`
+    );
+    process.exitCode = 1;
+    return;
+  }
+
+  spawn(
+    process.execPath,
+    [
+      "--no-warnings",
+      "--experimental-vm-modules",
+      ...process.execArgv,
+      join(__dirname, "../wrangler-dist/cli.js"),
+      ...process.argv.slice(2),
+    ],
+    { stdio: "inherit" }
+  ).on("exit", (code) =>
+    process.exit(code === undefined || code === null ? 0 : code)
+  );
+}
+
+void main();

package/import_meta_url.js

@@ -0,0 +1,3 @@
+// as per https://github.com/evanw/esbuild/issues/1492
+// to make some libs work
+export const import_meta_url = require("url").pathToFileURL(__filename);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wrangler",
-  "version": "0.0.0-dfa31a7",
+  "version": "0.0.0-e14e589",
   "author": "wrangler@cloudflare.com",
   "description": "Command-line interface for all things Cloudflare Workers",
   "bin": "./bin/wrangler.js",
@@ -33,9 +33,11 @@
     "cli"
   ],
   "dependencies": {
-    "esbuild": "^0.12.19",
-    "miniflare": "^1.3.3",
-    "yargs": "^17.1.1"
+    "@cloudflare/pages-functions-compiler": "0.3.4",
+    "esbuild": "0.13.12",
+    "miniflare": "2.0.0-rc.2",
+    "semiver": "^1.1.0",
+    "serve": "^13.0.2"
   },
   "optionalDependencies": {
     "fsevents": "~2.3.2"
@@ -43,38 +45,68 @@
   "devDependencies": {
     "@iarna/toml": "^2.2.5",
     "@types/cloudflare": "^2.7.6",
-    "@types/react": "^17.0.19",
+    "@types/express": "^4.17.13",
+    "@types/react": "^17.0.34",
     "@types/signal-exit": "^3.0.1",
-    "@types/ws": "^7.4.7",
-    "@types/yargs": "^17.0.2",
-    "clipboardy": "^2.3.0",
-    "cloudflare": "^2.9.1",
-    "find-up": "^6.0.0",
-    "formdata-node": "^3.6.3",
+    "@types/ws": "^8.2.0",
+    "@types/yargs": "^17.0.5",
+    "clipboardy": "^3.0.0",
+    "command-exists": "^1.2.9",
+    "execa": "^5.1.1",
+    "express": "^4.17.1",
+    "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",
     "ink": "^3.2.0",
+    "ink-select-input": "^4.2.0",
     "ink-table": "^3.0.0",
-    "node-fetch": "github:tekwiz/node-fetch#fix/redirect-with-empty-chunked-transfer-encoding",
-    "open": "^8.2.1",
+    "ink-text-input": "^4.0.1",
+    "node-fetch": "^3.1.0",
+    "open": "^8.4.0",
+    "path-to-regexp": "^6.2.0",
     "react": "^17.0.2",
+    "serve-static": "^1.14.1",
     "signal-exit": "^3.0.5",
-    "tmp-promise": "^3.0.2",
-    "ws": "^8.2.0"
+    "tmp-promise": "^3.0.3",
+    "ws": "^8.2.3",
+    "yargs": "^17.2.1"
   },
   "files": [
+    "src",
     "bin",
     "miniflare-config-stubs",
     "wrangler-dist",
-    "facade.js",
-    "vendor"
+    "static-asset-facade.js",
+    "vendor",
+    "import_meta_url.js"
   ],
   "scripts": {
     "clean": "rm -rf wrangler-dist",
     "bundle": "node -r esbuild-register scripts/bundle.ts",
     "build": "npm run clean && npm run bundle",
-    "start": "npm run bundle && ./bin/wrangler.js"
+    "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"
   },
   "engines": {
     "node": ">=16.0.0"
+  },
+  "jest": {
+    "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)"
+    ],
+    "moduleNameMapper": {
+      "clipboardy": "<rootDir>/src/__tests__/clipboardy-mock.js"
+    },
+    "transform": {
+      "^.+\\.c?(t|j)sx?$": [
+        "esbuild-jest",
+        {
+          "sourcemap": true
+        }
+      ]
+    }
   }
 }

package/src/__tests__/clipboardy-mock.js

@@ -0,0 +1,4 @@
+// We use this mock during tests because we're having trouble
+// properly compiling clipboardy for jest
+// We can revisit this if and when we write tests that test
+// the copying part of `dev`

package/src/__tests__/index.test.ts

@@ -0,0 +1,153 @@
+import * as fs from "node:fs";
+import * as fsp from "node:fs/promises";
+import * as path from "node:path";
+import * as TOML from "@iarna/toml";
+import { main } from "../index";
+// @ts-expect-error we're mocking cfetch, so of course setMock isn't a thing
+import { setMock, unsetAllMocks } from "../cfetch";
+
+jest.mock("../cfetch", () => {
+  return jest.requireActual("./mock-cfetch");
+});
+
+async function w(cmd: void | string, options?: { tap: boolean }) {
+  const tapped = options?.tap ? tap() : undefined;
+  await main([...(cmd ? cmd.split(" ") : [])]);
+  tapped?.off();
+  return { stdout: tapped?.out, stderr: tapped?.err };
+}
+
+function tap() {
+  const oldLog = console.log;
+  const oldError = console.error;
+
+  const toReturn = {
+    off: () => {
+      console.log = oldLog;
+      console.error = oldError;
+    },
+    out: "",
+    err: "",
+  };
+
+  console.log = (...args) => {
+    toReturn.out += args.join("");
+    oldLog.apply(console, args);
+    // console.trace(...args); // use this if you want to find the true source of your console.log
+  };
+  console.error = (...args) => {
+    toReturn.err += args.join("");
+    oldError.apply(console, args);
+  };
+
+  return toReturn;
+}
+
+describe("wrangler", () => {
+  it("should run", async () => {
+    const { stdout } = await w(undefined, { tap: true });
+
+    expect(stdout).toMatchInlineSnapshot(`
+      "wrangler
+
+      Commands:
+        wrangler init [name]       📥 Create a wrangler.toml configuration file
+        wrangler dev <filename>    👂 Start a local server for developing your worker
+        wrangler publish [script]  🆙 Publish your Worker to Cloudflare.
+        wrangler tail [name]       🦚 Starts a log tailing session for a deployed Worker.
+        wrangler secret            🤫 Generate a secret that can be referenced in the worker script
+        wrangler kv:namespace      🗂️  Interact with your Workers KV Namespaces
+        wrangler kv:key            🔑 Individually manage Workers KV key-value pairs
+        wrangler kv:bulk           💪 Interact with multiple Workers KV key-value pairs at once
+        wrangler pages             ⚡️ Configure Cloudflare Pages
+
+      Flags:
+        --config   Path to .toml configuration file  [string]
+        --help     Show help  [boolean]
+        --version  Show version number  [boolean]
+
+      Options:
+        --local  Run on my machine  [boolean] [default: false]"
+    `);
+  });
+
+  describe("init", () => {
+    const ogcwd = process.cwd();
+
+    beforeEach(() => {
+      process.chdir(path.join(__dirname, "fixtures", "init"));
+    });
+
+    afterEach(async () => {
+      await fsp.rm("./wrangler.toml");
+      process.chdir(ogcwd);
+    });
+
+    it("should create a wrangler.toml", async () => {
+      await w("init");
+      const parsed = TOML.parse(await fsp.readFile("./wrangler.toml", "utf-8"));
+      expect(typeof parsed.compatibility_date).toBe("string");
+    });
+
+    it("should error when wrangler.toml already exists", async () => {
+      fs.closeSync(fs.openSync("./wrangler.toml", "w"));
+      const { stderr } = await w("init", { tap: true });
+      expect(stderr.endsWith("wrangler.toml already exists.")).toBe(true);
+    });
+  });
+
+  describe("kv:namespace", () => {
+    afterAll(() => {
+      unsetAllMocks();
+    });
+    let KVNamespaces: { title: string; id: string }[] = [];
+    it("can create a namespace", async () => {
+      setMock("/accounts/:accountId/storage/kv/namespaces", (uri, init) => {
+        expect(init.method === "POST");
+        const body = JSON.parse(init.body);
+        expect(body.title).toBe("worker-UnitTestNamespace");
+        KVNamespaces.push({ title: body.title, id: "some-namespace-id" });
+        return { id: "some-namespace-id" };
+      });
+
+      await w('kv:namespace create "UnitTestNamespace"');
+      expect(
+        KVNamespaces.find((ns) => ns.title === `worker-UnitTestNamespace`)
+      ).toBeTruthy();
+    });
+
+    let createdNamespace: { id: string; title: string };
+    it("can list namespaces", async () => {
+      setMock(
+        "/accounts/:accountId/storage/kv/namespaces\\?:qs",
+        (uri, init) => {
+          expect(init).toBe(undefined);
+          return KVNamespaces;
+        }
+      );
+      const { stdout } = await w("kv:namespace list", { tap: true });
+      const namespaces = JSON.parse(stdout);
+      createdNamespace = namespaces.find(
+        (ns) => ns.title === "worker-UnitTestNamespace"
+      );
+      expect(createdNamespace.title).toBe("worker-UnitTestNamespace");
+    });
+
+    it("can delete a namespace", async () => {
+      const namespaceIdToDelete = createdNamespace.id;
+      setMock(
+        "/accounts/:accountId/storage/kv/namespaces/:namespaceId",
+        (uri, init) => {
+          expect(init.method).toBe("DELETE");
+          KVNamespaces = KVNamespaces.filter(
+            (ns) => ns.id !== namespaceIdToDelete
+          );
+        }
+      );
+      await w(`kv:namespace delete --namespace-id ${namespaceIdToDelete}`);
+      expect(KVNamespaces.find((ns) => ns.id === namespaceIdToDelete)).toBe(
+        undefined
+      );
+    });
+  });
+});

package/src/__tests__/mock-cfetch.js

@@ -0,0 +1,46 @@
+// This file mocks ../cfetch.ts
+// so we can insert whatever responses we want from it
+
+const pathToRegexp = require("path-to-regexp");
+// TODO: add jsdoc style types here
+
+// type MockHandler = (resource: string, init?: RequestInit) => any; // TODO: use a generic here
+
+let mocks = [];
+
+function mockCfetch(resource, init) {
+  for (const { regexp, handler } of mocks) {
+    if (regexp.test(resource)) {
+      return handler(resource, init); // should we have some kind of fallthrough system? we'll see.
+    }
+  }
+  throw new Error(`no mocks found for ${resource}`);
+}
+
+function setMock(resource, handler) {
+  const mock = {
+    resource,
+    handler,
+    regexp: pathToRegexp(resource),
+  };
+  mocks.push(mock);
+  return () => {
+    mocks = mocks.filter((x) => x !== mock);
+  };
+}
+
+function unsetAllMocks() {
+  mocks = [];
+}
+
+const CF_API_BASE_URL =
+  process.env.CF_API_BASE_URL || "https://api.cloudflare.com/client/v4";
+
+Object.assign(module.exports, {
+  __esModule: true,
+  default: mockCfetch,
+  mockCfetch,
+  setMock,
+  unsetAllMocks,
+  CF_API_BASE_URL,
+});

package/src/api/form_data.ts

@@ -0,0 +1,125 @@
+import type {
+  CfWorkerInit,
+  CfModuleType,
+  CfVariable,
+  CfModule,
+  CfKvNamespace,
+  CfCryptoKey,
+} from "./worker.js";
+import { FormData, Blob } from "formdata-node";
+
+// Credit: https://stackoverflow.com/a/9458996
+function toBase64(source: BufferSource): string {
+  let result = "";
+  const buffer = source instanceof ArrayBuffer ? source : source.buffer;
+  const bytes = new Uint8Array(buffer);
+  for (let i = 0; i < bytes.byteLength; i++) {
+    result += String.fromCharCode(bytes[i]);
+  }
+  return btoa(result);
+}
+
+function toBinding(
+  name: string,
+  variable: CfVariable
+): Record<string, unknown> {
+  if (typeof variable === "string") {
+    return { name, type: "plain_text", text: variable };
+  }
+
+  const { namespaceId } = variable as CfKvNamespace;
+  if (namespaceId) {
+    return { name, type: "kv_namespace", namespace_id: namespaceId };
+  }
+
+  const { format, algorithm, usages, data } = variable as CfCryptoKey;
+  if (format) {
+    let key_base64;
+    let key_jwk;
+    if (data instanceof ArrayBuffer || ArrayBuffer.isView(data)) {
+      key_base64 = toBase64(data);
+    } else {
+      key_jwk = data;
+    }
+    return {
+      name,
+      type: "secret_key",
+      format,
+      algorithm,
+      usages,
+      key_base64,
+      key_jwk,
+    };
+  }
+
+  throw new TypeError("Unsupported variable: " + variable);
+}
+
+export function toMimeType(type: CfModuleType): string {
+  switch (type) {
+    case "esm":
+      return "application/javascript+module";
+    case "commonjs":
+      return "application/javascript";
+    case "compiled-wasm":
+      return "application/wasm";
+    case "buffer":
+      return "application/octet-stream";
+    case "text":
+      return "text/plain";
+    default:
+      throw new TypeError("Unsupported module: " + type);
+  }
+}
+
+function toModule(module: CfModule, entryType?: CfModuleType): Blob {
+  const { type: moduleType, content } = module;
+  const type = toMimeType(moduleType ?? entryType);
+
+  return new Blob([content], { type });
+}
+
+/**
+ * Creates a `FormData` upload from a `CfWorkerInit`.
+ */
+export function toFormData(worker: CfWorkerInit): FormData {
+  const formData = new FormData();
+  const { main, modules, variables, usage_model, compatibility_date } = worker;
+  const { name, type: mainType } = main;
+
+  const bindings = [];
+  for (const [name, variable] of Object.entries(variables ?? {})) {
+    const binding = toBinding(name, variable);
+    bindings.push(binding);
+  }
+
+  const singleton = mainType === "commonjs";
+  const metadata = {
+    main_module: singleton ? undefined : name,
+    body_part: singleton ? name : undefined,
+    bindings,
+  };
+  if (compatibility_date) {
+    // @ts-expect-error - we should type metadata
+    metadata.compatibility_date = compatibility_date;
+  }
+  if (usage_model) {
+    // @ts-expect-error - we should type metadata
+    metadata.usage_model = usage_model;
+  }
+  formData.set("metadata", JSON.stringify(metadata));
+
+  if (singleton && modules && modules.length > 0) {
+    throw new TypeError(
+      "More than one module can only be specified when type = 'esm'"
+    );
+  }
+
+  for (const module of [main].concat(modules || [])) {
+    const { name } = module;
+    const blob = toModule(module, mainType ?? "esm");
+    formData.set(name, blob, name);
+  }
+
+  return formData;
+}