wrangler 2.0.6 → 2.0.7

package/src/config/validation.ts

@@ -193,7 +193,8 @@ export function normalizeAndValidateConfig(
     dev: normalizeAndValidateDev(diagnostics, rawConfig.dev ?? {}),
     migrations: normalizeAndValidateMigrations(
       diagnostics,
-      rawConfig.migrations ?? []
+      rawConfig.migrations ?? [],
+      activeEnv.durable_objects
     ),
     site: normalizeAndValidateSite(
       diagnostics,
@@ -387,7 +388,8 @@ function normalizeAndValidateDev(
  */
 function normalizeAndValidateMigrations(
   diagnostics: Diagnostics,
-  rawMigrations: Config["migrations"]
+  rawMigrations: Config["migrations"],
+  durableObjects: Config["durable_objects"]
 ): Config["migrations"] {
   if (!Array.isArray(rawMigrations)) {
     diagnostics.errors.push(
@@ -441,6 +443,26 @@ function normalizeAndValidateMigrations(
         "string"
       );
     }
+
+    if (
+      Array.isArray(durableObjects?.bindings) &&
+      durableObjects.bindings.length > 0
+    ) {
+      // intrinsic [durable_objects] implies [migrations]
+      const exportedDurableObjects = (durableObjects.bindings || []).filter(
+        (binding) => !binding.script_name
+      );
+      if (exportedDurableObjects.length > 0 && rawMigrations.length === 0) {
+        diagnostics.warnings.push(
+          `In wrangler.toml, you have configured [durable_objects] exported by this Worker (${exportedDurableObjects
+            .map((durable) => durable.class_name || "(unnamed)")
+            .join(
+              ", "
+            )}), but no [migrations] for them. This may not work as expected until you add a [migrations] section to your wrangler.toml. Refer to https://developers.cloudflare.com/workers/learning/using-durable-objects/#durable-object-migrations-in-wranglertoml for more details.`
+        );
+      }
+    }
+
     return rawMigrations;
   }
 }

package/src/create-worker-preview.ts

@@ -66,7 +66,12 @@ async function sessionToken(
     ? `/zones/${ctx.zone.id}/workers/edge-preview`
     : `/accounts/${accountId}/workers/subdomain/edge-preview`;
 
-  const { exchange_url } = await fetchResult<{ exchange_url: string }>(initUrl);
+  const { exchange_url } = await fetchResult<{ exchange_url: string }>(
+    initUrl,
+    undefined,
+    undefined,
+    abortSignal
+  );
   const { inspector_websocket, prewarm, token } = (await (
     await fetch(exchange_url, { signal: abortSignal })
   ).json()) as { inspector_websocket: string; token: string; prewarm: string };
@@ -119,13 +124,18 @@ async function createPreviewToken(
   const formData = createWorkerUploadForm(worker);
   formData.set("wrangler-session-config", JSON.stringify(mode));
 
-  const { preview_token } = await fetchResult<{ preview_token: string }>(url, {
-    method: "POST",
-    body: formData,
-    headers: {
-      "cf-preview-upload-config-token": value,
+  const { preview_token } = await fetchResult<{ preview_token: string }>(
+    url,
+    {
+      method: "POST",
+      body: formData,
+      headers: {
+        "cf-preview-upload-config-token": value,
+      },
     },
-  });
+    undefined,
+    abortSignal
+  );
 
   return {
     value: preview_token,

package/src/dev/dev.tsx

@@ -9,7 +9,9 @@ import { withErrorBoundary, useErrorHandler } from "react-error-boundary";
 import onExit from "signal-exit";
 import tmp from "tmp-promise";
 import { fetch } from "undici";
+import { printBindings } from "../config";
 import { runCustomBuild } from "../entry";
+import { openInspector } from "../inspect";
 import { logger } from "../logger";
 import openInBrowser from "../open-in-browser";
 import { getAPIToken } from "../user";
@@ -104,6 +106,8 @@ export function DevImplementation(props: DevProps): JSX.Element {
     nodeCompat: props.nodeCompat,
   });
 
+  printBindings(props.bindings);
+
   // only load the UI if we're running in a supported environment
   const { isRawModeSupported } = useStdin();
   return isRawModeSupported ? (
@@ -378,10 +382,7 @@ function useHotkeys(
         }
         // toggle inspector
         case "d": {
-          await openInBrowser(
-            `https://built-devtools.pages.dev/js_app?experiments=true&v8only=true&ws=localhost:${inspectorPort}/ws`,
-            { forceChromium: true }
-          );
+          await openInspector(inspectorPort);
           break;
         }
         // toggle local

package/src/dev/remote.tsx

@@ -185,7 +185,21 @@ export function useWorker(props: {
       // we want to log the error, but not end the process
       // since it could recover after the developer fixes whatever's wrong
       if ((err as { code: string }).code !== "ABORT_ERR") {
-        logger.error("Error on remote worker:", err);
+        // instead of logging the raw API error to the user,
+        // give them friendly instructions
+        // for error 10063 (workers.dev subdomain required)
+        if (err.code === 10063) {
+          const errorMessage =
+            "Error: You need to register a workers.dev subdomain before running the dev command in remote mode";
+          const solutionMessage =
+            "You can either enable local mode by pressing l, or register a workers.dev subdomain here:";
+          const onboardingLink = `https://dash.cloudflare.com/${accountId}/workers/onboarding`;
+          logger.error(
+            `${errorMessage}\n${solutionMessage}\n${onboardingLink}`
+          );
+        } else {
+          logger.error("Error on remote worker:", err);
+        }
       }
     });
 

package/src/durable.ts

@@ -0,0 +1,102 @@
+import assert from "node:assert";
+import { fetchResult } from "./cfetch";
+import { logger } from "./logger";
+import type { Config } from "./config";
+import type { CfWorkerInit } from "./worker";
+
+/**
+ * For a given Worker + migrations config, figure out which migrations
+ * to upload based on the current migration tag of the deployed Worker.
+ */
+export async function getMigrationsToUpload(
+  scriptName: string,
+  props: {
+    accountId: string | undefined;
+    config: Config;
+    legacyEnv: boolean | undefined;
+    env: string | undefined;
+  }
+): Promise<CfWorkerInit["migrations"]> {
+  const { config, accountId } = props;
+
+  assert(accountId, "Missing accountId");
+  // if config.migrations
+  let migrations;
+  if (config.migrations.length > 0) {
+    // get current migration tag
+    type ScriptData = { id: string; migration_tag?: string };
+    let script: ScriptData | undefined;
+    if (!props.legacyEnv) {
+      try {
+        if (props.env) {
+          const scriptData = await fetchResult<{
+            script: ScriptData;
+          }>(
+            `/accounts/${accountId}/workers/services/${scriptName}/environments/${props.env}`
+          );
+          script = scriptData.script;
+        } else {
+          const scriptData = await fetchResult<{
+            default_environment: {
+              script: ScriptData;
+            };
+          }>(`/accounts/${accountId}/workers/services/${scriptName}`);
+          script = scriptData.default_environment.script;
+        }
+      } catch (err) {
+        if (
+          ![
+            10090, // corresponds to workers.api.error.service_not_found, so the script wasn't previously published at all
+            10092, // workers.api.error.environment_not_found, so the script wasn't published to this environment yet
+          ].includes((err as { code: number }).code)
+        ) {
+          throw err;
+        }
+        // else it's a 404, no script found, and we can proceed
+      }
+    } else {
+      const scripts = await fetchResult<ScriptData[]>(
+        `/accounts/${accountId}/workers/scripts`
+      );
+      script = scripts.find(({ id }) => id === scriptName);
+    }
+
+    if (script?.migration_tag) {
+      // was already published once
+      const scriptMigrationTag = script.migration_tag;
+      const foundIndex = config.migrations.findIndex(
+        (migration) => migration.tag === scriptMigrationTag
+      );
+      if (foundIndex === -1) {
+        logger.warn(
+          `The published script ${scriptName} has a migration tag "${script.migration_tag}, which was not found in wrangler.toml. You may have already deleted it. Applying all available migrations to the script...`
+        );
+        migrations = {
+          old_tag: script.migration_tag,
+          new_tag: config.migrations[config.migrations.length - 1].tag,
+          steps: config.migrations.map(({ tag: _tag, ...rest }) => rest),
+        };
+      } else {
+        if (foundIndex !== config.migrations.length - 1) {
+          // there are new migrations to send up
+          migrations = {
+            old_tag: script.migration_tag,
+            new_tag: config.migrations[config.migrations.length - 1].tag,
+            steps: config.migrations
+              .slice(foundIndex + 1)
+              .map(({ tag: _tag, ...rest }) => rest),
+          };
+        }
+        // else, we're up to date, no migrations to send
+      }
+    } else {
+      // first time publishing durable objects to this script,
+      // so we send all the migrations
+      migrations = {
+        new_tag: config.migrations[config.migrations.length - 1].tag,
+        steps: config.migrations.map(({ tag: _tag, ...rest }) => rest),
+      };
+    }
+  }
+  return migrations;
+}

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";
@@ -43,6 +44,7 @@ import {
   formatMessage,
   ParseError,
   parseJSON,
+  parsePackageJSON,
   parseTOML,
   readFileSync,
 } from "./parse";
@@ -77,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 ?? [];
 
@@ -333,6 +346,9 @@ function createCLIParser(argv: string[]) {
         throw new CommandLineArgsError(message);
       }
 
+      const devDepsToInstall: string[] = [];
+      const instructions: string[] = [];
+      let shouldRunPackageManagerInstall = false;
       const creationDirectory = path.resolve(process.cwd(), args.name ?? "");
 
       if (args.site) {
@@ -428,7 +444,9 @@ function createCLIParser(argv: string[]) {
           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"))
@@ -474,7 +492,7 @@ function createCLIParser(argv: string[]) {
             ) + "\n"
           );
 
-          await packageManager.install();
+          shouldRunPackageManagerInstall = true;
           pathToPackageJson = path.join(creationDirectory, "package.json");
           logger.log(
             `✨ Created ${path.relative(process.cwd(), pathToPackageJson)}`
@@ -485,7 +503,7 @@ function createCLIParser(argv: string[]) {
       } 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
         );
@@ -504,8 +522,7 @@ function createCLIParser(argv: string[]) {
               )}?`
             ));
           if (shouldInstall) {
-            await packageManager.addDevDeps(`wrangler@${wranglerVersion}`);
-            logger.log(`✨ Installed wrangler`);
+            devDepsToInstall.push(`wrangler@${wranglerVersion}`);
           }
         }
       }
@@ -523,23 +540,18 @@ function createCLIParser(argv: string[]) {
             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
         );
@@ -553,13 +565,13 @@ function createCLIParser(argv: string[]) {
             "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
               )}`
@@ -568,7 +580,7 @@ function createCLIParser(argv: string[]) {
         }
       }
 
-      const packageJsonContent = parseJSON(
+      const packageJsonContent = parsePackageJSON(
         readFileSync(pathToPackageJson),
         pathToPackageJson
       );
@@ -577,6 +589,41 @@ function createCLIParser(argv: string[]) {
         !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,
@@ -620,21 +667,21 @@ function createCLIParser(argv: string[]) {
               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}`
             }`
@@ -713,6 +760,21 @@ function createCLIParser(argv: string[]) {
           }
         }
       }
+      // 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));
     }
   );
 
@@ -723,13 +785,34 @@ function createCLIParser(argv: string[]) {
     (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();
     }
   );
 
@@ -1286,6 +1369,7 @@ function createCLIParser(argv: string[]) {
         args.siteInclude,
         args.siteExclude
       );
+
       await publish({
         config,
         accountId,
@@ -2396,14 +2480,7 @@ function createCLIParser(argv: string[]) {
             }
 
             const accountId = await requireAuth(config);
-            await putKVBulkKeyValue(
-              accountId,
-              namespaceId,
-              content,
-              (index, total) => {
-                logger.log(`Uploaded ${index} of ${total}.`);
-              }
-            );
+            await putKVBulkKeyValue(accountId, namespaceId, content);
 
             logger.log("Success!");
           }
@@ -2493,14 +2570,7 @@ function createCLIParser(argv: string[]) {
 
             const accountId = await requireAuth(config);
 
-            await deleteKVBulkKeyValue(
-              accountId,
-              namespaceId,
-              content,
-              (index, total) => {
-                logger.log(`Deleted ${index} of ${total}.`);
-              }
-            );
+            await deleteKVBulkKeyValue(accountId, namespaceId, content);
 
             logger.log("Success!");
           }

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);
+  });
+};