wrangler 2.0.3 → 2.0.7

package/src/index.tsx

@@ -11,6 +11,7 @@ import { render } from "ink";
 import React from "react";
 import onExit from "signal-exit";
 import supportsColor from "supports-color";
+import { setGlobalDispatcher, ProxyAgent } from "undici";
 import makeCLI from "yargs";
 import { version as wranglerVersion } from "../package.json";
 import { fetchResult } from "./cfetch";
@@ -22,17 +23,19 @@ import { confirm, prompt } from "./dialogs";
 import { getEntry } from "./entry";
 import { DeprecationError } from "./errors";
 import {
-  getNamespaceId,
-  listNamespaces,
-  listNamespaceKeys,
-  putKeyValue,
-  putBulkKeyValue,
-  deleteBulkKeyValue,
-  createNamespace,
-  isValidNamespaceBinding,
-  getKeyValue,
-  isKeyValue,
-  unexpectedKeyValueProps,
+  getKVNamespaceId,
+  listKVNamespaces,
+  listKVNamespaceKeys,
+  putKVKeyValue,
+  putKVBulkKeyValue,
+  deleteKVBulkKeyValue,
+  createKVNamespace,
+  isValidKVNamespaceBinding,
+  getKVKeyValue,
+  isKVKeyValue,
+  unexpectedKVKeyValueProps,
+  deleteKVNamespace,
+  deleteKVKeyValue,
 } from "./kv";
 import { logger } from "./logger";
 import { getPackageManager } from "./package-manager";
@@ -41,6 +44,7 @@ import {
   formatMessage,
   ParseError,
   parseJSON,
+  parsePackageJSON,
   parseTOML,
   readFileSync,
 } from "./parse";
@@ -75,6 +79,17 @@ const resetColor = "\x1b[0m";
 const fgGreenColor = "\x1b[32m";
 const DEFAULT_LOCAL_PORT = 8787;
 
+const proxy =
+  process.env.https_proxy ||
+  process.env.HTTPS_PROXY ||
+  process.env.http_proxy ||
+  process.env.HTTP_PROXY ||
+  undefined;
+
+if (proxy) {
+  setGlobalDispatcher(new ProxyAgent(proxy));
+}
+
 function getRules(config: Config): Config["rules"] {
   const rules = config.rules ?? config.build?.upload?.rules ?? [];
 
@@ -204,9 +219,17 @@ function demandOneOfOption(...options: string[]) {
   };
 }
 
+/**
+ * Remove trailing white space from inputs.
+ * Matching Wrangler legacy behavior with handling inputs
+ */
+function trimTrailingWhitespace(str: string) {
+  return str.trimEnd();
+}
+
 class CommandLineArgsError extends Error {}
 
