Avoid unnecessary console error on fetcher abort due to back-to-back …

…revalidation calls (#12050)
remix-run · Oct 1, 2024 · d5aaee4 · d5aaee4
1 parent 12c37f0
commit d5aaee4
Showing 1 changed file with 10 additions and 14 deletions.
diff --git a/packages/react-router/lib/router/router.ts b/packages/react-router/lib/router/router.ts
@@ -1968,9 +1968,7 @@ export function createRouter(init: RouterInit): Router {
     }
 
     revalidatingFetchers.forEach((rf) => {
-      if (fetchControllers.has(rf.key)) {
-        abortFetcher(rf.key);
-      }
+      abortFetcher(rf.key);
       if (rf.controller) {
         // Fetchers use an independent AbortController so that aborting a fetcher
         // (via deleteFetcher) does not abort the triggering navigation that
@@ -2011,6 +2009,7 @@ export function createRouter(init: RouterInit): Router {
         abortPendingFetchRevalidations
       );
     }
+
     revalidatingFetchers.forEach((rf) => fetchControllers.delete(rf.key));
 
     // If any loaders returned a redirect Response, start a new REPLACE navigation
@@ -2038,7 +2037,6 @@ export function createRouter(init: RouterInit): Router {
     let { loaderData, errors } = processLoaderData(
       state,
       matches,
-      matchesToLoad,
       loaderResults,
       pendingActionResult,
       revalidatingFetchers,
@@ -2107,7 +2105,8 @@ export function createRouter(init: RouterInit): Router {
     href: string | null,
     opts?: RouterFetchOptions
   ) {
-    if (fetchControllers.has(key)) abortFetcher(key);
+    abortFetcher(key);
+
     let flushSync = (opts && opts.flushSync) === true;
 
     let routesToUse = inFlightDataRoutes || dataRoutes;
@@ -2370,9 +2369,7 @@ export function createRouter(init: RouterInit): Router {
           existingFetcher ? existingFetcher.data : undefined
         );
         state.fetchers.set(staleKey, revalidatingFetcher);
-        if (fetchControllers.has(staleKey)) {
-          abortFetcher(staleKey);
-        }
+        abortFetcher(staleKey);
         if (rf.controller) {
           fetchControllers.set(staleKey, rf.controller);
         }
@@ -2438,7 +2435,6 @@ export function createRouter(init: RouterInit): Router {
     let { loaderData, errors } = processLoaderData(
       state,
       matches,
-      matchesToLoad,
       loaderResults,
       undefined,
       revalidatingFetchers,
@@ -2863,8 +2859,8 @@ export function createRouter(init: RouterInit): Router {
     fetchLoadMatches.forEach((_, key) => {
       if (fetchControllers.has(key)) {
         cancelledFetcherLoads.add(key);
-        abortFetcher(key);
       }
+      abortFetcher(key);
     });
   }
 
@@ -2941,9 +2937,10 @@ export function createRouter(init: RouterInit): Router {
 
   function abortFetcher(key: string) {
     let controller = fetchControllers.get(key);
-    invariant(controller, `Expected fetch controller: ${key}`);
-    controller.abort();
-    fetchControllers.delete(key);
+    if (controller) {
+      controller.abort();
+      fetchControllers.delete(key);
+    }
   }
 
   function markFetchersDone(keys: string[]) {
@@ -5154,7 +5151,6 @@ function processRouteLoaderData(
 function processLoaderData(
   state: RouterState,
   matches: AgnosticDataRouteMatch[],
-  matchesToLoad: AgnosticDataRouteMatch[],
   results: Record<string, DataResult>,
   pendingActionResult: PendingActionResult | undefined,
   revalidatingFetchers: RevalidatingFetcher[],