Fix hash issue for matchRoutes optimization (#13108)

Author: brophdawg11

.changeset/witty-birds-fetch.md

@@ -0,0 +1,5 @@
+---
+"@remix-run/router": patch
+---
+
+Fix regression introduced in `6.29.0` via [#12169](https://github.com/remix-run/react-router/pull/12169) that caused issues navigating to hash routes inside splat routes for applications using Lazy Route Discovery (`patchRoutesOnNavigation`)

packages/router/__tests__/navigation-test.ts

@@ -1,5 +1,5 @@
 import type { HydrationState } from "../index";
-import { json } from "../index";
+import { createMemoryHistory, createRouter, json } from "../index";
 import { cleanup, setup } from "./utils/data-router-setup";
 import { createFormData } from "./utils/utils";
 
@@ -434,6 +434,47 @@ describe("navigations", () => {
       });
     });
 
+    it("does not use fog of war partial matches for hash change only navigations", async () => {
+      let router = createRouter({
+        history: createMemoryHistory(),
+        routes: [
+          {
+            path: "/",
+            children: [
+              {
+                path: "*",
+              },
+            ],
+          },
+        ],
+        // This is what enables the partialMatches logic
+        patchRoutesOnNavigation: () => {},
+      }).initialize();
+      expect(router.state.location).toMatchObject({
+        pathname: "/",
+        hash: "",
+      });
+      expect(router.state.matches).toMatchObject([{ route: { path: "/" } }]);
+      await router.navigate("/foo");
+      expect(router.state.location).toMatchObject({
+        pathname: "/foo",
+        hash: "",
+      });
+      expect(router.state.matches).toMatchObject([
+        { route: { path: "/" } },
+        { route: { path: "*" } },
+      ]);
+      await router.navigate("/foo#bar");
+      expect(router.state.location).toMatchObject({
+        pathname: "/foo",
+        hash: "#bar",
+      });
+      expect(router.state.matches).toMatchObject([
+        { route: { path: "/" } },
+        { route: { path: "*" } },
+      ]);
+    });
+
     it("redirects from loaders (throw)", async () => {
       let t = initializeTest();
 

packages/router/router.ts

@@ -1534,6 +1534,23 @@ export function createRouter(init: RouterInit): Router {
         : matchRoutes(routesToUse, location, basename);
     let flushSync = (opts && opts.flushSync) === true;
 
+    // Short circuit if it's only a hash change and not a revalidation or
+    // mutation submission.
+    //
+    // Ignore on initial page loads because since the initial hydration will always
+    // be "same hash".  For example, on /page#hash and submit a <Form method="post">
+    // which will default to a navigation to /page
+    if (
+      matches &&
+      state.initialized &&
+      !isRevalidationRequired &&
+      isHashChangeOnly(state.location, location) &&
+      !(opts && opts.submission && isMutationMethod(opts.submission.formMethod))
+    ) {
+      completeNavigation(location, { matches }, { flushSync });
+      return;
+    }
+
     let fogOfWar = checkFogOfWar(matches, routesToUse, location.pathname);
     if (fogOfWar.active && fogOfWar.matches) {
       matches = fogOfWar.matches;
@@ -1558,22 +1575,6 @@ export function createRouter(init: RouterInit): Router {
       return;
     }
 
-    // Short circuit if it's only a hash change and not a revalidation or
-    // mutation submission.
-    //
-    // Ignore on initial page loads because since the initial hydration will always
-    // be "same hash".  For example, on /page#hash and submit a <Form method="post">
-    // which will default to a navigation to /page
-    if (
-      state.initialized &&
-      !isRevalidationRequired &&
-      isHashChangeOnly(state.location, location) &&
-      !(opts && opts.submission && isMutationMethod(opts.submission.formMethod))
-    ) {
-      completeNavigation(location, { matches }, { flushSync });
-      return;
-    }
-
     // Create a controller/Request for this navigation
     pendingNavigationController = new AbortController();
     let request = createClientSideRequest(