Skip to content

fix(VAutocomplete): fix scroll jump  #22531#22665

Open
Kirubapanneers wants to merge 2 commits intovuetifyjs:masterfrom
Kirubapanneers:fix/vautocomplete-scroll-jump-#22531
Open

fix(VAutocomplete): fix scroll jump  #22531#22665
Kirubapanneers wants to merge 2 commits intovuetifyjs:masterfrom
Kirubapanneers:fix/vautocomplete-scroll-jump-#22531

Conversation

@Kirubapanneers
Copy link
Copy Markdown

fixes #22531

The problem was that itemHeight dropped from 48px to 8.6px after render. That broke the offsets and made the scroll jump to the wrong place.
I fixed it by keeping the first measured itemHeight and not letting it change after that.

Changes

virtual.ts: prevent itemHeight from shrinking after initial measurement
virtual.ts: Reset scrollVelocity to 0 on first scroll after long pause
VAutocomplete.tsx: Fixed scroll timing when menu opens

Steps to reproduce fix

  1. Create autocomplete with 500 items
  2. Set initial value to Item 100
  3. Open menu - should show Item 100
  4. Scroll down - should scroll smoothly without jumping

@J-Sek
Copy link
Copy Markdown
Contributor

J-Sek commented Mar 1, 2026

I have just took the demo from the original issue to play with it. Tab » Enter » Mouse Up/Down, reload

Screencast.from.2026-03-01.15-16-53.webm

Looks like an improvement (previously it jumped by hundreds).
But we are not done yet.

@Kirubapanneers
Copy link
Copy Markdown
Author

Thanks for checking it out! I’ll look into the remaining issue and since this is my first opensource contribution, I really appreciate the feedback!

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.

[Bug Report][3.10.6] VAutocomplete with selection - scrolling down skips hundreds of items

2 participants