fluentui
fluentui copied to clipboard
microsoft
GroupedList scrolling is broken
Environment Information
- Package version(s): 8.19 and later
- Browser and OS versions: Edge, Chrome
Please provide a reproduction of the bug in a codepen:
The bug is present also in the basic example at Fluent UI demo page
Actual behavior:
When scrolling to the bottom of the list, scrolling gets to an infinite loop and the list bounces until I scroll back up
Expected behavior:
Scrolling should not bounce infinitely when reaching the bottom of the list
Priorities and help requested:
Requested priority: High
Products/sites affected: an internal Microsoft product
Hi @bittola thanks for the bug report! This is something we're aware of and I'm currently working on a fix. I don't have an ETA but I'll update this issue when I have more information.
Hi @spmonahan, any update on this? SharePoint customers also have this problem, do we have an ETA for this as now customers are pushing us to fix this...
Hello! I've recently merged #24460 which introduces a new version of GroupedList called GroupedListV2. V2 is an API-compatible reimplementation of GroupedList. While I've tested V2 it is essentially an all-new control and as such is being released as "unstable". This means a couple things:
- The API is subject to change. I don't expect any changes since it is meant to be compatible with
GroupedList. - Not all features from
GroupedListare currently implemented. For example there are outstanding issues with ARIA and drag and drop is not implemented.
As such V2 is not current suitable for use in production. However, it does fix the rendering issue and I'd appreciate you dropping it into a dev or preview environment to verify that V2 works in your application.
To use GroupedListV2 make sure you're on @fluentui/[email protected] or later. Then:
import { GroupedListV2_unstable as GroupedListV2 } from '@fluentui/react';
// ....
<GroupedList
// ... same props as before
/>
Please try out GroupedListV2 in your application and if you encounter issues please file a bug report and assign it to me.
Hi, @spmonahan , could you please cherry-pick this change to @fluentui/[email protected] ? our sharepoint apps are using 7, i don't know we have plans to upgrade to 8 in the near future
Hi, @spmonahan , could you please cherry-pick this change to @fluentui/[email protected] ? our sharepoint apps are using 7, i don't know we have plans to upgrade to 8 in the near future
I'm working on it but have hit a few typing issues. Will follow up once I have a PR ready
P.S. I was able to fix this problem with my list with
onShouldVirtualize={() => false}
P.S. I was able to fix this problem with my list with
onShouldVirtualize={() => false}
Yep, this is because the issue is ultimately with how virtualization works with nested groups. With smaller lists this approach is probably fine but you'll see performance problems with large lists.
@spmonahan I wanted to follow up on this, did you get a chance to cherry-pick to Fabric 7 ? more customers are reporting this scrolling bug
Because this issue has not had activity for over 150 days, we're automatically closing it for house-keeping purposes.
Still require assistance? Please, create a new issue with up-to date details.
