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

useLocation() got triggered twice when we call navigate(-1) #114

Open
billy-onggo opened this issue Dec 4, 2023 · 0 comments
Open

useLocation() got triggered twice when we call navigate(-1) #114

billy-onggo opened this issue Dec 4, 2023 · 0 comments

Comments

@billy-onggo
Copy link

I encountered inconsistency on useLocation hook when programmatically navigating routes via navigate(-1) compared to history.back(-1) or hitting the browser's back button.

Is this intented? Given the current documentation states:

navigate(-1) is equivalent to hitting the back button in your browser
https://github.com/mefechoel/svelte-navigator/tree/main#parameters-1

Steps to reproduce:

  • Create nested routes within the application
  • On the parent route, create location instance of useLocation. Subscribe to the instance.
  • Navigate to any child route
  • Navigate back (programmatically) using navigate(-1)
  • Observe the useLocation() hook behavior, notice two value changes in the location instance:
    • The initial value represents the origin route.
    • The subsequent value indicates the target route.

Expected Behaviour
The navigate(-1) method should trigger the location change only once

Note:

  • Direct usage of history.go(-1) triggered the location change only once.
  • Similar results were observed when utilizing the browser's Back button.

Sample Code

<script lang="ts">
  import { Route, useNavigate, useLocation } from "svelte-navigator";
  const navigate = useNavigate()

  const location = useLocation();
  location.subscribe((l) => console.log(l))
</script>

<div>
  <h2>My Nested Route, using navigate</h2>
  <div>
    <button on:click={()=> navigate('one')}>one</button>
    <button on:click={()=> navigate('two')}>two</button>
    <button on:click={()=> navigate(-1)}>BACK</button>
    <button on:click={()=> navigate(1)}>FORWARD</button>
  </div>
  <div>
    <Route path="/one" primary={false}>Page One</Route>
    <Route path="/two" primary={false}>Page Two</Route>
  </div>
</div>

Screenshots
image

Desktop

  • OS: Linux, Ubuntu 22.04
  • Browser: observed in both Firefox and Brave
@billy-onggo billy-onggo changed the title useLocation() got fired twice when we call navigate(-1) useLocation() got triggered twice when we call navigate(-1) Dec 4, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant