Issues with live reloading in Next.js

[seancdavis]

I have a couple issues I can consistently recreate when working with Contentlayer and Next.js. These occur consistently while working on the Contentlayer website.

Reloading Renders the Home Page

1. Start up dev server
2. Navigate to docs, then getting started (without reloading the page).
3. Make a content change.
4. App reloads and redirects to the home page.

Live Reloading with Direct Access

If I reload the docs page I'm working on, then the correct page is reloaded, but it scrolls to the top.

1. Visit the page I'm working on.
2. Scroll down to look at the section I want to edit.
3. Make a content change.
4. Page reloads, but loads the top of the page, doesn't hold the current scroll position.

Video

Here's a video of the bug(s) in action:

[ghoshnirmalya]

Page reloads but loads the top of the page doesn't hold the current scroll position.

This is something that I have also noticed. I'm guessing that this happening because we fetch the data on the server (via getStaticProps) and then send the data to the Next.js page via props.

When the data (from Contentlayer) changes, Next.js "reloads" the page as the data has changed on the server. Because of this "reload", the page scrolls to the top and is unable to maintain the current scroll position.

A few more points to note:

1. I checked how Remix does it as they support MDX out of the box and they restore the scroll position after page reloads.
2. The scroll position also gets preserved in the with-mdx example of Next.js.

[schickling]

This problem should now be addressed with version 0.1.0. If you're running into problems, please let me know. :)

[ghoshnirmalya]

@schickling Thank you for the update. I tried the latest version and still faced the same issue. I have replicated the same issue on Stackblitz.

[schickling]

Thanks a lot @ghoshnirmalya for following up on this. You're right, I was able to reproduce the problem on Stackblitz. However, it seems this is a separate issue (which similar symptoms though). Would you mind creating a new issue for this? 🙏

[ghoshnirmalya]

@schickling Done.