Fix sidebar scroll restoration issue

[HiDeoo]

Description

This PR fixes a sidebar restoration issue in projects that uses a <Sidebar> component override which adds content after the default sidebar, e.g. like the sponsors in the Astro Docs.

Repro:

1. Visit the Astro Docs.
2. Make sure that based on your window height, the sidebar is scrollable.
3. Scroll down to the bottom of the sidebar.
4. Either refresh the page or navigate to another page.

The sidebar scroll position is not properly restored as it should be. The restoration happens after the default sidebar content is rendered but before the entire override content is rendered. Any extra content added after the default sidebar content is not taken into account when restoring the scroll position.

This PR is a draft testing the easiest fix by just moving the restoration script after the <Sidebar> component. The goal is to see if this is a viable solution and if it doesn't break anything else.

The preview in this PR includes a reproduction of the issue so that we can easily test the fix.

Remaining tasks

• Remove the Sidebar override in docs/astro.config.mjs
• Delete the docs/src/components/Sidebar.astro file
• Based on the final solution, potentially update the frontmatter comment in packages/starlight/components/SidebarPersister.astro
• Add a changeset

[changeset-bot]

⚠️ No Changeset found

Latest commit: d30cf75

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[netlify]

✅ Deploy Preview for astro-starlight ready!

Name	Link
🔨 Latest commit	d30cf75
🔍 Latest deploy log	https://app.netlify.com/sites/astro-starlight/deploys/67289c6e2afe500008d65bdf
😎 Deploy Preview	https://deploy-preview-2569--astro-starlight.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 100 (no change from production) Accessibility: 100 (no change from production) Best Practices: 100 (no change from production) SEO: 100 (no change from production) PWA: - View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[delucis]

Took a quick look at the preview and certainly seems to be working as expected. Don’t love that this forces moving more stuff out of the <SidebarPersister> component. Maybe there’s another way to break it up 🤔 I think currently the reason to keep <SidebarPersister> in <Sidebar> is to receive and hash the sidebar as mutated by any sidebar overrides. Maybe after #2390 that wouldn’t be so important.

[HiDeoo]

Yeah, not super happy about it either, even more it breaks Prettier now in Page.astro but the idea was to try the fix and see if it works on various devices using the preview URL.

#2390 would definitely help, altho, I'll have to find and check some previous discussions, I wonder if also one point to keep it there was also the possibility to bypass it by not rendering the default component maybe? 🤔

[delucis]

I wonder if also one point to keep it there was also the possibility to bypass it by not rendering the default component maybe?

Yeah, that’s also true. Moving things to Page.astro make them very hard to remove/override.

[HiDeoo]

More than 1 year later, I'm still not happy with this change, and considering it's only an issue in Astro Docs from what we know, I'd like to explore other options rather than seeing this merged.

Closing this PR for now.