feat: improve component compatibility with virtual scrolling solutions

Feature Request

Ionic version:

[x] 5.x

Describe the Feature Request

At the moment, components such as ion-refresher, ion-infinite-scroll, and the collapsible large title rely on users scrolling on ion-content. As a result, when scrolling in a virtual scroll container, these components do not work as expected. While we cannot account for every single virtual scrolling solution, I think we can expose an API that lets users have more control over which scrollable container these components listen on.

This impacts solutions like CDK Scroller, Virtuoso, vue-virtual-scroller, etc.

For developers that would like to see this feature added to the Framework, please react to this post with a thumbsup/“+1” reaction. Thanks!

[ghenry22]

It would be great if you could also validate that ion-reorder works with these alternative scrollers. It is currently broken when used with ion-virtual-scroll but the bug reporting this was closed “because virtual-scroll will be deprecated”.

[liamdebeasi]

Hi everyone,

@sean-perkins has done a tremendous job adding new functionality to improve Ionic component compatibility with virtual scrolling solutions via https://github.com/ionic-team/ionic-framework/commit/2a438da010ddd4d4211e1879e27d7b28409daaa2. The code for this has been merged, and we are looking to ship this new feature in an upcoming minor release of Ionic.

When this feature ships, expect to see new documentation that will show you how to update your apps for this new compatibility. We have a work in progress PR with the new docs changes: https://github.com/ionic-team/ionic-docs/pull/2229

I am going to close this. Thanks!