solidjs / solid-router

A universal router for Solid inspired by Ember and React Router
MIT License
1.11k stars 138 forks source link

`useLocation().state` does not get updated on history back #396

Closed r-Larch closed 2 months ago

r-Larch commented 4 months ago

Describe the bug

When navigating to a route with state object the route correctly sees the state but when navigating back the location.state will not update.

Your Example Website or App

https://stackblitz.com/edit/solidjs-templates-o9qpzf?file=src%2Findex.tsx

Steps to Reproduce the Bug or Issue

When navigating to a route with state object the route correctly sees the state but when navigating back the location.state will not update.

// having a component on route '/' with:
const location = useLocation();
createEffect(() => {
  console.log(location.state)
})

// doing with a button click:
// 1. navigate to:
navigate('/', { state: { foo: 'bar' } }); //   console: { foo: 'bar' }
// 2. navigate to:
navigate('/', { state: { foo: 'baz' } }); //   console: { foo: 'baz' }
// 3. navigate back:
history.back(); //   console: <no change> !! expected { foo: 'bar' }

Demo Reproduction: https://stackblitz.com/edit/solidjs-templates-o9qpzf?file=src%2Findex.tsx

Expected behavior

useLocation().state should reflect history.state and should reactively update.

Screenshots or Videos

No response

Platform

Additional context

No response

r-Larch commented 4 months ago

I think changing the equals check in createRouter.ts line: 35 could be a fix. The equals function only checks the path and does not check if state has changed.

https://github.com/solidjs/solid-router/blob/e773947b85ac78281816e86621a2cdb6735ae95a/src/routers/createRouter.ts#L25-L41