Properly handle falsy error values in ErrorBoundary's

.changeset/handle-falsy-errors.md

@@ -0,0 +1,5 @@
+---
+"react-router": patch
+---
+
+Properly handle falsy error values in ErrorBoundary's

packages/react-router/__tests__/data-memory-router-test.tsx

@@ -2014,6 +2014,50 @@ describe("createMemoryRouter", () => {
       }
     });
 
+    it("handles a `null` render-error", async () => {
+      let router = createMemoryRouter([
+        {
+          path: "/",
+          Component() {
+            throw null;
+          },
+          ErrorBoundary() {
+            return <pre>{useRouteError() === null ? "Yes" : "No"}</pre>;
+          },
+        },
+      ]);
+      let { container } = render(<RouterProvider router={router} />);
+
+      await waitFor(() => screen.getByText("Yes"));
+      expect(getHtml(container)).toMatch("Yes");
+    });
+
+    it("handles a `null` render-error from a defer() call", async () => {
+      let router = createMemoryRouter([
+        {
+          path: "/",
+          loader() {
+            return defer({ lazy: Promise.reject(null) });
+          },
+          Component() {
+            let data = useLoaderData() as { lazy: Promise<unknown> };
+            return (
+              <React.Suspense>
+                <Await resolve={data.lazy}>No</Await>
+              </React.Suspense>
+            );
+          },
+          ErrorBoundary() {
+            return <pre>{useRouteError() === null ? "Yes" : "No"}</pre>;
+          },
+        },
+      ]);
+      let { container } = render(<RouterProvider router={router} />);
+
+      await waitFor(() => screen.getByText("Yes"));
+      expect(getHtml(container)).toMatch("Yes");
+    });
+
     it("handles back button routing away from a child error boundary", async () => {
       let router = createMemoryRouter(
         createRoutesFromElements(

packages/react-router/lib/hooks.tsx

@@ -595,7 +595,7 @@ export class RenderErrorBoundary extends React.Component<
     // this because the error provided from the app state may be cleared without
     // the location changing.
     return {
-      error: props.error || state.error,
+      error: props.error !== undefined ? props.error : state.error,
       location: state.location,
       revalidation: props.revalidation || state.revalidation,
     };
@@ -610,7 +610,7 @@ export class RenderErrorBoundary extends React.Component<
   }
 
   render() {
-    return this.state.error ? (
+    return this.state.error !== undefined ? (
       <RouteContext.Provider value={this.props.routeContext}>
         <RouteErrorContext.Provider
           value={this.state.error}
@@ -886,7 +886,7 @@ export function useRouteError(): unknown {
 
   // If this was a render error, we put it in a RouteError context inside
   // of RenderErrorBoundary
-  if (error) {
+  if (error !== undefined) {
     return error;
   }