Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

shouldRevalidate is not honored when the future is passed to createMemoryRouter #10274

Open
JesusTheHun opened this issue Nov 26, 2024 · 0 comments

Comments

@JesusTheHun
Copy link

JesusTheHun commented Nov 26, 2024

Hi there 👋 I'm the maintainer of storybook-addon-remix-react-router.

When working on the new future flag ( JesusTheHun/storybook-addon-remix-react-router#76 ), one of my test stopped working after setting the said flag.

Not sure if this is an expected behavior, given there is a v7_fetcherPersist flag, so I have to check with you guys.

So basically the question boils down to : when shouldRevalidate returns false and v7_fetcherPersist is left unset but the future property is set, is it normal that the loader is called again ?
Setting v7_fetcherPersist: true along with shouldRevalidate() => false restores the previous behavior.

Reproduction

Link to the repo : https://github.com/JesusTheHun/storybook-addon-remix-react-router/blob/11132084dfa09d929ea09770963f17e17ddee6d1/src/stories/v2/v2Stories.spec.tsx#L249

The test below passes when the createMemoryRouter does not receive the future argument, but fails when it does. Even if the future object is empty.

// Story
export const RouteShouldNotRevalidate = {
  render: () => {
    const location = useLocation();

    return (
      <div>
        {location.search}
        <div>
          <Link to={{ search: '?foo=bar' }}>Add Search Param</Link>
        </div>
      </div>
    );
  },
  parameters: {
    reactRouter: reactRouterParameters({
      routing: {
        loader: loader('Should not appear again after search param is added'),
        shouldRevalidate: () => false,
      },
    }),
  },
};

// Test
it('should not revalidate the route data', async () => {
  const { RouteShouldNotRevalidate } = composeStories(LoaderStories);
  invariant(RouteShouldNotRevalidate.parameters);

  const loader = vi.fn(() => 'Yo');

  RouteShouldNotRevalidate.parameters.reactRouter.routing.loader = loader;

  render(<RouteShouldNotRevalidate />);

  await waitFor(() => expect(loader).toHaveBeenCalledOnce());

  const user = userEvent.setup();
  await user.click(screen.getByRole('link'));

  screen.getByText('?foo=bar');

  expect(loader).toHaveBeenCalledOnce();
});

System Info

System:
    OS: macOS 15.1.1
    CPU: (12) arm64 Apple M2 Max
    Memory: 32.17 GB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.20.4 - ~/.nvm/versions/node/v18.20.4/bin/node
    npm: 10.7.0 - ~/.nvm/versions/node/v18.20.4/bin/npm
    bun: 1.0.14 - ~/.bun/bin/bun
  Browsers:
    Chrome: 131.0.6778.86
    Edge: 131.0.2903.63
    Safari: 18.1.1
  npmPackages:
    @remix-run/router: ^1.3.3 => 1.15.2 
    @remix-run/web-fetch: ^4.3.2 => 4.4.2 
    vite: ^4.3.9 => 4.5.2

Used Package Manager

npm

Expected Behavior

The loader should not be called twice

Actual Behavior

The loader is called twice

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant