Skip to content

[Bug]: shouldRevalidate behaves differently on production then development #10197

@FFGFlash

Description

@FFGFlash

What version of React Router are you using?

v6.8.0 - v6.9.0

Steps to Reproduce

  1. Create Project using createBrowserRouter()
  2. Create 2 Routes
const Routes = [
  {
    path: '/',
    children: [
      {
        path: 'one',
        element: <RouteOne />
      },
      {
        path: 'two',
        action: () => {},
        loader: () => 'Hello World!',
        shouldRevalidate: ({ currentUrl, nextUrl, formAction }) => {
          console.log('current: ', currentUrl.pathname)
          console.log('next: ', nextUrl.pathname)
          console.log('action: ', formAction)
          const shouldRevalidate = currentUrl.pathname !== nextUrl.pathname || currentUrl.pathname === formAction
          console.log('shouldRevalidate: ', shouldRevalidate )
          return shouldRevalidate 
        }
      }
    ]
  }
]

const Router = createBrowserRouter(Routes)
  1. Create two fetchers on route one
function RouteOne() {
  const loaderFetcher = useFetcher();
  const actionFetcher = useFetcher();

  useEffect(() => {
    if (loaderFetcher .data || loaderFetcher .state !== "idle") return;
    loaderFetcher .load("/two");
  }, [loaderFetcher ]);

  const handleSomeAction = actionFetcher.submit(
    { data: "some data" },
    { action: "/two", method: "post" }
  );

  return (
    <>
      <div>{fetcher.data || "Loading..."}</div>
      <button onClick={handleSomeAction}>Some Action</button>
    </>
  );
}

Expected Behavior (v6.7.0)

Expected behavior is that when we use the actionFetcher to submit to '/two' it should revalidate the loaderFetcher given the rules of shouldRevalidate. currentUrl.pathname !== nextUrl.pathname should revalidate due to navigation of children routes and currentUrl.pathname === formAction should revalidate when the action function is called on the given route.

In the given steps to reproduce the expected result looks something like the following

current: /two
next: /two
action: /two
shouldRevalidate: true

Actual Behavior (v6.8.0 - v6.9.0)

In the versions 6.8.0 to 6.9.0 (currently latest), the currentUrl and nextUrl instead give the pathname of the rendered route instead of the route corresponding to the action and loader.

Results:

current: /one
next: /one
action: /two
shouldRevalidate: false

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions