t3/next.js app - back button doesn't work?
I recently went through theo's T3 tutorial where we built a emojis-only-twitter app.
the back button doesn't seem to work. i can click onto a single post/user view (1st pic), but when i click back, the home page doesn't re-render despite the page url changing accordingly (2nd pic).
when i refresh the page the home page loads. if i manually enter the home page (localhost:3000/), it loads.
---
it seems like this was an issue in earlier versions of next.js; see:
- https://github.com/vercel/next.js/issues/7091
- https://stackoverflow.com/questions/55780645/next-js-on-back-button-click-page-content-is-not-loading
these threads point to issues arising from code manipulating scroll positions etc. or using Links.
problem is, i'm not doing anything with the scroll position between routes. moreover, the browser tools don't show any errors or warnings.
---
would greatly appreciate any input/direction on this!
GitHub
Navigation issue with Browser Back Button Click · Issue #7091 · ver...
Issue : From http://localhost:3000 navigate to http://localhost:3000/p/hello using Link. Refresh the page. Click back button : It goes to http://localhost:3000 but still renders the content of http...
Stack Overflow
Next js : On back button click page content is not loading
Issue : In react + nextjs app
If i navigate from http://localhost:3000 to http://localhost:3000/p/hello using Link.
Refresh the page.
Click back button : It goes to http://localhost:3000 but still
![](https://utfs.io/f/f519e72d-f00f-4577-8dbb-e33a80b43f38-1nq2cb.png)
![](https://utfs.io/f/847b6160-9671-4ca0-8dbb-49a66aed6c67-1nq2cb.png)
5 Replies
Same, the video is awesome, so I'm really glad it's there. That said, I experienced the same issue. I noticed https://xn--uo8h.t3.gg/ doesn't have this issue. I tried pulling down the final code from https://github.com/t3dotgg/chirp and putting my .env in it and I have the same issue (run local). I went back through my commits and reverted all the way back to essentially this commit https://github.com/t3dotgg/chirp/commit/402f66dd280f8c98fe548980ada4f92f203b7ca7 and as soon as I added the links it had the problem. I created a new t3 app locally and added a few pages with links back and forth. The back/forward buttons work fine on it. This really has me stumped at the moment. I also tried running build then start and have the same result. I likewise found the same old issue you found.
One thing I just noticed. On user page if I click a post it goes there, then if I click the author it goes there. I can use back / forward browser buttons just fine between post/user pages. It's only when going to the index page where I have the browser button issue.
GitHub
GitHub - t3dotgg/chirp
Contribute to t3dotgg/chirp development by creating an account on GitHub.
Did you figure it out? I'm still stumped. I'm going ahead with my actual app. I just want to figure out the cause so I can avoid it.
Bizarrely I came back to this today and it no longer has the issue. I double checked my vercel log to make sure I hadn't shipped an update in a sleepy state. Doesn't make much sense to me...
hey, I had the same issue recently and it turned out to be from clerk's context. I didn't find a way to fix it though, I just moved the clerk context on the page instead of in _app
maybe clerk fixed the bug
Very interesting that you moved the context and it worked. Clerk was the one thing I didn't think to mess around with. But if they changed something on their side it'd explain it going from failed state to working without change locally. In the spirit of chirp 🤷♂️ 🐦🐤🦅🕊️🐣🤷♂️
hey @zd sorry i was swamped the past week or so. i didn't figure it out, but it also suddenly 'worked' for me. interesting that@ you found that it was the Clerk context.