feat(remix-server-runtime): RRR 1.3 / 1.4 - handleDocumentRequest

integration/transition-test.ts

@@ -213,6 +213,7 @@ test.describe("rendering", () => {
     await app.goto("/");
     let responses = app.collectDataResponses();
     await app.clickLink(`/${PAGE}`);
+    await page.waitForLoadState("networkidle");
 
     expect(
       responses.map((res) => new URL(res.url()).searchParams.get("_data"))
@@ -227,6 +228,7 @@ test.describe("rendering", () => {
     await app.goto(`/${PAGE}`);
     let responses = app.collectDataResponses();
     await app.clickLink(`/${PAGE}/${CHILD}`);
+    await page.waitForLoadState("networkidle");
 
     expect(
       responses.map((res) => new URL(res.url()).searchParams.get("_data"))
@@ -244,6 +246,7 @@ test.describe("rendering", () => {
 
     await app.clickLink(`/${REDIRECT}`);
     await page.waitForURL(/\/page/);
+    await page.waitForLoadState("networkidle");
 
     expect(
       responses

packages/remix-server-runtime/data.ts

@@ -24,15 +24,20 @@ export async function callRouteAction({
   action,
   params,
   request,
+  isRemixRouterRequest,
 }: {
   loadContext: AppLoadContext;
   routeId: string;
   action?: ActionFunction;
   params: DataFunctionArgs["params"];
   request: Request;
+  isRemixRouterRequest?: boolean;
 }) {
   if (!action) {
-    let response = new Response(null, { status: 405 });
+    let response = new Response(null, {
+      status: 405,
+      statusText: "Method Not Allowed",
+    });
     response.headers.set("X-Remix-Catch", "yes");
     return response;
   }
@@ -51,6 +56,11 @@ export async function callRouteAction({
 
     if (!isRedirectResponse(error)) {
       error.headers.set("X-Remix-Catch", "yes");
+      // This needs to be thrown so @remix-run/router knows to handle it as an error
+      // and not a successful returned response
+      if (isRemixRouterRequest) {
+        throw error;
+      }
     }
     result = error;
   }
@@ -71,12 +81,14 @@ export async function callRouteLoader({
   loader,
   params,
   request,
+  isRemixRouterRequest,
 }: {
   request: Request;
   routeId: string;
   loader?: LoaderFunction;
   params: DataFunctionArgs["params"];
   loadContext: AppLoadContext;
+  isRemixRouterRequest?: boolean;
 }) {
   if (!loader) {
     throw new Error(
@@ -100,6 +112,11 @@ export async function callRouteLoader({
 
     if (!isRedirectResponse(error)) {
       error.headers.set("X-Remix-Catch", "yes");
+      // This needs to be thrown so @remix-run/router knows to handle it as an error
+      // and not a successful returned response
+      if (isRemixRouterRequest) {
+        throw error;
+      }
     }
     result = error;
   }

packages/remix-server-runtime/headers.ts

@@ -3,6 +3,7 @@ import { splitCookiesString } from "set-cookie-parser";
 import type { ServerBuild } from "./build";
 import type { ServerRoute } from "./routes";
 import type { RouteMatch } from "./routeMatching";
+import type { StaticHandlerContext } from "./router";
 
 export function getDocumentHeaders(
   build: ServerBuild,
@@ -35,6 +36,34 @@ export function getDocumentHeaders(
   }, new Headers());
 }
 
+export function getDocumentHeadersRR(
+  build: ServerBuild,
+  context: StaticHandlerContext,
+  matches: RouteMatch<ServerRoute>[]
+) {
+  return matches.reduce((parentHeaders, match, index) => {
+    let { id } = match.route;
+    let routeModule = build.routes[id].module;
+    let loaderHeaders = context.loaderHeaders?.[id] || new Headers();
+    let actionHeaders = context.actionHeaders?.[id] || new Headers();
+    let headers = new Headers(
+      routeModule.headers
+        ? typeof routeModule.headers === "function"
+          ? routeModule.headers({ loaderHeaders, parentHeaders, actionHeaders })
+          : routeModule.headers
+        : undefined
+    );
+
+    // Automatically preserve Set-Cookie headers that were set either by the
+    // loader or by a parent route.
+    prependCookies(actionHeaders, headers);
+    prependCookies(loaderHeaders, headers);
+    prependCookies(parentHeaders, headers);
+
+    return headers;
+  }, new Headers());
+}
+
 function prependCookies(parentHeaders: Headers, childHeaders: Headers): void {
   let parentSetCookieString = parentHeaders.get("Set-Cookie");
 

packages/remix-server-runtime/router/router.ts

@@ -1767,6 +1767,9 @@ export function createRouter(init: RouterInit): Router {
 //#region createStaticHandler
 ////////////////////////////////////////////////////////////////////////////////
 
+const validActionMethods = new Set(["POST", "PUT", "PATCH", "DELETE"]);
+const validRequestMethods = new Set(["GET", "HEAD", ...validActionMethods]);
+
 export function unstable_createStaticHandler(
   routes: AgnosticRouteObject[]
 ): StaticHandler {
@@ -1803,7 +1806,25 @@ export function unstable_createStaticHandler(
     let location = createLocation("", createPath(url), null, "default");
     let matches = matchRoutes(dataRoutes, location);
 
-    if (!matches) {
+    if (!validRequestMethods.has(request.method)) {
+      let {
+        matches: methodNotAllowedMatches,
+        route,
+        error,
+      } = getMethodNotAllowedMatches(dataRoutes);
+      return {
+        location,
+        matches: methodNotAllowedMatches,
+        loaderData: {},
+        actionData: null,
+        errors: {
+          [route.id]: error,
+        },
+        statusCode: error.status,
+        loaderHeaders: {},
+        actionHeaders: {},
+      };
+    } else if (!matches) {
       let {
         matches: notFoundMatches,
         route,
@@ -1817,7 +1838,7 @@ export function unstable_createStaticHandler(
         errors: {
           [route.id]: error,
         },
-        statusCode: 404,
+        statusCode: error.status,
         loaderHeaders: {},
         actionHeaders: {},
       };
@@ -1856,7 +1877,12 @@ export function unstable_createStaticHandler(
     let location = createLocation("", createPath(url), null, "default");
     let matches = matchRoutes(dataRoutes, location);
 
-    if (!matches) {
+    if (!validRequestMethods.has(request.method)) {
+      throw createRouterErrorResponse(null, {
+        status: 405,
+        statusText: "Method Not Allowed",
+      });
+    } else if (!matches) {
       throw createRouterErrorResponse(null, {
         status: 404,
         statusText: "Not Found",
@@ -1899,17 +1925,13 @@ export function unstable_createStaticHandler(
     matches: AgnosticDataRouteMatch[],
     isRouteRequest: boolean
   ): Promise<Omit<StaticHandlerContext, "location"> | Response> {
-    invariant(
-      request.method !== "HEAD",
-      "query()/queryRoute() do not support HEAD requests"
-    );
     invariant(
       request.signal,
       "query()/queryRoute() requests must contain an AbortController signal"
     );
 
     try {
-      if (request.method !== "GET") {
+      if (validActionMethods.has(request.method)) {
         let result = await submit(
           request,
           matches,
@@ -1956,7 +1978,7 @@ export function unstable_createStaticHandler(
     if (!actionMatch.route.action) {
       let href = createHref(new URL(request.url));
       if (isRouteRequest) {
-        throw createRouterErrorResponse(`No action found for [${href}]`, {
+        throw createRouterErrorResponse(null, {
           status: 405,
           statusText: "Method Not Allowed",
         });
@@ -2728,16 +2750,18 @@ function findNearestBoundary(
   );
 }
 
-function getNotFoundMatches(routes: AgnosticDataRouteObject[]): {
+function getShortCircuitMatches(
+  routes: AgnosticDataRouteObject[],
+  status: number,
+  statusText: string
+): {
   matches: AgnosticDataRouteMatch[];
   route: AgnosticDataRouteObject;
   error: ErrorResponse;
 } {
   // Prefer a root layout route if present, otherwise shim in a route object
-  let route = routes.find(
-    (r) => r.index || r.path === "" || r.path === "/"
-  ) || {
-    id: "__shim-404-route__",
+  let route = routes.find((r) => r.index || !r.path || r.path === "/") || {
+    id: `__shim-${status}-route__`,
   };
 
   return {
@@ -2750,10 +2774,18 @@ function getNotFoundMatches(routes: AgnosticDataRouteObject[]): {
       },
     ],
     route,
-    error: new ErrorResponse(404, "Not Found", null),
+    error: new ErrorResponse(status, statusText, null),
   };
 }
 
+function getNotFoundMatches(routes: AgnosticDataRouteObject[]) {
+  return getShortCircuitMatches(routes, 404, "Not Found");
+}
+
+function getMethodNotAllowedMatches(routes: AgnosticDataRouteObject[]) {
+  return getShortCircuitMatches(routes, 405, "Method Not Allowed");
+}
+
 function getMethodNotAllowedResult(path: Location | string): ErrorResult {
   let href = typeof path === "string" ? path : createHref(path);
   console.warn(
@@ -2763,11 +2795,7 @@ function getMethodNotAllowedResult(path: Location | string): ErrorResult {
   );
   return {
     type: ResultType.error,
-    error: new ErrorResponse(
-      405,
-      "Method Not Allowed",
-      `No action found for [${href}]`
-    ),
+    error: new ErrorResponse(405, "Method Not Allowed", ""),
   };
 }
 

packages/remix-server-runtime/routes.ts

@@ -75,6 +75,7 @@ export function createStaticHandlerDataRoutes(
                 routeId: route.id,
                 loader: route.module.loader,
                 loadContext,
+                isRemixRouterRequest: true,
               })
           : undefined,
         action: route.module.action
@@ -84,6 +85,7 @@ export function createStaticHandlerDataRoutes(
                 routeId: route.id,
                 action: route.module.action,
                 loadContext,
+                isRemixRouterRequest: true,
               })
           : undefined,
         handle: route.module.handle,