bug: A cached page's virtual-scroll doesn't re-render on window resize (Keyboard or Orientation)

Bug Report

If you have a route that contains an ion-virtual-scroll, then you navigate forward (So the previous route is cached and reused), if the new current page triggers a resize, then you go back to the cached route, the virtual scroll items will collapse and overlap each others.

Ionic version: [x] 4.8.1

Current behavior: An ion-virtual-scroll existing on a cached route doesn’t react to screen resizes and it collapses when navigating back to its page.

Expected behavior:

ion-virtual-scroll should react to screen resizes even if its page is not the active one.

Steps to reproduce: Tabs are affected heavily because all of their views are cached and reused

It happens on all platforms and on both, virtual devices and real devices.

Other information:

https://github.com/ionic-team/ionic/issues/18409

Ionic info:

Ionic:

   Ionic CLI                     : 5.2.7
   Ionic Framework               : @ionic/angular 4.8.1
   @angular-devkit/build-angular : 0.801.3
   @angular-devkit/schematics    : 8.1.3
   @angular/cli                  : 8.1.3
   @ionic/angular-toolkit        : 2.0.0

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.0.0, ios 5.0.1
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.0, (and 15 other plugins)

Utility:

   cordova-res : 0.6.0 
   native-run  : 0.2.8 

System:

   Android SDK Tools : 26.1.1 (/Users/omardoma/Library/Android/sdk)
   ios-deploy        : 1.9.4
   ios-sim           : 8.0.2
   NodeJS            : v10.15.3 (/usr/local/Cellar/node@10/10.15.3/bin/node)
   npm               : 6.10.3
   OS                : macOS Mojave
   Xcode             : Xcode 10.3 Build version 10G8

[masimplo]

Hey @mhartington I know you’ve done some fiddling in the past with CDK’s VS but never got around to bringing this into Ionic. At that time I had also tried moving from Ionic to CDK as I imagined something like this might happen, but faced multiple issues on migrating. To be totally honest, it is not an ideal situation to stop maintaining something and pushing users of Ionic to migrate right away to something that has no direct migration path, without instructions on how to migrate. For instance CDK has no support for headers/footers and no getPositionForItem function. Also it is another thing to build something on top of CDK and offer it as part of Ionic and a totally different one to ask every single user to integrate it with Ionic (i.e. on-infinite-scroll and ion-refresher mentioned above). If you are indeed going to drop VS from Ionic, a deprecation message together with some instructions on how CDK can be a direct replacement for Ionic VS will be extremely helpful.

[TdoubleG]

3 Month past, and still no comment from ionic devs…

@brandyscarney @adamdbradley