@remix-run/router 1.8.0 → 1.9.0-pre.0

package/dist/utils.d.ts

@@ -144,6 +144,23 @@ export interface LoaderFunction {
 export interface ActionFunction {
     (args: ActionFunctionArgs): Promise<DataFunctionValue> | DataFunctionValue;
 }
+/**
+ * Arguments passed to shouldRevalidate function
+ */
+export interface ShouldRevalidateFunctionArgs {
+    currentUrl: URL;
+    currentParams: AgnosticDataRouteMatch["params"];
+    nextUrl: URL;
+    nextParams: AgnosticDataRouteMatch["params"];
+    formMethod?: Submission["formMethod"];
+    formAction?: Submission["formAction"];
+    formEncType?: Submission["formEncType"];
+    text?: Submission["text"];
+    formData?: Submission["formData"];
+    json?: Submission["json"];
+    actionResult?: any;
+    defaultShouldRevalidate: boolean;
+}
 /**
  * Route shouldRevalidate function signature.  This runs after any submission
  * (navigation or fetcher), so we flatten the navigation/fetcher submission
@@ -152,20 +169,7 @@ export interface ActionFunction {
  * have to re-run based on the data models that were potentially mutated.
  */
 export interface ShouldRevalidateFunction {
-    (args: {
-        currentUrl: URL;
-        currentParams: AgnosticDataRouteMatch["params"];
-        nextUrl: URL;
-        nextParams: AgnosticDataRouteMatch["params"];
-        formMethod?: Submission["formMethod"];
-        formAction?: Submission["formAction"];
-        formEncType?: Submission["formEncType"];
-        text?: Submission["text"];
-        formData?: Submission["formData"];
-        json?: Submission["json"];
-        actionResult?: DataResult;
-        defaultShouldRevalidate: boolean;
-    }): boolean;
+    (args: ShouldRevalidateFunctionArgs): boolean;
 }
 /**
  * Function provided by the framework-aware layers to set `hasErrorBoundary`
@@ -462,14 +466,15 @@ export declare const redirectDocument: RedirectFunction;
  * @private
  * Utility class we use to hold auto-unwrapped 4xx/5xx Response bodies
  */
-export declare class ErrorResponse {
+export declare class ErrorResponseImpl {
     status: number;
     statusText: string;
     data: any;
-    error?: Error;
-    internal: boolean;
+    private error?;
+    private internal;
     constructor(status: number, statusText: string | undefined, data: any, internal?: boolean);
 }
+export type ErrorResponse = InstanceType<typeof ErrorResponseImpl>;
 /**
  * Check if the given error is an ErrorResponse generated from a 4xx/5xx
  * Response thrown from an action/loader

package/index.ts

@@ -9,12 +9,12 @@ export type {
   AgnosticNonIndexRouteObject,
   AgnosticRouteMatch,
   AgnosticRouteObject,
-  LazyRouteFunction,
-  TrackedPromise,
+  ErrorResponse,
   FormEncType,
   FormMethod,
   HTMLFormMethod,
   JsonFunction,
+  LazyRouteFunction,
   LoaderFunction,
   LoaderFunctionArgs,
   ParamParseKey,
@@ -23,12 +23,13 @@ export type {
   PathPattern,
   RedirectFunction,
   ShouldRevalidateFunction,
+  ShouldRevalidateFunctionArgs,
+  TrackedPromise,
   V7_FormMethod,
 } from "./utils";
 
 export {
   AbortedDeferredError,
-  ErrorResponse,
   defer,
   generatePath,
   getToPathname,
@@ -62,9 +63,9 @@ export type {
 export {
   Action,
   createBrowserHistory,
-  createPath,
   createHashHistory,
   createMemoryHistory,
+  createPath,
   parsePath,
 } from "./history";
 
@@ -81,6 +82,7 @@ export * from "./router";
 export type { RouteManifest as UNSAFE_RouteManifest } from "./utils";
 export {
   DeferredData as UNSAFE_DeferredData,
+  ErrorResponseImpl as UNSAFE_ErrorResponseImpl,
   convertRoutesToDataRoutes as UNSAFE_convertRoutesToDataRoutes,
   getPathContributingMatches as UNSAFE_getPathContributingMatches,
 } from "./utils";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remix-run/router",
-  "version": "1.8.0",
+  "version": "1.9.0-pre.0",
   "description": "Nested/Data-driven/Framework-agnostic Routing",
   "keywords": [
     "remix",

package/router.ts

@@ -8,34 +8,34 @@ import {
   warning,
 } from "./history";
 import type {
-  DataResult,
-  DeferredData,
+  ActionFunction,
   AgnosticDataRouteMatch,
   AgnosticDataRouteObject,
+  AgnosticRouteMatch,
+  AgnosticRouteObject,
+  DataResult,
+  DeferredData,
   DeferredResult,
+  DetectErrorBoundaryFunction,
   ErrorResult,
   FormEncType,
   FormMethod,
-  DetectErrorBoundaryFunction,
+  HTMLFormMethod,
+  ImmutableRouteKey,
+  LoaderFunction,
+  MapRoutePropertiesFunction,
+  MutationFormMethod,
   RedirectResult,
   RouteData,
-  AgnosticRouteObject,
+  RouteManifest,
+  ShouldRevalidateFunctionArgs,
   Submission,
   SuccessResult,
-  AgnosticRouteMatch,
-  ShouldRevalidateFunction,
-  RouteManifest,
-  ImmutableRouteKey,
-  ActionFunction,
-  LoaderFunction,
-  V7_MutationFormMethod,
   V7_FormMethod,
-  HTMLFormMethod,
-  MutationFormMethod,
-  MapRoutePropertiesFunction,
+  V7_MutationFormMethod,
 } from "./utils";
 import {
-  ErrorResponse,
+  ErrorResponseImpl,
   ResultType,
   convertRoutesToDataRoutes,
   getPathContributingMatches,
@@ -526,7 +526,6 @@ type FetcherStates<TData = any> = {
     formData: undefined;
     json: undefined;
     data: TData | undefined;
-    " _hasFetcherDoneAnything "?: boolean;
   };
   Loading: {
     state: "loading";
@@ -537,7 +536,6 @@ type FetcherStates<TData = any> = {
     formData: Submission["formData"] | undefined;
     json: Submission["json"] | undefined;
     data: TData | undefined;
-    " _hasFetcherDoneAnything "?: boolean;
   };
   Submitting: {
     state: "submitting";
@@ -548,7 +546,6 @@ type FetcherStates<TData = any> = {
     formData: Submission["formData"];
     json: Submission["json"];
     data: TData | undefined;
-    " _hasFetcherDoneAnything "?: boolean;
   };
 };
 
@@ -1229,7 +1226,7 @@ export function createRouter(init: RouterInit): Router {
       submission?: Submission;
       fetcherSubmission?: Submission;
       overrideNavigation?: Navigation;
-      pendingError?: ErrorResponse;
+      pendingError?: ErrorResponseImpl;
       startUninterruptedRevalidation?: boolean;
       preventScrollReset?: boolean;
       replace?: boolean;
@@ -1786,8 +1783,7 @@ export function createRouter(init: RouterInit): Router {
         updateState({ fetchers: new Map(state.fetchers) });
 
         return startRedirectNavigation(state, actionResult, {
-          submission,
-          isFetchActionRedirect: true,
+          fetcherSubmission: submission,
         });
       }
     }
@@ -2086,27 +2082,21 @@ export function createRouter(init: RouterInit): Router {
     redirect: RedirectResult,
     {
       submission,
+      fetcherSubmission,
       replace,
-      isFetchActionRedirect,
     }: {
       submission?: Submission;
+      fetcherSubmission?: Submission;
       replace?: boolean;
-      isFetchActionRedirect?: boolean;
     } = {}
   ) {
     if (redirect.revalidate) {
       isRevalidationRequired = true;
     }
 
-    let redirectLocation = createLocation(
-      state.location,
-      redirect.location,
-      // TODO: This can be removed once we get rid of useTransition in Remix v2
-      {
-        _isRedirect: true,
-        ...(isFetchActionRedirect ? { _isFetchActionRedirect: true } : {}),
-      }
-    );
+    let redirectLocation = createLocation(state.location, redirect.location, {
+      _isRedirect: true,
+    });
     invariant(
       redirectLocation,
       "Expected a location on the redirect navigation"
@@ -2146,12 +2136,21 @@ export function createRouter(init: RouterInit): Router {
 
     // Use the incoming submission if provided, fallback on the active one in
     // state.navigation
-    let activeSubmission =
-      submission || getSubmissionFromNavigation(state.navigation);
+    let { formMethod, formAction, formEncType } = state.navigation;
+    if (
+      !submission &&
+      !fetcherSubmission &&
+      formMethod &&
+      formAction &&
+      formEncType
+    ) {
+      submission = getSubmissionFromNavigation(state.navigation);
+    }
 
     // If this was a 307/308 submission we want to preserve the HTTP method and
     // re-submit the GET/POST/PUT/PATCH/DELETE as a submission navigation to the
     // redirected location
+    let activeSubmission = submission || fetcherSubmission;
     if (
       redirectPreserveMethodStatusCodes.has(redirect.status) &&
       activeSubmission &&
@@ -2165,23 +2164,17 @@ export function createRouter(init: RouterInit): Router {
         // Preserve this flag across redirects
         preventScrollReset: pendingPreventScrollReset,
       });
-    } else if (isFetchActionRedirect) {
-      // For a fetch action redirect, we kick off a new loading navigation
-      // without the fetcher submission, but we send it along for shouldRevalidate
-      await startNavigation(redirectHistoryAction, redirectLocation, {
-        overrideNavigation: getLoadingNavigation(redirectLocation),
-        fetcherSubmission: activeSubmission,
-        // Preserve this flag across redirects
-        preventScrollReset: pendingPreventScrollReset,
-      });
     } else {
-      // If we have a submission, we will preserve it through the redirect navigation
+      // If we have a navigation submission, we will preserve it through the
+      // redirect navigation
       let overrideNavigation = getLoadingNavigation(
         redirectLocation,
-        activeSubmission
+        submission
       );
       await startNavigation(redirectHistoryAction, redirectLocation, {
         overrideNavigation,
+        // Send fetcher submissions through for shouldRevalidate
+        fetcherSubmission,
         // Preserve this flag across redirects
         preventScrollReset: pendingPreventScrollReset,
       });
@@ -2850,7 +2843,9 @@ export function createStaticHandler(
 
       if (request.signal.aborted) {
         let method = isRouteRequest ? "queryRoute" : "query";
-        throw new Error(`${method}() call aborted`);
+        throw new Error(
+          `${method}() call aborted: ${request.method} ${request.url}`
+        );
       }
     }
 
@@ -3018,7 +3013,9 @@ export function createStaticHandler(
 
     if (request.signal.aborted) {
       let method = isRouteRequest ? "queryRoute" : "query";
-      throw new Error(`${method}() call aborted`);
+      throw new Error(
+        `${method}() call aborted: ${request.method} ${request.url}`
+      );
     }
 
     // Process and commit output from loaders
@@ -3172,7 +3169,7 @@ function normalizeNavigateOptions(
 ): {
   path: string;
   submission?: Submission;
-  error?: ErrorResponse;
+  error?: ErrorResponseImpl;
 } {
   // Return location verbatim on non-submission navigations
   if (!opts || !isSubmissionNavigation(opts)) {
@@ -3513,7 +3510,7 @@ function isNewRouteInstance(
 
 function shouldRevalidateLoader(
   loaderMatch: AgnosticDataRouteMatch,
-  arg: Parameters<ShouldRevalidateFunction>[0]
+  arg: ShouldRevalidateFunctionArgs
 ) {
   if (loaderMatch.route.shouldRevalidate) {
     let routeChoice = loaderMatch.route.shouldRevalidate(arg);
@@ -3643,10 +3640,19 @@ async function callLoaderOrAction(
     if (match.route.lazy) {
       if (handler) {
         // Run statically defined handler in parallel with lazy()
+        let handlerError;
         let values = await Promise.all([
-          runHandler(handler),
+          // If the handler throws, don't let it immediately bubble out,
+          // since we need to let the lazy() execution finish so we know if this
+          // route has a boundary that can handle the error
+          runHandler(handler).catch((e) => {
+            handlerError = e;
+          }),
           loadLazyRouteModule(match.route, mapRouteProperties, manifest),
         ]);
+        if (handlerError) {
+          throw handlerError;
+        }
         result = values[0];
       } else {
         // Load lazy route module, then run any returned handler
@@ -3774,7 +3780,7 @@ async function callLoaderOrAction(
     if (resultType === ResultType.error) {
       return {
         type: resultType,
-        error: new ErrorResponse(status, result.statusText, data),
+        error: new ErrorResponseImpl(status, result.statusText, data),
         headers: result.headers,
       };
     }
@@ -4139,7 +4145,7 @@ function getInternalRouterError(
     }
   }
 
-  return new ErrorResponse(
+  return new ErrorResponseImpl(
     status || 500,
     statusText,
     new Error(errorMessage),
@@ -4462,7 +4468,6 @@ function getLoadingFetcher(
       json: submission.json,
       text: submission.text,
       data,
-      " _hasFetcherDoneAnything ": true,
     };
     return fetcher;
   } else {
@@ -4475,7 +4480,6 @@ function getLoadingFetcher(
       json: undefined,
       text: undefined,
       data,
-      " _hasFetcherDoneAnything ": true,
     };
     return fetcher;
   }
@@ -4494,7 +4498,6 @@ function getSubmittingFetcher(
     json: submission.json,
     text: submission.text,
     data: existingFetcher ? existingFetcher.data : undefined,
-    " _hasFetcherDoneAnything ": true,
   };
   return fetcher;
 }
@@ -4509,7 +4512,6 @@ function getDoneFetcher(data: Fetcher["data"]): FetcherStates["Idle"] {
     json: undefined,
     text: undefined,
     data,
-    " _hasFetcherDoneAnything ": true,
   };
   return fetcher;
 }

package/utils.ts

@@ -1,5 +1,5 @@
 import type { Location, Path, To } from "./history";
-import { warning, invariant, parsePath } from "./history";
+import { invariant, parsePath, warning } from "./history";
 
 /**
  * Map of routeId -> data returned from a loader/action/error
@@ -174,6 +174,24 @@ export interface ActionFunction {
   (args: ActionFunctionArgs): Promise<DataFunctionValue> | DataFunctionValue;
 }
 
+/**
+ * Arguments passed to shouldRevalidate function
+ */
+export interface ShouldRevalidateFunctionArgs {
+  currentUrl: URL;
+  currentParams: AgnosticDataRouteMatch["params"];
+  nextUrl: URL;
+  nextParams: AgnosticDataRouteMatch["params"];
+  formMethod?: Submission["formMethod"];
+  formAction?: Submission["formAction"];
+  formEncType?: Submission["formEncType"];
+  text?: Submission["text"];
+  formData?: Submission["formData"];
+  json?: Submission["json"];
+  actionResult?: any;
+  defaultShouldRevalidate: boolean;
+}
+
 /**
  * Route shouldRevalidate function signature.  This runs after any submission
  * (navigation or fetcher), so we flatten the navigation/fetcher submission
@@ -182,20 +200,7 @@ export interface ActionFunction {
  * have to re-run based on the data models that were potentially mutated.
  */
 export interface ShouldRevalidateFunction {
-  (args: {
-    currentUrl: URL;
-    currentParams: AgnosticDataRouteMatch["params"];
-    nextUrl: URL;
-    nextParams: AgnosticDataRouteMatch["params"];
-    formMethod?: Submission["formMethod"];
-    formAction?: Submission["formAction"];
-    formEncType?: Submission["formEncType"];
-    text?: Submission["text"];
-    formData?: Submission["formData"];
-    json?: Submission["json"];
-    actionResult?: DataResult;
-    defaultShouldRevalidate: boolean;
-  }): boolean;
+  (args: ShouldRevalidateFunctionArgs): boolean;
 }
 
 /**
@@ -1500,12 +1505,12 @@ export const redirectDocument: RedirectFunction = (url, init) => {
  * @private
  * Utility class we use to hold auto-unwrapped 4xx/5xx Response bodies
  */
-export class ErrorResponse {
+export class ErrorResponseImpl {
   status: number;
   statusText: string;
   data: any;
-  error?: Error;
-  internal: boolean;
+  private error?: Error;
+  private internal: boolean;
 
   constructor(
     status: number,
@@ -1525,6 +1530,11 @@ export class ErrorResponse {
   }
 }
 
+// We don't want the class exported since usage of it at runtime is an
+// implementation detail, but we do want to export the shape so folks can
+// build their own abstractions around instances via isRouteErrorResponse()
+export type ErrorResponse = InstanceType<typeof ErrorResponseImpl>;
+
 /**
  * Check if the given error is an ErrorResponse generated from a 4xx/5xx
  * Response thrown from an action/loader