Skip to content

fix: auto scroll toc when active item out of view#1503

Open
azyl20 wants to merge 3 commits into
nextfrom
alex/CX-3452
Open

fix: auto scroll toc when active item out of view#1503
azyl20 wants to merge 3 commits into
nextfrom
alex/CX-3452

Conversation

@azyl20

@azyl20 azyl20 commented Jun 2, 2026

Copy link
Copy Markdown
Contributor
🎫 Resolve CX-3452

🎯 What does this PR do?

  • On long Guides/API Reference pages where the right-side Table of Contents (TOC) contains enough items to exceed the viewport height, the TOC itself does not scroll when the currently active heading goes out of view.

🧪 QA tips

  • [ ]

📸 Screenshot or Loom

before:

Screen.Recording.2026-06-02.at.2.10.05.pm.mov

after:

Screen.Recording.2026-06-02.at.3.20.41.pm.mov

@azyl20 azyl20 requested a review from runnabro June 2, 2026 05:21
nav.style.setProperty('--ToC-border-active-height', `${linkRect.height}px`);
nav.style.setProperty('--ToC-border-active-top', `${linkRect.top - navRect.top}px`);

link.scrollIntoView?.({ block: 'nearest', behavior: 'smooth' });

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

optional chaining required as scrollIntoView is undefined in our test environment

@azyl20 azyl20 requested a review from a team June 3, 2026 15:20
@azyl20 azyl20 requested review from a team and mosesj-readme June 16, 2026 04:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants