[Bug] Randomly failed to scroll to anchor when opening docfx site's anchor link

[filzrev]

Describe the bug
When opening docfx site anchor link.
Browser failed scroll to anchor randomly.

To Reproduce
Steps to reproduce the behavior:

1. Open anchor link by browser (https://dotnet.github.io/docfx/docs/markdown.html?tabs=linux%2Cdotnet#code-snippet)
2. Sometimes scroll don't works or indicate wrong place.

Another example link without tab content/images. (https://dotnet.github.io/docfx/docs/dotnet-api-docs.html#filter-by-type)
It's scroll to Filter by UID randomly.

Expected behavior
Always scrolled to specified anchor.

Context (please complete the following information):

• Browser: chrome, edge
• Template: default, modern

Additional context
This issue might be related to browser's event timing.
https://www.bryanbraun.com/anchorjs/#dont-run-it-too-late.

[shibaev]

It seems related to the script that scrolls TOC to the active node. For modern template, it is the scrollIntoView call in toc.ts.

[shibaev]

This comment describes problems with scrollIntoView implementation in Chromium and possible workarounds.

[shibaev]

Does the fix cover the situation when scroll to anchor works before scrolling TOC to an active element? Currently, I see two types of problem in Chrome:

1. TOC scrolling runs before the scrolling to anchor. In that case, TOC is properly scrolled but anchor is not reached.
2. TOC scrolling runs after the scrolling to anchor. In that case, anchor is properly reached but the TOC is not scrolled to an active element.

It looks like the fix may only address the first case.

I also tested the fix on our version of DocFX-based documentation and both issues from cases 1-2 are still there.

[filzrev]

It seems scrolling problems are still existing on latest docfx site.

Urls for tests

• https://dotnet.github.io/docfx/docs/markdown.html?tabs=linux%2Cdotnet#code-snippet
• https://dotnet.github.io/docfx/docs/dotnet-api-docs.html#filter-by-type

Behaviors when click anchor links

• Successfully scrolled into anchor link.
• Not scrolled at all
• Scrolled to wrong position before anchor link.

[shibaev]

Agree with @filzrev. The scroll issue still happens. For example, https://dotnet.github.io/docfx/tutorial/advanced_support_hyperlink.html#prepare is often loaded like this (pay attention on TOC scrolling):

The expected result should look like: