Skip to content

"Sidebars automatically scroll to active item" feature not working in Firefox 97 #3624

Closed
@wilhelmer

Description

@wilhelmer
Contributor

Contribution guidelines

  • I've read the contribution guidelines and wholeheartedly agree

I've found a bug and checked that ...

  • ... the problem doesn't occur with the mkdocs or readthedocs themes
    ... the problem persists when all overrides are removed, i.e. custom_dir, extra_javascript and extra_css
    ... the documentation does not mention anything about my problem
    ... there are no open or closed issues that are related to my problem

Description

In Firefox 97, the "Sidebars automatically scroll to active item" feature (see here) isn't working anymore.

Expected behaviour

When using Firefox 97 and the latest version of Insiders, the navigation should be scrolled into view as described here.

Actual behaviour

Navigation does not scroll into view in Firefox 97. No console errors.

Steps to reproduce

See description.

Package versions

  • Python: 3.9.10
  • MkDocs: 1.2.3
  • Material: 8.2.1+insiders.4.9.1

Configuration

N/A

System information

  • Operating system: ...
  • Browser: ...

Activity

squidfunk

squidfunk commented on Feb 26, 2022

@squidfunk
Owner

I'm not able reproduce this with the latest Firefox. Oddly enough I was when you reached out to me yesterday, but today I'm not seeing this issue anymore. Are you still able to reproduce? This video shows that both sidebars are correctly positioned:

Ohne.Titel.mp4
added
needs reproductionIssue lacks a minimal reproduction .zip file
and removed
bugIssue reports a bug
on Feb 26, 2022
wilhelmer

wilhelmer commented on Feb 28, 2022

@wilhelmer
ContributorAuthor

When I open https://docs.baslerweb.com/line-pitch on Firefox, the sidebar doesn't scroll and "Line Pitch" isn't visible in the navigation.

When I open the same URL in Chrome, scrolling works properly.

Can you reproduce that?

Our docs were last built with Insiders 4.7.0, but I'm seeing the same behaviour on staging with 4.10.0.

squidfunk

squidfunk commented on Feb 28, 2022

@squidfunk
Owner

Hmm, yes I'm seeing the same behavior on your website, but I'm still not able to reproduce it on the official docs – just checked again. My next thought was that maybe it's triggered by the sidebar having much more entries, but I'm also not able to reproduce it for the changelog which is very long, as can be seen in the video I posted in my last comment.

You have several customizations in place, could you try to remove them and see if the issue persists with a mint installation?

wilhelmer

wilhelmer commented on Feb 28, 2022

@wilhelmer
ContributorAuthor

I removed all of the customizations and the issue persisted. I was finally able to track it down, it's related to the size of the nav object. If nav has too many entries, scrolling no longer works. The threshold for my project is at around 200 entries.

I tried to create a dummy project but couldn't reproduce the error, maybe you need >200 different topics? I don't know. I'll keep trying ...

squidfunk

squidfunk commented on Feb 28, 2022

@squidfunk
Owner

Hmm, super weird. Thanks for your efforts. It's likely an easy fix as soon as you can reproduce it on a mint project.

wilhelmer

wilhelmer commented on Feb 28, 2022

@wilhelmer
ContributorAuthor

Woo, I got it.

Download, unzip, build, open one of the last topics, e.g., index copy 170.html.

strange-nav-bug.zip

squidfunk

squidfunk commented on Feb 28, 2022

@squidfunk
Owner

Jup, confirmed. Thanks for taking the time to create a reproduction!

added
bugIssue reports a bug
and removed
needs reproductionIssue lacks a minimal reproduction .zip file
on Feb 28, 2022
wilhelmer

wilhelmer commented on Feb 28, 2022

@wilhelmer
ContributorAuthor

Yup, that was a little tricky. Hope it helps! Curious how this will turn out.

squidfunk

squidfunk commented on Feb 28, 2022

@squidfunk
Owner

I've already isolated the error – Firefox returns different values for Element.scrollHeight and Element.offsetHeight on elements that do not overflow and are not scrollable, which interferes with the logic that determines the nearest scrollable container. Chrome reports the values correctly. What the...

Possibly related:

squidfunk

squidfunk commented on Feb 28, 2022

@squidfunk
Owner

Fixed in aa5602a. I've switched to a more resilient approach to determine the overflowing container.

wilhelmer

wilhelmer commented on Feb 28, 2022

@wilhelmer
ContributorAuthor

Success! I can confirm scrolling works as advertised with the fix.

squidfunk

squidfunk commented on Mar 2, 2022

@squidfunk
Owner

Released as part of 8.2.4+insiders-4.10.1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugIssue reports a bugresolvedIssue is resolved, yet unreleased if open

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @squidfunk@wilhelmer

        Issue actions

          "Sidebars automatically scroll to active item" feature not working in Firefox 97 · Issue #3624 · squidfunk/mkdocs-material