[Select] Virtual Scroll List Items Jumping Issue

[abhishek-junghare]

Describe the bug

I am using a Select component with Virtual Scroll enabled. Whenever I scroll down, the list items jump. It seems this happens because new items are being loaded dynamically, causing shifts in the list layout.

In the attached video, I am using middle-click scrolling for demonstration, but the issue is the same when using the mouse scroll-wheel as well.

Video Recording:

VirtualScroll.Layout.Shifting.Issue.mp4

Pull Request Link

No response

Reason for not contributing a PR

• Lack of time
• Unsure how to implement the fix/feature
• Difficulty understanding the codebase
• Other

Other Reason

No response

Reproducer

https://stackblitz.com/edit/primevue-4-vite-issue-template-ny5vx51n?file=src%2FApp.vue

Environment

Vue version

3

PrimeVue version

4

Node version

No response

Browser(s)

No response

Steps to reproduce the behavior

1. Go to StackBlitz template
2. Open the Dropdown
3. Try scrolling down
4. The layout jumps are better visible if you middle-click the mouse wheel and move the mouse down to scroll

Expected behavior

It shouldn't jump like that.

[github-actions]

Due to PrimeTek's demanding roadmap for PrimeVue and the limited bandwidth of the core team, this issue is available for anyone to work on. Make sure to reference this issue in your pull request. ✨ Thank you for your contribution! ✨