Route doesn't get rendered when calling `navigate()`

Code:

<script lang="ts">
  import { Route, Router, navigate } from "svelte-routing";
</script>

<main>
  <button on:click={() => navigate("/")}>Home</button>
  <button on:click={() => navigate("/foo")}>Foo</button>
  <button on:click={() => navigate("/bar")}>Bar</button>
  <Router>
    <Route path="/foo">Foo</Route>
    <Route path="/bar">Bar</Route>
    <Route>Home</Route>
  </Router>
</main>

<style>
</style>

Here, the Route corresponding to the browser url at the time of page load is correctly rendered. When clicking any of the buttons, browser url changes, but the Router still renders the old Route. Hitting F5 or entering the url in browser address bar and hitting enter causes the Route to be rendered correctly.

Minimal repro: https://codesandbox.io/s/distracted-star-uhss6?file=/src/App.svelte:0-410

[itsfarseen]

I went further down the rabbit hole and looks like this is a Vite dev server bug. https://github.com/vitejs/vite/issues/3155#issuecomment-826942131

Closing 😃

[marcus-wishes]

Also using the globalHistory doesn’t work for me in Vite. When I attach a listener to react on route changes it never gets called. It works for me using Rollup. I was unable to yet figure out why.