afterNavigate not firing in dev mode after a code change
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 20.8k
- Forks
- 2.3k
- Avg merge
- 1d 16h
- Merged PRs (30d)
- 156
Description
Describe the bug
In dev mode, after I make a code change, the route component re-mounts itself but it never re-calls afterNavigate. This leaves things in an inconsistent state. Not a huge annoyance but I do have to do ctrl+R in development.
Reproduction
Repro is this branch of this repo:
https://github.com/johnnysprinkles/sveltekit_after_navigate_bug/tree/after_nv
It's the Demo app from create-svelte, but extended to have a parameterized route. The final commit in the history just adds some console.log statements to see what's going on in the lifecycle events.
To repro just clone that and run it with "npm run dev", and create some TODO items, then navigate to one of them (using the newly added "i" icon, or directly via URL e.g. http://localhost:3000/todos/4110e0d9-56a9-4106-9d83-1fada5087660
Now if you make an arbitrary change to routes/todos/[uid].svelte you'll see how onMount runs but afterNavigate doesn't. Looks like:

Logs
No response
System Info
System:
OS: macOS 11.6
CPU: (8) x64 Intel(R) Core(TM) i7-4750HQ CPU @ 2.00GHz
Memory: 510.79 MB / 8.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 16.4.1 - /usr/local/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 8.9.0 - /usr/local/bin/npm
Browsers:
Chrome: 101.0.4951.64
Firefox: 100.0
Safari: 14.1.2
Safari Technology Preview: 15.4
npmPackages:
@sveltejs/adapter-auto: next => 1.0.0-next.33
@sveltejs/kit: next => 1.0.0-next.302
svelte: ^3.46.0 => 3.46.4
Severity
annoyance
Additional Information
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue from the linked after_nv branch with npm run dev, then edit routes/todos/[uid].svelte and observe the onMount and afterNavigate lifecycle logs. Trace the development-mode route remount and navigation handling; done means afterNavigate runs when the route component reloads after a code change without requiring ctrl+R.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100