Skip to content

fix(svelte-virtual): force store update when setOptions is called#1143

Merged
piecyk merged 2 commits intoTanStack:mainfrom
isaackaara:fix/svelte-setOptions-store-update
Mar 12, 2026
Merged

fix(svelte-virtual): force store update when setOptions is called#1143
piecyk merged 2 commits intoTanStack:mainfrom
isaackaara:fix/svelte-setOptions-store-update

Conversation

@isaackaara
Copy link
Contributor

When options like count change but the visible range stays the same, onChange never fires (it only fires on range changes via maybeNotify). This means the Svelte store is not updated, so the component doesn't re-render — even though the virtualizer has new items.

Reproduction: increase count while scrolled near the top of the list. The new items are never rendered because the range (e.g. 0–9) hasn't changed.

Fix: call virtualizerWritable.set(virtualizer) after _willUpdate() so the store is always refreshed when setOptions is called explicitly. Svelte treats same-reference objects as changed (due to safe_not_equal returning true for objects), so this correctly triggers a re-render.

This mirrors what vue-virtual already does: it calls triggerRef(state) after _willUpdate() for the same reason.

Fixes #969

When options like `count` change but the visible range stays the same,
`onChange` is never called (it only fires on range changes). This means
the Svelte store is not updated and the component does not re-render.

Fix by calling `virtualizerWritable.set(virtualizer)` after _willUpdate()
so the store always reflects the latest virtualizer state after any
options change. This mirrors how vue-virtual uses `triggerRef(state)`
after _willUpdate().

Fixes TanStack#969
@changeset-bot
Copy link

changeset-bot bot commented Mar 11, 2026

🦋 Changeset detected

Latest commit: cbdf629

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@tanstack/svelte-virtual Patch

Not sure what this means? Click here to learn what changesets are.

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

@nx-cloud
Copy link

nx-cloud bot commented Mar 12, 2026

View your CI Pipeline Execution ↗ for commit cbdf629

Command Status Duration Result
nx affected --targets=test:sherif,test:knip,tes... ✅ Succeeded 7s View ↗
nx run-many --target=build --exclude=examples/** ✅ Succeeded 16s View ↗

☁️ Nx Cloud last updated this comment at 2026-03-12 18:49:22 UTC

Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR fixes a bug where Svelte virtual lists would not re-render when count changes but the visible range stays the same (e.g., the user is scrolled near the top). The fix forces a Svelte store update after _willUpdate() in setOptions, ensuring the component re-renders even when onChange doesn't fire.

Changes:

  • Added virtualizerWritable.set(virtualizer) after _willUpdate() in setOptions to force a store update, mirroring how vue-virtual uses triggerRef(state) in the same scenario.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@pkg-pr-new
Copy link

pkg-pr-new bot commented Mar 12, 2026

More templates

@tanstack/angular-virtual

npm i https://pkg.pr.new/@tanstack/angular-virtual@1143

@tanstack/lit-virtual

npm i https://pkg.pr.new/@tanstack/lit-virtual@1143

@tanstack/react-virtual

npm i https://pkg.pr.new/@tanstack/react-virtual@1143

@tanstack/solid-virtual

npm i https://pkg.pr.new/@tanstack/solid-virtual@1143

@tanstack/svelte-virtual

npm i https://pkg.pr.new/@tanstack/svelte-virtual@1143

@tanstack/virtual-core

npm i https://pkg.pr.new/@tanstack/virtual-core@1143

@tanstack/vue-virtual

npm i https://pkg.pr.new/@tanstack/vue-virtual@1143

commit: f1b5435

@piecyk piecyk merged commit 5ed73b8 into TanStack:main Mar 12, 2026
4 checks passed
@github-actions github-actions bot mentioned this pull request Mar 12, 2026
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.

Svelte: setting count does not re-render correctly

3 participants