Files

1.1 KiB

Vue Router guard/history experiment

This small app compares the browser's current URL and history position with Vue Router's currentRoute while a real beforeResolve guard is pending.

Run it

From the repository root:

npm --prefix experiments/router-guard-history run dev

Open the URL printed by Vite.

Suggested tests

Forward navigation

  1. Enable Pause the next beforeResolve.
  2. Click Push Alpha.
  3. While paused, compare Browser URL with router.currentRoute.
  4. Allow or reject the navigation.

For router.push(), both values remain on the outgoing route until the guard allows confirmation.

Back navigation

  1. Push Alpha, then push Beta.
  2. Enable Pause the next beforeResolve.
  3. Click Router Back.
  4. While paused, compare Browser URL with router.currentRoute.
  5. Reject the navigation and watch the browser restore its previous history entry, or repeat the test and allow it.

The event timeline separately records the raw browser popstate, Vue Router guards, the URL, currentRoute, and the navigation result.