Skip to content

fix: correct outline active heading detection and scroll-to-center on click#1070

Open
octo-patch wants to merge 1 commit intocodexu:devfrom
octo-patch:fix/issue-1039-outline-active-heading
Open

fix: correct outline active heading detection and scroll-to-center on click#1070
octo-patch wants to merge 1 commit intocodexu:devfrom
octo-patch:fix/issue-1039-outline-active-heading

Conversation

@octo-patch
Copy link
Copy Markdown

Fixes #1039

Problem

Two bugs in the outline panel:

  1. Wrong active heading highlight on scroll: The findActiveHeadingByScroll function iterated headings from first to last, returning the first heading whose position was at or above the viewport. With multiple headings scrolled past, this always returned the topmost heading instead of the most recently passed one, causing the highlight to be out of sync with the actual scroll position.

  2. Heading not centered when clicked: Clicking a heading in the outline used editor.commands.scrollIntoView(), which only guarantees the selection is visible (often placing it at the bottom edge of the viewport) rather than centering it.

Solution

  1. Changed findActiveHeadingByScroll to iterate in reverse order (last to first) so it returns the last heading whose top is at or above the viewport — i.e., the heading the user is currently reading.

  2. Changed scrollToHeading to use domNode.scrollIntoView({ behavior: 'smooth', block: 'center' }) so the target heading is scrolled to the center of the editor viewport.

Testing

  • Open a document with multiple headings spanning more than one screen
  • Scroll through the document and verify the outline panel highlights the correct heading
  • Click headings in the outline and verify they scroll to the center of the editor

… click (fixes codexu#1039)

When scrolling, the outline panel was iterating headings forward and
returning the first heading above the viewport instead of the last
(most recently passed) heading. This caused the highlight to always
show the topmost heading rather than the one currently visible.

Also fixed scrollToHeading to use scrollIntoView({ block: 'center' })
so the selected heading is centered in the editor rather than appearing
at the bottom edge of the visible area.

Co-Authored-By: Octopus <liyuan851277048@icloud.com>
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.

[bug] 大纲高亮目录跟编辑器位置对不上

1 participant