Hot reload not working correctly (browser scrolls to top)

[borekb]

🐛 Bug Report

We've recently upgraded from 2.0.0-alpha.61 to 2.0.0-alpha.75 and noticed that hot-reload is no longer working as before. The same issue can be observed with the latest 2.0.0-beta.0.

Previously, when I had a long Markdown document and was editing somewhere down below, I was able to see changes immediately in a browser window; with newer releases of Docusaurus 2, the browser scrolls to top every time which makes the editing experience a lot less pleasant (a demo by my colleague @TomKalina):

Also, in the console output, this message is now printed repeatedly:

Docusaurus website is running at: http://localhost:3000/

Which might be hinting at something, I don't know, but previously, this message was printed only once, not after every save. Could this be related to the recent webpack 5 upgrade #4089?

To Reproduce

1. Go to https://codesandbox.io/s/relaxed-dew-1gztw?file=/docs/intro.md:554-688
2. Navigate to /docs/intro in the built-in browser window, scroll down.
3. Edit the intro.md file
4. See the browser preview jump to top.

Expected behavior

Browser does Fast Refresh / hot reload / HMR without scrolling to top.

Actual Behavior

The browser scrolls to top.

Search terms: hot reload, hot-reload, HMR, fast refresh, compilation, webpack, Markdown, MD, .md, .mdx, browser, preview, docusaurus start, dev server, UX.

[lex111]

This is not related to the upgrading to webpack 5, but due to improvement in skip content link #4162
Fix for this is on the way #4797