AutoComplete: VirtualScrolling Issues with "itemTemplate", "optionGroupLabel" and "optionGroupChildren"

[maximilianweidenauer]

Describe the bug

I've encountered some issues with the AutoComplete component while virtualscrolling.

When there is an itemTemplate, optionGroupLabel and optionGroupChildren. The virtualscrolling doesn't work. While scrolling the dropdown will flicker and be reset to the very top.

During logging I found out, that all suggestions are passed to the itemTemplate function. When not using itemTemplate, optionGroupLabel and optionGroupChildren you can see that only like 12 suggestions are being passed. Also while scrolling when you log the parameter of onLazyLoad you can see that first is almost always 0 and last doesn't get higher than 1. When not using itemTemplate, optionGroupLabel and optionGroupChildren, first and last are updated normally.

I've added a codesandbox to reproduce this issue, to check the "normal" behaviour just comment the first return statement which is an array and use the second return which just uses suggestions.

I hope my description is sufficient.

Reproducer

https://codesandbox.io/s/blissful-smoke-9bjjm9?file=/src/demo/AutoCompleteDemo.js:1994-2013

PrimeReact version

8.6.1

React version

17.x

Language

TypeScript

Build / Runtime

Create React App (CRA)

Browser(s)

Chrome

Steps to reproduce the behavior

No response

Expected behavior

No response

[maximilianweidenauer]

Any news regarding this ticket?

[maximilianweidenauer]

@melloware sorry to ping but could it that this ticket was overlooked? hasn't received any update or label since I've added the ticket. Every other open ticket already received at least a label.

[melloware]

Not overlooked I have left it as Triage as it needs to be investigated by PrimeTek. I typically don't investigate the Virtual Scrolling issues since its reused in many components usually I defer to PrimeTek to review and fix these ones.

However, if you need this fix critically I suggest you consider PRO support.