feat: add smooth scroll for footnote references#156
Merged
Conversation
Fix broken footnote navigation caused by rehype-sanitize doubling the `user-content-` ID prefix (remark-gfm already generates prefixed IDs). Set `clobberPrefix: ""` in the sanitize schema to prevent the clash. Add smooth scroll behavior to all internal hash links (#-prefixed), so clicking a footnote reference smoothly scrolls to its definition and the backlink (↩) scrolls back to the reference. Closes #155
Preserve browser back-button navigation through footnote/heading links, matching native anchor link behavior.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
- Preserve rehype-sanitize DOM-clobbering protection by keeping the default clobberPrefix and adding a rehype plugin that strips the user-content- prefix from remark-gfm footnote IDs before sanitize re-adds it (avoiding double-prefixed IDs without dropping security). - Skip smooth scroll on modified clicks (ctrl/cmd/shift/alt) so browser default behavior (e.g., open in new tab) is preserved. - Respect prefers-reduced-motion for all smooth scroll navigation (hash links in MarkdownViewer and ToC heading clicks in App).
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
Limit rehypeStripClobberPrefix to remark-gfm footnote IDs (fn-*, fnref-*, footnote-label) to avoid collisions with raw HTML user-content-* IDs.
Contributor
Code Metrics Report
Details | | main (32a32f7) | #156 (23a155e) | +/- |
|---------------------|----------------|----------------|-------|
- | Coverage | 57.5% | 57.1% | -0.4% |
| Files | 40 | 40 | 0 |
| Lines | 3518 | 3538 | +20 |
- | Covered | 2023 | 2021 | -2 |
- | Code to Test Ratio | 1:0.5 | 1:0.5 | -0.1 |
| Code | 5642 | 5682 | +40 |
| Test | 2961 | 2961 | 0 |
- | Test Execution Time | 29s | 31s | +2s |Code coverage of files in pull request scope (71.1% → 70.1%)
Reported by octocov |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
rehype-sanitizedoubling theuser-content-ID prefix on footnote elements. Add arehypeStripClobberPrefixplugin that strips the prefix from remark-gfm footnote IDs beforerehype-sanitizere-adds it, preserving DOM-clobbering protection.#-prefixed), so clicking a footnote reference ([^1]) smoothly scrolls to its definition and the backlink (↩) scrolls back.prefers-reduced-motionfor smooth scroll (hash links and ToC heading clicks).Closes #155