Why can I use window.history.pushState for routing ?
Answered
Atlantic mackerel posted this in #help-forum
Atlantic mackerelOP
I read the MDN spec which mentions:
"Calling history.pushState() or history.replaceState() won't trigger a popstate event. The popstate event is only fired when navigating via browser actions (like the back/forward button) or explicit calls to history.back()/history.forward()."
In other words, if I call window.history.pushState, there's no native way to detect this call directly. How does Next.js listen for such calls to update the routing state?
"Calling history.pushState() or history.replaceState() won't trigger a popstate event. The popstate event is only fired when navigating via browser actions (like the back/forward button) or explicit calls to history.back()/history.forward()."
In other words, if I call window.history.pushState, there's no native way to detect this call directly. How does Next.js listen for such calls to update the routing state?
Answered by chisto
Next patches the brower history.pushState and replaceState methods to hook into routing changes.
You can see how they do it here, line 335
https://github.com/vercel/next.js/blob/canary/packages/next/src/client/components/app-router.tsx#L335-L438
You can see how they do it here, line 335
https://github.com/vercel/next.js/blob/canary/packages/next/src/client/components/app-router.tsx#L335-L438
2 Replies
Next patches the brower history.pushState and replaceState methods to hook into routing changes.
You can see how they do it here, line 335
https://github.com/vercel/next.js/blob/canary/packages/next/src/client/components/app-router.tsx#L335-L438
You can see how they do it here, line 335
https://github.com/vercel/next.js/blob/canary/packages/next/src/client/components/app-router.tsx#L335-L438
Answer