Ionic-framework: bug: stacked label causes glitchy page transitions on ios

[mirkonasato]

Bug Report

Ionic version:
[x] 5.x

Current behavior:
Have an app with list and detail pages. Detail has an <IonLabel position="stacked />. After navigating to the detail page, the view appears to "zoom out" a little bit. After navigating back to the list page, the view zooms in again.

It's small but clearly noticeable. Please see this video.

This only happens with position="stacked".

Expected behavior:
Should work smoothly, like with position="fixed" or "floating".

Steps to reproduce:

Clone this repo: ionic-stacked-sample

Run npm install, build, deploy to the iOS simulator. Click on a list item and back.

Related code:

Other information:

Ionic info:

Ionic:

   Ionic CLI       : 6.0.1 (/Users/mirko/.nvm/versions/node/v12.15.0/lib/node_modules/@ionic/cli)
   Ionic Framework : @ionic/react 5.0.0-rc.3

Capacitor:

   Capacitor CLI   : 1.5.0
   @capacitor/core : 1.5.0

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v12.15.0 (/Users/mirko/.nvm/versions/node/v12.15.0/bin/node)
   npm    : 6.13.7
   OS     : macOS Catalina

[liamdebeasi]

Thanks for the issue. Can you try the following dev build and let me know if it resolves the issue for you?

npm i @ionic/[email protected]

[mirkonasato]

@liamdebeasi yep, that fixes it.

[liamdebeasi]

Thanks for the issue. This has been resolved via https://github.com/ionic-team/ionic/pull/20415 and will be available in an upcoming release of Ionic Framework.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.