Skip to content

fix(docs): scroll to hash after docs render - #3387

Merged
gameroman merged 1 commit into
npmx-dev:mainfrom
trueberryless:fix/docs-hash-scroll
Oct 31, 2026
Merged

gameroman merged 1 commit into
npmx-dev:mainfrom
trueberryless:fix/docs-hash-scroll

Conversation

@trueberryless

Copy link
Copy Markdown
Member

🧭 Context

Follow-up to a CodeRabbit comment on #3386: opening a docs URL with a hash (e.g. #class-Foo or a member anchor) stays at the top of the page.

📚 Description

The docs HTML is fetched client-side, so on a direct load the router's scrollBehavior runs before the target element exists. Once the docs HTML has rendered, the page now navigates to route.hash again (same approach as the changelog pages), which re-runs scrollBehavior with the page's scrollMargin. Added an e2e test that fails without this change.

@vercel

vercel Bot commented Oct 31, 2026 •

Copy link
Copy Markdown
Contributor

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
npmx.dev Ready Ready Preview Oct 31, 2026 6:11pm UTC
2 Skipped Deployments
Project Deployment Actions Updated
docs.npmx.dev Ignored Ignored Preview Oct 31, 2026 6:11pm UTC
npmx-lunaria Ignored Ignored Oct 31, 2026 6:11pm UTC

Request Review

@coderabbitai

coderabbitai Bot commented Oct 31, 2026 •

Copy link
Copy Markdown
Contributor

Review in Change Stack →

No actionable comments were generated in the recent review.

Recent review info
Run configuration
Commits

Reviewing files that changed from the base of the PR and between b10e483 and 460477c.

Files selected for processing: 2
  • app/pages/package-docs/[...path].vue
  • test/e2e/docs.spec.ts

Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 3 remain after this review.

Summary

Summary by CodeRabbit

  • Bug Fixes
    • Direct links to sections within documentation pages now navigate to the correct section after the page content loads.
    • Added end-to-end coverage to verify that the linked section is visible when opening a documentation page with a section link.

The documentation page now applies a route hash after its HTML becomes available. An end-to-end test checks direct loading of a symbol hash after hydration.

Changes: Documentation hash navigation

Layer / File(s) Summary
Apply route hash after documentation HTML loads
app/pages/package-docs/[...path].vue, test/e2e/docs.spec.ts
The page watches for documentation HTML and replaces navigation with the route hash when the HTML and hash are available. The end-to-end test checks that #variable-stubConstant is in the viewport after hydration.

Suggested reviewers: danielroe

Merge Risk: Minimal · up to 46047

The change retries hash navigation after documentation renders and adds direct-load coverage. No actionable blocker remains; merge after normal checks pass.

Pre-merge checks: Passed 4
Check name Status Explanation
Title check Passed The title clearly and concisely describes the main change: scrolling to a documentation hash after the documentation renders.
Description check Passed The description accurately explains the hash-navigation issue, the client-side rendering cause, the fix, and the added end-to-end test.
Linked Issues check Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check Passed Check skipped because no linked issues were found for this pull request.
Finishing Touches
Generate unit tests (beta)
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

Share

@codecov

codecov Bot commented Oct 31, 2026 •

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 0% with 6 lines in your changes missing coverage. Please review.
✅ All tests successful. No failed tests found.

Files with missing lines Patch % Lines
app/pages/package-docs/[...path].vue 0.00% 4 Missing and 2 partials ⚠️

📢 Thoughts on this report? Let us know!

@gameroman gameroman left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

The fix works ❤️

@gameroman
gameroman added this pull request to the merge queue Oct 31, 2026
Merged via the queue into npmx-dev:main with commit 530995e Oct 31, 2026
25 checks passed
@trueberryless
trueberryless deleted the fix/docs-hash-scroll branch October 31, 2026 20:56
trueberryless added a commit to BittuBarnwal7479/npmx.dev that referenced this pull request Oct 31, 2026

This branch was successfully deployed

1 active deployment
Preview – npmx.dev — 460477c2 Deployed Oct 31, 2026 by vercel[bot]
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