Closed tomtseng closed 4 months ago
thanks for the detailed analysis! are those initial page-load scrollend
events distinguishable in any way so we can ignore them? otherwise, seems like the only hacky workaround would be to only start listening for scrollend
after a given cooldown period, i.e. similar to what you're doing in https://github.com/AlignmentResearch/KataGoVisualizer/pull/123 (except the component would still mount immediately)
Hmm the spurious initial scrollend
events seem to happen before any scroll
events happen, so maybe a fix is to have <Toc />
disable its scrollend
handler until the first scroll
event occurs
maybe worth a try to add the passive modifier to the scrollend
event?
- on:scrollend={() => {
+ on:scrollend|passive={() => {
if you can modify your Toc.svelte
in node_modules
, i'd be curious if anything changes. might be good to add for performance reasons anyway (unless svelte already inserts it automatically).
I added passive
and re-ran npm fun dev
, but it didn't fix — issue is still present
thanks for trying! i'll attempt a fix tomorrow
I have a plain Svelte (not SvelteKit) website. If I add
<ToC />
, give my page the CSS stylescroll-behavior: smooth
, and load the website directly to anchor link (e.g.,localhost:5173/#anchor
) in Chrome, it does not scroll to the anchor.Expected behavior
Scroll to the anchor on page load.
Actual behavior
Remain at the top of the page.
Steps to reproduce
npm create vite@latest
and select Svelte as the framework.cd svelte-project
,npm install
,npm install -D svelte-toc
.App.svelte
with the following:Heading {i}
{#each {length: 100} as _}Lorem ipsum
{/each} {/each}