How to resolve act(...) errors in components containing Link

[len0105]

Hi,

use @tanstack/react-location: "3.7.4"

(I used DeepL)
I was trying to write a test for a component that contains a Link and I got an act(...) error in the Router.
I would like to know your solution🙏

https://codesandbox.io/s/goofy-glade-e3te67?file=/src/LinkBox.test.tsx

function LinkBox(props: Props) {
  const { text, linkTo } = props;

  return <Link to={linkTo}>{text}</Link>;
}

test("getLinkCompornents", async () => {
  const props = {
    text: "go to hoge",
    linkTo: "/hogehoge"
  };

  const routes = [
    { path: "/", element: <Top /> },
    {
      path: "hoge",
      element: <Hoge />
    }
  ];

  render(
    <Router location={location} routes={routes}>
      <LinkBox {...props} />
    </Router>
  );

  await screen.findByText("go to hoge");
});

console.error
  Warning: An update to Router inside a test was not wrapped in act(...).
    
  When testing, code that causes React state updates should be wrapped into act(...):
    
  act(() => {
    /* fire events that update state */
  });
  /* assert on the output */
    
  This ensures that you're testing the behavior the user would see in the browser. Learn more at https://reactjs.org/link/wrap-tests-with-act
      at Router (hogehoge/node_modules/@tanstack/react-location/src/index.tsx:492:3)