-export async function main(argv: string[]): Promise<void> {
+function createCLIParser(argv: string[]) {
   const wrangler = makeCLI(argv)
     .strict()
     // We handle errors ourselves in a try-catch around `yargs.parse`.
@@ -323,6 +346,9 @@ export async function main(argv: string[]): Promise<void> {
         throw new CommandLineArgsError(message);
       }
 
+      const devDepsToInstall: string[] = [];
+      const instructions: string[] = [];
+      let shouldRunPackageManagerInstall = false;
       const creationDirectory = path.resolve(process.cwd(), args.name ?? "");
 
       if (args.site) {
@@ -411,19 +437,16 @@ export async function main(argv: string[]): Promise<void> {
       try {
         isGitInstalled = (await execa("git", ["--version"])).exitCode === 0;
       } catch (err) {
-        if ((err as { code: string | undefined }).code !== "ENOENT") {
-          // only throw if the error is not because git is not installed
-          throw err;
-        } else {
-          isGitInstalled = false;
-        }
+        isGitInstalled = false;
       }
       if (!isInsideGitProject && isGitInstalled) {
         const shouldInitGit =
           yesFlag ||
           (await confirm("Would you like to use git to manage this Worker?"));
         if (shouldInitGit) {
-          await execa("git", ["init"], { cwd: creationDirectory });
+          await execa("git", ["init", "--initial-branch=main"], {
+            cwd: creationDirectory,
+          });
           await writeFile(
             path.join(creationDirectory, ".gitignore"),
             readFileSync(path.join(__dirname, "../templates/gitignore"))
@@ -469,7 +492,7 @@ export async function main(argv: string[]): Promise<void> {
             ) + "\n"
           );
 
-          await packageManager.install();
+          shouldRunPackageManagerInstall = true;
           pathToPackageJson = path.join(creationDirectory, "package.json");
           logger.log(
             `✨ Created ${path.relative(process.cwd(), pathToPackageJson)}`
@@ -480,7 +503,7 @@ export async function main(argv: string[]): Promise<void> {
       } else {
         // If package.json exists and wrangler isn't installed,
         // then ask to add wrangler to devDependencies
-        const packageJson = parseJSON(
+        const packageJson = parsePackageJSON(
           readFileSync(pathToPackageJson),
           pathToPackageJson
         );
@@ -499,8 +522,7 @@ export async function main(argv: string[]): Promise<void> {
               )}?`
             ));
           if (shouldInstall) {
-            await packageManager.addDevDeps(`wrangler@${wranglerVersion}`);
-            logger.log(`✨ Installed wrangler`);
+            devDepsToInstall.push(`wrangler@${wranglerVersion}`);
           }
         }
       }
@@ -518,23 +540,18 @@ export async function main(argv: string[]): Promise<void> {
             path.join(creationDirectory, "./tsconfig.json"),
             readFileSync(path.join(__dirname, "../templates/tsconfig.json"))
           );
-          await packageManager.addDevDeps(
-            "@cloudflare/workers-types",
-            "typescript"
-          );
+          devDepsToInstall.push("@cloudflare/workers-types");
+          devDepsToInstall.push("typescript");
           pathToTSConfig = path.join(creationDirectory, "tsconfig.json");
           logger.log(
-            `✨ Created ${path.relative(
-              process.cwd(),
-              pathToTSConfig
-            )}, installed @cloudflare/workers-types into devDependencies`
+            `✨ Created ${path.relative(process.cwd(), pathToTSConfig)}`
           );
         }
       } else {
         isTypescriptProject = true;
         // If there's a tsconfig, check if @cloudflare/workers-types
         // is already installed, and offer to install it if not
-        const packageJson = parseJSON(
+        const packageJson = parsePackageJSON(
           readFileSync(pathToPackageJson),
           pathToPackageJson
         );
@@ -548,13 +565,13 @@ export async function main(argv: string[]): Promise<void> {
             "Would you like to install the type definitions for Workers into your package.json?"
           );
           if (shouldInstall) {
-            await packageManager.addDevDeps("@cloudflare/workers-types");
+            devDepsToInstall.push("@cloudflare/workers-types");
             // We don't update the tsconfig.json because
             // it could be complicated in existing projects
             // and we don't want to break them. Instead, we simply
             // tell the user that they need to update their tsconfig.json
-            logger.log(
-              `✨ Installed @cloudflare/workers-types.\nPlease add "@cloudflare/workers-types" to compilerOptions.types in ${path.relative(
+            instructions.push(
+              `🚨 Please add "@cloudflare/workers-types" to compilerOptions.types in ${path.relative(
                 process.cwd(),
                 pathToTSConfig
               )}`
@@ -563,7 +580,7 @@ export async function main(argv: string[]): Promise<void> {
         }
       }
 
-      const packageJsonContent = parseJSON(
+      const packageJsonContent = parsePackageJSON(
         readFileSync(pathToPackageJson),
         pathToPackageJson
       );
@@ -572,6 +589,41 @@ export async function main(argv: string[]): Promise<void> {
         !packageJsonContent.scripts?.publish &&
         shouldCreatePackageJson;
 
+      /*
+       * Passes the array of accumulated devDeps to install through to
+       * the package manager. Also generates a human-readable list
+       * of packages it installed.
+       * If there are no devDeps to install, optionally runs
+       * the package manager's install command.
+       */
+      async function installPackages(
+        shouldRunInstall: boolean,
+        depsToInstall: string[]
+      ) {
+        //lets install the devDeps they asked for
+        //and run their package manager's install command if needed
+        if (depsToInstall.length > 0) {
+          const formatter = new Intl.ListFormat("en", {
+            style: "long",
+            type: "conjunction",
+          });
+          await packageManager.addDevDeps(...depsToInstall);
+          const versionlessPackages = depsToInstall.map((dep) =>
+            dep === `wrangler@${wranglerVersion}` ? "wrangler" : dep
+          );
+
+          logger.log(
+            `✨ Installed ${formatter.format(
+              versionlessPackages
+            )} into devDependencies`
+          );
+        } else {
+          if (shouldRunInstall) {
+            await packageManager.install();
+          }
+        }
+      }
+
       async function writePackageJsonScriptsAndUpdateWranglerToml(
         isWritingScripts: boolean,
         isCreatingWranglerToml: boolean,
@@ -615,21 +667,21 @@ export async function main(argv: string[]): Promise<void> {
               2
             ) + "\n"
           );
-          logger.log(
+          instructions.push(
             `\nTo start developing your Worker, run \`${
               isNamedWorker ? `cd ${args.name} && ` : ""
             }npm start\``
           );
-          logger.log(
+          instructions.push(
             `To publish your Worker to the Internet, run \`npm run publish\``
           );
         } else {
-          logger.log(
+          instructions.push(
             `\nTo start developing your Worker, run \`npx wrangler dev\`${
               isCreatingWranglerToml ? "" : ` ${scriptPath}`
             }`
           );
-          logger.log(
+          instructions.push(
             `To publish your Worker to the Internet, run \`npx wrangler publish\`${
               isCreatingWranglerToml ? "" : ` ${scriptPath}`
             }`
@@ -708,6 +760,21 @@ export async function main(argv: string[]): Promise<void> {
           }
         }
       }
+      // install packages as the final step of init
+      try {
+        await installPackages(shouldRunPackageManagerInstall, devDepsToInstall);
+      } catch (e) {
+        // fetching packages could fail due to loss of internet, etc
+        // we should let folks know we failed to fetch, but their
+        // workers project is still ready to go
+        logger.error(e instanceof Error ? e.message : e);
+        instructions.push(
+          "\n🚨 wrangler was unable to fetch your npm packages, but your project is ready to go"
+        );
+      }
+
+      // let users know what to do now
+      instructions.forEach((instruction) => logger.log(instruction));
     }
   );
 
@@ -718,13 +785,34 @@ export async function main(argv: string[]): Promise<void> {
     (yargs) => {
       return yargs.option("env", {
         describe: "Perform on a specific environment",
+        type: "string",
       });
     },
-    () => {
+    async (buildArgs) => {
       // "[DEPRECATED] 🦀 Build your project (if applicable)",
-      throw new DeprecationError(
-        "`wrangler build` has been deprecated, please refer to https://developers.cloudflare.com/workers/wrangler/migration/deprecations/#build for alternatives"
+
+      const envFlag = buildArgs.env ? ` --env=${buildArgs.env}` : "";
+      logger.log(
+        formatMessage({
+          kind: "warning",
+          text: "Deprecation: `wrangler build` has been deprecated.",
+          notes: [
+            {
+              text: "Please refer to https://developers.cloudflare.com/workers/wrangler/migration/deprecations/#build for more information.",
+            },
+            {
+              text: `Attempting to run \`wrangler publish --dry-run --outdir=dist${envFlag}\` for you instead:`,
+            },
+          ],
+        })
       );
+
+      await createCLIParser([
+        "publish",
+        "--dry-run",
+        "--outdir=dist",
+        ...(buildArgs.env ? ["--env", buildArgs.env] : []),
+      ]).parse();
     }
   );
 
@@ -895,6 +983,19 @@ export async function main(argv: string[]): Promise<void> {
       const config = readConfig(configPath, args);
       const entry = await getEntry(args, config, "dev");
 
+      if (config.services && config.services.length > 0) {
+        logger.warn(
+          `This worker is bound to live services: ${config.services
+            .map(
+              (service) =>
+                `${service.binding} (${service.service}${
+                  service.environment ? `@${service.environment}` : ""
+                })`
+            )
+            .join(", ")}`
+        );
+      }
+
       if (args.inspect) {
         logger.warn(
           "Passing --inspect is unnecessary, now you can always connect to devtools."
@@ -932,6 +1033,9 @@ export async function main(argv: string[]): Promise<void> {
        * try to extract a host from it
        */
       function getHost(urlLike: string): string | undefined {
+        // strip leading * / *.
+        urlLike = urlLike.replace(/^\*(\.)?/g, "");
+
         if (
           !(urlLike.startsWith("http://") || urlLike.startsWith("https://"))
         ) {
@@ -1102,6 +1206,7 @@ export async function main(argv: string[]): Promise<void> {
                 };
               }
             ),
+            services: config.services,
             unsafe: config.unsafe?.bindings,
           }}
           crons={config.triggers.crons}
@@ -1256,7 +1361,7 @@ export async function main(argv: string[]): Promise<void> {
         );
       }
 
-      const accountId = await requireAuth(config);
+      const accountId = args.dryRun ? undefined : await requireAuth(config);
 
       const assetPaths = getAssetPaths(
         config,
@@ -1264,6 +1369,7 @@ export async function main(argv: string[]): Promise<void> {
         args.siteInclude,
         args.siteExclude
       );
+
       await publish({
         config,
         accountId,
@@ -1554,6 +1660,7 @@ export async function main(argv: string[]): Promise<void> {
                 };
               }
             ),
+            services: config.services,
             unsafe: config.unsafe?.bindings,
           }}
           crons={config.triggers.crons}
@@ -1704,9 +1811,11 @@ export async function main(argv: string[]): Promise<void> {
             const accountId = await requireAuth(config);
 
             const isInteractive = process.stdin.isTTY;
-            const secretValue = isInteractive
-              ? await prompt("Enter a secret value:", "password")
-              : await readFromStdin();
+            const secretValue = trimTrailingWhitespace(
+              isInteractive
+                ? await prompt("Enter a secret value:", "password")
+                : await readFromStdin()
+            );
 
             logger.log(
               `🌀 Creating the secret for script ${scriptName} ${
@@ -1751,6 +1860,7 @@ export async function main(argv: string[]): Promise<void> {
                       vars: {},
                       durable_objects: { bindings: [] },
                       r2_buckets: [],
+                      services: [],
                       wasm_modules: {},
                       text_blobs: {},
                       data_blobs: {},
@@ -1919,7 +2029,7 @@ export async function main(argv: string[]): Promise<void> {
           async (args) => {
             await printWranglerBanner();
 
-            if (!isValidNamespaceBinding(args.namespace)) {
+            if (!isValidKVNamespaceBinding(args.namespace)) {
               throw new CommandLineArgsError(
                 `The namespace binding name "${args.namespace}" is invalid. It can only have alphanumeric and _ characters, and cannot begin with a number.`
               );
@@ -1942,7 +2052,7 @@ export async function main(argv: string[]): Promise<void> {
             // TODO: generate a binding name stripping non alphanumeric chars
 
             logger.log(`🌀 Creating namespace with title "${title}"`);
-            const namespaceId = await createNamespace(accountId, title);
+            const namespaceId = await createKVNamespace(accountId, title);
 
             logger.log("✨ Success!");
             const envString = args.env ? ` under [env.${args.env}]` : "";
@@ -1969,7 +2079,7 @@ export async function main(argv: string[]): Promise<void> {
             // TODO: we should show bindings if they exist for given ids
 
             logger.log(
-              JSON.stringify(await listNamespaces(accountId), null, "  ")
+              JSON.stringify(await listKVNamespaces(accountId), null, "  ")
             );
           }
         )
@@ -2006,7 +2116,7 @@ export async function main(argv: string[]): Promise<void> {
 
             let id;
             try {
-              id = getNamespaceId(args, config);
+              id = getKVNamespaceId(args, config);
             } catch (e) {
               throw new CommandLineArgsError(
                 "Not able to delete namespace.\n" + ((e as Error).message ?? e)
@@ -2015,12 +2125,7 @@ export async function main(argv: string[]): Promise<void> {
 
             const accountId = await requireAuth(config);
 
-            await fetchResult<{ id: string }>(
-              `/accounts/${accountId}/storage/kv/namespaces/${encodeURIComponent(
-                id
-              )}`,
-              { method: "DELETE" }
-            );
+            await deleteKVNamespace(accountId, id);
 
             // TODO: recommend they remove it from wrangler.toml
 
@@ -2105,7 +2210,7 @@ export async function main(argv: string[]): Promise<void> {
           async ({ key, ttl, expiration, ...args }) => {
             await printWranglerBanner();
             const config = readConfig(args.config as ConfigPath, args);
-            const namespaceId = getNamespaceId(args, config);
+            const namespaceId = getKVNamespaceId(args, config);
             // One of `args.path` and `args.value` must be defined
             const value = args.path
               ? readFileSync(args.path)
@@ -2124,7 +2229,7 @@ export async function main(argv: string[]): Promise<void> {
 
             const accountId = await requireAuth(config);
 
-            await putKeyValue(accountId, namespaceId, {
+            await putKVKeyValue(accountId, namespaceId, {
               key,
               value,
               expiration,
@@ -2169,11 +2274,11 @@ export async function main(argv: string[]): Promise<void> {
           async ({ prefix, ...args }) => {
             // TODO: support for limit+cursor (pagination)
             const config = readConfig(args.config as ConfigPath, args);
-            const namespaceId = getNamespaceId(args, config);
+            const namespaceId = getKVNamespaceId(args, config);
 
             const accountId = await requireAuth(config);
 
-            const results = await listNamespaceKeys(
+            const results = await listKVNamespaceKeys(
               accountId,
               namespaceId,
               prefix
@@ -2221,11 +2326,11 @@ export async function main(argv: string[]): Promise<void> {
           },
           async ({ key, ...args }) => {
             const config = readConfig(args.config as ConfigPath, args);
-            const namespaceId = getNamespaceId(args, config);
+            const namespaceId = getKVNamespaceId(args, config);
 
             const accountId = await requireAuth(config);
 
-            logger.log(await getKeyValue(accountId, namespaceId, key));
+            logger.log(await getKVKeyValue(accountId, namespaceId, key));
           }
         )
         .command(
@@ -2263,7 +2368,7 @@ export async function main(argv: string[]): Promise<void> {
           async ({ key, ...args }) => {
             await printWranglerBanner();
             const config = readConfig(args.config as ConfigPath, args);
-            const namespaceId = getNamespaceId(args, config);
+            const namespaceId = getKVNamespaceId(args, config);
 
             logger.log(
               `Deleting the key "${key}" on namespace ${namespaceId}.`
@@ -2271,12 +2376,7 @@ export async function main(argv: string[]): Promise<void> {
 
             const accountId = await requireAuth(config);
 
-            await fetchResult(
-              `/accounts/${accountId}/storage/kv/namespaces/${namespaceId}/values/${encodeURIComponent(
-                key
-              )}`,
-              { method: "DELETE" }
-            );
+            await deleteKVKeyValue(accountId, namespaceId, key);
           }
         );
     }
@@ -2328,7 +2428,7 @@ export async function main(argv: string[]): Promise<void> {
             // but we'll do that in the future if needed.
 
             const config = readConfig(args.config as ConfigPath, args);
-            const namespaceId = getNamespaceId(args, config);
+            const namespaceId = getKVNamespaceId(args, config);
             const content = parseJSON(readFileSync(filename), filename);
 
             if (!Array.isArray(content)) {
@@ -2342,18 +2442,12 @@ export async function main(argv: string[]): Promise<void> {
             const warnings: string[] = [];
             for (let i = 0; i < content.length; i++) {
               const keyValue = content[i];
-              if (typeof keyValue !== "object") {
-                errors.push(
-                  `The item at index ${i} is type: "${typeof keyValue}" - ${JSON.stringify(
-                    keyValue
-                  )}`
-                );
-              } else if (!isKeyValue(keyValue)) {
+              if (!isKVKeyValue(keyValue)) {
                 errors.push(
                   `The item at index ${i} is ${JSON.stringify(keyValue)}`
                 );
               } else {
-                const props = unexpectedKeyValueProps(keyValue);
+                const props = unexpectedKVKeyValueProps(keyValue);
                 if (props.length > 0) {
                   warnings.push(
                     `The item at index ${i} contains unexpected properties: ${JSON.stringify(
@@ -2386,14 +2480,7 @@ export async function main(argv: string[]): Promise<void> {
             }
 
             const accountId = await requireAuth(config);
-            await putBulkKeyValue(
-              accountId,
-              namespaceId,
-              content,
-              (index, total) => {
-                logger.log(`Uploaded ${index} of ${total}.`);
-              }
-            );
+            await putKVBulkKeyValue(accountId, namespaceId, content);
 
             logger.log("Success!");
           }
@@ -2438,7 +2525,7 @@ export async function main(argv: string[]): Promise<void> {
           async ({ filename, ...args }) => {
             await printWranglerBanner();
             const config = readConfig(args.config as ConfigPath, args);
-            const namespaceId = getNamespaceId(args, config);
+            const namespaceId = getKVNamespaceId(args, config);
 
             if (!args.force) {
               const result = await confirm(
@@ -2483,14 +2570,7 @@ export async function main(argv: string[]): Promise<void> {
 
             const accountId = await requireAuth(config);
 
-            await deleteBulkKeyValue(
-              accountId,
-              namespaceId,
-              content,
-              (index, total) => {
-                logger.log(`Deleted ${index} of ${total}.`);
-              }
-            );
+            await deleteKVBulkKeyValue(accountId, namespaceId, content);
 
             logger.log("Success!");
           }
@@ -2655,14 +2735,21 @@ export async function main(argv: string[]): Promise<void> {
   wrangler.version(wranglerVersion).alias("v", "version");
   wrangler.exitProcess(false);
 
+  return wrangler;
+}
+
+export async function main(argv: string[]): Promise<void> {
+  const wrangler = createCLIParser(argv);
   try {
     await wrangler.parse();
   } catch (e) {
     logger.log(""); // Just adds a bit of space
     if (e instanceof CommandLineArgsError) {
-      wrangler.showHelp("error");
-      logger.log(""); // Add a bit of space.
       logger.error(e.message);
+      // We are not able to ask the `wrangler` CLI parser to show help for a subcommand programmatically.
+      // The workaround is to re-run the parsing with an additional `--help` flag, which will result in the correct help message being displayed.
+      // The `wrangler` object is "frozen"; we cannot reuse that with different args, so we must create a new CLI parser to generate the help message.
+      await createCLIParser([...argv, "--help"]).parse();
     } else if (e instanceof ParseError) {
       e.notes.push({
         text: "\nIf you think this is a bug, please open an issue at: https://github.com/cloudflare/wrangler2/issues/new",

package/src/inspect.ts

@@ -1,7 +1,9 @@
 import assert from "node:assert";
 import { createServer } from "node:http";
+import os from "node:os";
 import { URL } from "node:url";
 
+import open from "open";
 import { useEffect, useRef, useState } from "react";
 import WebSocket, { WebSocketServer } from "ws";
 import { version } from "../package.json";
@@ -621,3 +623,40 @@ function logConsoleMessage(evt: Protocol.Runtime.ConsoleAPICalledEvent): void {
     logger.warn("console event:", evt);
   }
 }
+
+/**
+ * Opens the chrome debugger
+ */
+export const openInspector = async (inspectorPort: number) => {
+  const url = `https://built-devtools.pages.dev/js_app?experiments=true&v8only=true&ws=localhost:${inspectorPort}/ws`;
+  const errorMessage =
+    "Failed to open inspector.\nInspector depends on having a Chromium-based browser installed, maybe you need to install one?";
+
+  // see: https://github.com/sindresorhus/open/issues/177#issue-610016699
+  let braveBrowser: string;
+  switch (os.platform()) {
+    case "darwin":
+    case "win32":
+      braveBrowser = "Brave";
+      break;
+    default:
+      braveBrowser = "brave";
+  }
+
+  const childProcess = await open(url, {
+    app: [
+      {
+        name: open.apps.chrome,
+      },
+      {
+        name: braveBrowser,
+      },
+      {
+        name: open.apps.edge,
+      },
+    ],
+  });
+  childProcess.on("error", () => {
+    logger.warn(errorMessage);
+  });
+};