Fix up E2E tests

Author: brophdawg11

.changeset/client-context.md

@@ -0,0 +1,10 @@
+---
+"react-router": patch
+---
+
+Add `context` support to client side data routers (unstable)
+
+- Library mode
+  - `createBrowserRouter(routes, { unstable_context })`
+- Framework mode
+  - `<HydratedRouter unstable_context>`

.changeset/middleware.md

@@ -1,8 +1,8 @@
 ---
-"react-router": minor
+"react-router": patch
 ---
 
-Support `middleware` on routes
+Support `middleware` on routes (unstable)
 
 Routes can now define a `middleware` property accepting an array of functions that will run sequentially before route loader run in parallel. These functions accept the same arguments as `loader`/`action` and an additional `next` function to run the remaining data pipeline. This allows middlewares to perform logic before and after loaders/actions execute.
 

integration/error-data-request-test.ts

@@ -112,14 +112,7 @@ test.describe("ErrorBoundary", () => {
     );
     expect(status).toBe(200);
     expect(headers.has("X-Remix-Error")).toBe(false);
-    expect(data).toEqual({
-      root: {
-        data: null,
-      },
-      "routes/_index": {
-        data: null,
-      },
-    });
+    expect(data).toEqual({});
   });
 
   test("returns a 405 on a data fetch POST to a path with no action", async () => {

integration/error-sanitization-test.ts

@@ -232,9 +232,6 @@ test.describe("Error Sanitization", () => {
     test("returns data without errors", async () => {
       let { data } = await fixture.requestSingleFetchData("/_root.data");
       expect(data).toEqual({
-        root: {
-          data: null,
-        },
         "routes/_index": {
           data: "LOADER",
         },
@@ -244,9 +241,6 @@ test.describe("Error Sanitization", () => {
     test("sanitizes loader errors in data requests", async () => {
       let { data } = await fixture.requestSingleFetchData("/_root.data?loader");
       expect(data).toEqual({
-        root: {
-          data: null,
-        },
         "routes/_index": {
           error: new Error("Unexpected Server Error"),
         },
@@ -392,9 +386,6 @@ test.describe("Error Sanitization", () => {
     test("returns data without errors", async () => {
       let { data } = await fixture.requestSingleFetchData("/_root.data");
       expect(data).toEqual({
-        root: {
-          data: null,
-        },
         "routes/_index": {
           data: "LOADER",
         },
@@ -404,9 +395,6 @@ test.describe("Error Sanitization", () => {
     test("does not sanitize loader errors in data requests", async () => {
       let { data } = await fixture.requestSingleFetchData("/_root.data?loader");
       expect(data).toEqual({
-        root: {
-          data: null,
-        },
         "routes/_index": {
           error: new Error("Loader Error"),
         },
@@ -640,9 +628,6 @@ test.describe("Error Sanitization", () => {
     test("returns data without errors", async () => {
       let { data } = await fixture.requestSingleFetchData("/_root.data");
       expect(data).toEqual({
-        root: {
-          data: null,
-        },
         "routes/_index": {
           data: "LOADER",
         },
@@ -652,8 +637,9 @@ test.describe("Error Sanitization", () => {
     test("sanitizes loader errors in data requests", async () => {
       let { data } = await fixture.requestSingleFetchData("/_root.data?loader");
       expect(data).toEqual({
-        root: { data: null },
-        "routes/_index": { error: new Error("Unexpected Server Error") },
+        "routes/_index": {
+          error: new Error("Unexpected Server Error"),
+        },
       });
       expect(errorLogs[0][0]).toEqual("App Specific Error Logging:");
       expect(errorLogs[1][0]).toEqual(

integration/vite-dot-server-test.ts

@@ -142,7 +142,7 @@ test.describe("Vite / route / server-only module referenced by client", () => {
         `    '${specifier}' imported by route 'app/routes/_index.tsx'`,
 
         "  React Router automatically removes server-code from these exports:",
-        "    `loader`, `action`, `headers`",
+        "    `loader`, `action`, `middleware`, `headers`",
 
         `  But other route exports in 'app/routes/_index.tsx' depend on '${specifier}'.`,
 

integration/vite-prerender-test.ts

@@ -414,9 +414,6 @@ test.describe("Prerendering", () => {
 
     let dataRes = await fixture.requestSingleFetchData("/json.json.data");
     expect(dataRes.data).toEqual({
-      root: {
-        data: null,
-      },
       "routes/json[.json]": {
         data: {
           hello: "world",
@@ -429,9 +426,6 @@ test.describe("Prerendering", () => {
 
     dataRes = await fixture.requestSingleFetchData("/text.txt.data");
     expect(dataRes.data).toEqual({
-      root: {
-        data: null,
-      },
       "routes/text[.txt]": {
         data: "Hello, world",
       },

packages/react-router/lib/server-runtime/server.ts

@@ -498,6 +498,17 @@ async function handleResourceRequest(
       return errorResponseToJson(error, serverMode);
     }
 
+    if (
+      error instanceof Error &&
+      error.message === "Expected a response from queryRoute"
+    ) {
+      let newError = new Error(
+        "Expected a Response to be returned from resource route handler"
+      );
+      handleError(newError);
+      return returnLastResortErrorResponse(newError, serverMode);
+    }
+
     handleError(error);
     return returnLastResortErrorResponse(error, serverMode);
   }

packages/react-router/lib/server-runtime/single-fetch.ts

@@ -114,7 +114,7 @@ export async function singleFetchAction(
       },
     });
 
-    invariant(isResponse(result), " Expected a Response from query()");
+    invariant(isResponse(result), "Expected a Response from query()");
 
     // Unlike `handleDataRequest`, when singleFetch is enabled, query does
     // let non-Response return values through
@@ -197,19 +197,26 @@ export async function singleFetchLoaders(
         // Aggregate results based on the matches we intended to load since we get
         // `null` values back in `context.loaderData` for routes we didn't load
         let results: SingleFetchResults = {};
-        let loadedMatches = context.matches.filter(
-          (m) =>
-            m.route.loader && (!loadRouteIds || loadRouteIds.has(m.route.id))
+        let loadedMatches = new Set(
+          context.matches
+            .filter((m) =>
+              loadRouteIds
+                ? loadRouteIds.has(m.route.id)
+                : m.route.loader != null
+            )
+            .map((m) => m.route.id)
         );
 
-        loadedMatches.forEach((m) => {
-          let { id } = m.route;
-          if (context.errors && context.errors.hasOwnProperty(id)) {
-            results[id] = { error: context.errors[id] };
-          } else if (context.loaderData.hasOwnProperty(id)) {
-            results[id] = { data: context.loaderData[id] };
+        if (context.errors) {
+          for (let [id, error] of Object.entries(context.errors)) {
+            results[id] = { error };
           }
-        });
+        }
+        for (let [id, data] of Object.entries(context.loaderData)) {
+          if (!(id in results) && loadedMatches.has(id)) {
+            results[id] = { data };
+          }
+        }
 
         return generateSingleFetchResponse(request, build, serverMode, {
           result: results,
@@ -219,7 +226,7 @@ export async function singleFetchLoaders(
       },
     });
 
-    invariant(isResponse(result), " Expected a Response from query()");
+    invariant(isResponse(result), "Expected a Response from query()");
 
     if (isRedirectResponse(result)) {
       return generateSingleFetchResponse(request, build, serverMode, {