diff --git a/.changeset/curly-bulldogs-shake.md b/.changeset/curly-bulldogs-shake.md
new file mode 100644
index 000000000000..da7e87cf2d0e
--- /dev/null
+++ b/.changeset/curly-bulldogs-shake.md
@@ -0,0 +1,7 @@
+---
+"wrangler": patch
+---
+
+fix: pass `routes` to `dev` session
+
+We can pass routes when creating a `dev` session. The effect of this is when you visit a path that _doesn't_ match the given routes, then it instead does a fetch from the deployed worker on that path (if any). We were previously passing `*/*`, i.e, matching _all_ routes in dev; this fix now passes configured routes instead.
diff --git a/packages/wrangler/src/__tests__/dev.test.tsx b/packages/wrangler/src/__tests__/dev.test.tsx
index 24e65196462f..63b0f617bf5b 100644
--- a/packages/wrangler/src/__tests__/dev.test.tsx
+++ b/packages/wrangler/src/__tests__/dev.test.tsx
@@ -141,6 +141,27 @@ describe("wrangler dev", () => {
});
});
+ describe("routes", () => {
+ it("should pass routes to ", async () => {
+ fs.writeFileSync("index.js", `export default {};`);
+
+ // config.routes
+ mockGetZones("5.some-host.com", [{ id: "some-zone-id-5" }]);
+ writeWranglerToml({
+ main: "index.js",
+ routes: ["http://5.some-host.com/some/path/*"],
+ });
+ await runWrangler("dev");
+ expect((Dev as jest.Mock).mock.calls[0][0]).toEqual(
+ expect.objectContaining({
+ host: "5.some-host.com",
+ zone: "some-zone-id-5",
+ routes: ["http://5.some-host.com/some/path/*"],
+ })
+ );
+ });
+ });
+
describe("host", () => {
it("should resolve a host to its zone", async () => {
writeWranglerToml({
diff --git a/packages/wrangler/src/create-worker-preview.ts b/packages/wrangler/src/create-worker-preview.ts
index ff17c2c99e3c..1370da384184 100644
--- a/packages/wrangler/src/create-worker-preview.ts
+++ b/packages/wrangler/src/create-worker-preview.ts
@@ -118,7 +118,21 @@ async function createPreviewToken(
: `/accounts/${accountId}/workers/scripts/${scriptId}/edge-preview`;
const mode: CfPreviewMode = ctx.zone
- ? { routes: ["*/*"] } // TODO: should we support routes here? how?
+ ? {
+ routes: ctx.routes
+ ? // extract all the route patterns
+ ctx.routes.map((route) => {
+ if (typeof route === "string") {
+ return route;
+ }
+ if (route.custom_domain) {
+ return `${route.pattern}/*`;
+ }
+ return route.pattern;
+ })
+ : // if there aren't any patterns, then just match on all routes
+ ["*/*"],
+ }
: { workers_dev: true };
const formData = createWorkerUploadForm(worker);
diff --git a/packages/wrangler/src/dev.tsx b/packages/wrangler/src/dev.tsx
index d3109440aff5..81a875079511 100644
--- a/packages/wrangler/src/dev.tsx
+++ b/packages/wrangler/src/dev.tsx
@@ -22,6 +22,7 @@ import {
} from "./index";
import type { Config } from "./config";
+import type { Route } from "./config/environment";
import type { Argv, ArgumentsCamelCase } from "yargs";
interface DevArgs {
@@ -296,14 +297,15 @@ export async function devHandler(args: ArgumentsCamelCase) {
// Compute zone info from the `host` and `route` args and config;
let host = args.host || config.dev.host;
let zoneId: string | undefined;
+ const routes: Route[] | undefined =
+ args.routes || (config.route && [config.route]) || config.routes;
if (!args.local) {
if (host) {
zoneId = await getZoneIdFromHost(host);
}
- const routes = args.routes || config.route || config.routes;
if (!zoneId && routes) {
- const firstRoute = Array.isArray(routes) ? routes[0] : routes;
+ const firstRoute = routes[0];
const zone = await getZoneForRoute(firstRoute);
if (zone) {
zoneId = zone.id;
@@ -311,9 +313,8 @@ export async function devHandler(args: ArgumentsCamelCase) {
}
}
} else if (!host) {
- const routes = args.routes || config.route || config.routes;
if (routes) {
- const firstRoute = Array.isArray(routes) ? routes[0] : routes;
+ const firstRoute = routes[0];
host = getHostFromRoute(firstRoute);
}
}
@@ -415,6 +416,7 @@ export async function devHandler(args: ArgumentsCamelCase) {
env={args.env}
zone={zoneId}
host={host}
+ routes={routes}
rules={getRules(config)}
legacyEnv={isLegacyEnv(config)}
minify={args.minify ?? config.minify}
diff --git a/packages/wrangler/src/dev/dev.tsx b/packages/wrangler/src/dev/dev.tsx
index 038daa373ed0..5c0fa47aa754 100644
--- a/packages/wrangler/src/dev/dev.tsx
+++ b/packages/wrangler/src/dev/dev.tsx
@@ -17,6 +17,7 @@ import { Local } from "./local";
import { Remote } from "./remote";
import { useEsbuild } from "./use-esbuild";
import type { Config } from "../config";
+import type { Route } from "../config/environment";
import type { Entry } from "../entry";
import type { AssetPaths } from "../sites";
import type { CfWorkerInit } from "../worker";
@@ -52,6 +53,7 @@ export type DevProps = {
legacyEnv: boolean;
zone: string | undefined;
host: string | undefined;
+ routes: Route[] | undefined;
};
export function DevImplementation(props: DevProps): JSX.Element {
@@ -188,6 +190,7 @@ function DevSession(props: DevSessionProps) {
legacyEnv={props.legacyEnv}
zone={props.zone}
host={props.host}
+ routes={props.routes}
/>
);
}
diff --git a/packages/wrangler/src/dev/remote.tsx b/packages/wrangler/src/dev/remote.tsx
index 5c381ea3fee2..314c5476da61 100644
--- a/packages/wrangler/src/dev/remote.tsx
+++ b/packages/wrangler/src/dev/remote.tsx
@@ -9,6 +9,7 @@ import { logger } from "../logger";
import { usePreviewServer } from "../proxy";
import { syncAssets } from "../sites";
import { ChooseAccount, getAccountChoices, requireApiToken } from "../user";
+import type { Route } from "../config/environment";
import type { CfPreviewToken } from "../create-worker-preview";
import type { AssetPaths } from "../sites";
import type { ChooseAccountItem } from "../user";
@@ -34,6 +35,7 @@ export function Remote(props: {
legacyEnv: boolean | undefined;
zone: string | undefined;
host: string | undefined;
+ routes: Route[] | undefined;
}) {
const [accountId, setAccountId] = useState(props.accountId);
const accountChoicesRef = useRef>();
@@ -56,6 +58,7 @@ export function Remote(props: {
legacyEnv: props.legacyEnv,
zone: props.zone,
host: props.host,
+ routes: props.routes,
});
usePreviewServer({
@@ -125,6 +128,7 @@ export function useWorker(props: {
legacyEnv: boolean | undefined;
zone: string | undefined;
host: string | undefined;
+ routes: Route[] | undefined;
}): CfPreviewToken | undefined {
const {
name,
@@ -230,6 +234,7 @@ export function useWorker(props: {
legacyEnv: props.legacyEnv,
zone: props.zone,
host: props.host,
+ routes: props.routes,
},
abortController.signal
)
@@ -277,6 +282,7 @@ export function useWorker(props: {
props.legacyEnv,
props.zone,
props.host,
+ props.routes,
]);
return token;
}
diff --git a/packages/wrangler/src/preview.tsx b/packages/wrangler/src/preview.tsx
index cffcbc8bd2b9..74aae96798a9 100644
--- a/packages/wrangler/src/preview.tsx
+++ b/packages/wrangler/src/preview.tsx
@@ -76,6 +76,7 @@ export async function previewHandler(args: ArgumentsCamelCase) {
env={args.env}
zone={undefined}
host={undefined}
+ routes={undefined}
legacyEnv={isLegacyEnv(config)}
build={config.build || {}}
define={config.define}
diff --git a/packages/wrangler/src/worker.ts b/packages/wrangler/src/worker.ts
index f48583a79665..1c266a4d2e1c 100644
--- a/packages/wrangler/src/worker.ts
+++ b/packages/wrangler/src/worker.ts
@@ -1,8 +1,9 @@
+import type { Route } from "./config/environment";
+import type { ApiCredentials } from "./user";
+
/**
* A Cloudflare account.
*/
-import type { ApiCredentials } from "./user";
-
export interface CfAccount {
/**
* An API token.
@@ -180,4 +181,5 @@ export interface CfWorkerContext {
legacyEnv: boolean | undefined;
zone: string | undefined;
host: string | undefined;
+ routes: Route[] | undefined;
}