Explicit Heading for H1 not rendered in DOM

[TomPeirs]

🐛 Bug Report

Prerequisites

• I'm using the latest version of Docusaurus.
• I have tried the npm run clear or yarn clear command.
• I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
• I have tried creating a repro with https://new.docusaurus.io
• I have read the console error message carefully (if applicable)

Description

Links to H1 Explicit Anchors are not working as they are not represented in the DOM.
Therefore the scrollbar of the browser does not jump to the desired position.

Have you read the Contributing Guidelines on issues?

Yes

Steps to reproduce

You can directly try this out in the following CodeSandbox.
https://codesandbox.io/s/fervent-pine-nbnnl?file=/docs/intro.md

1. Create a markdown file which is long enough so that there is a scrollbar
2. at the bottom (or at some point the scollbar has moved) create a Link to an H1 within another document by refering to the explicit heading ID
3. When you click on that link while the scrollbar has an offset, the offset will not jump to that heading because the heading is never found because the anchor tag is not represented in the DOM.

Expected behavior

I would expect that the explicit heading ID is interpreted in the DOM so that by refering to a H1 heading that the scrollbar jumps to that position.

Actual behavior

The scrollbar does not jump to the heading.
See video:

2021-06-22_16h21_21.mp4

Your environment

• Public source code:
• Public site URL: https://codesandbox.io/s/elastic-dawn-qp55m?file=/docs/intro.md
• Docusaurus version used: 2.0.0-beta.0
• Environment name and version: Brave Version 1.25.73 Chromium: 91.0.4472.106 (Official Build) (64-bit)
• Operating system and version : Windows 10 Pro

Reproducible demo

https://codesandbox.io/s/fervent-pine-nbnnl?file=/docs/intro.md

HOW TO SOLVE:

I could solve this in theory by referencing in my markdown file to the file itself without the explicit ID.
However, my markdown is generated through a conversion from pandoc to markdown. At this stage I do not disinguis between H1, H2, H3, H4 etc.. therefore it would be difficult for me to suddenly introduce logic to detect if this is a H1 heading and then refer to the page instead of the explicit heading ID of that document.

[slorber]

Docusaurus does not support h1 heading anchors by design, because h1 headings are supposed to be at the top of a page, and as you mentioned you could link to the page directly instead.

Note the UX of headings with anchor is also different:

Do we really want to add that UX on top of all the pages for all our users, while it's quite useless and nobody asked for this before?

I don't really understand why you can't reference the page itself instead of the anchor link in your workflow. I find it surprising that it's not possible to link from one page to another with it without using anchors.
Have you considered opening a pandoc feature request instead?
Please explain your workflow better by giving Pandoc input/output.

[TomPeirs]

Docusaurus does not support h1 heading anchors by design, because h1 headings are supposed to be at the top of a page, and as you mentioned you could link to the page directly instead.

Oke, I will resolve it by linking to the page instead.