Prerequisites
Ionic Framework Version
v7.x
Current Behavior
I want to use 2 headers like shown in the docs condense header 1 (for ios) and used the correct props like transfluent and collape, but this breaks my page transitions. My dev console shows following error:
Cannot read properties of null (reading ‘getBoundingClientRect’)
at createLargeTitleTransition (chunk-GHBCID63.js?v=0ecf4cc5:57:64)
at iosTransitionAnimation (chunk-GHBCID63.js?v=0ecf4cc5:272:35)
at animation (chunk-QARUQ2O5.js?v=0ecf4cc5:977:17)
If i remove the second header, my page transitions work like usual. It is also working when i remove the ion-buttons from the toolbar - thats also strange.
I have a very basic “IonBase” component, which I use on every page. I also created a repo
Expected Behavior
Basic page transition without errors. Currently, there is no transition.
Steps to Reproduce
Clone the repo
Code Reproduction URL
https://github.com/KevinLeneschmidt/ionic-vue-ios-header
Ionic Info
Ionic:
Ionic CLI : 7.2.0
Ionic Framework : @ionic/vue 7.8.1
Capacitor:
Capacitor CLI : 5.7.4
@capacitor/android : not installed
@capacitor/core : 5.7.4
@capacitor/ios : 5.7.4
Utility:
cordova-res : not installed globally
native-run : 2.0.1
System:
NodeJS : v21.7.1
npm : 10.5.0
OS : macOS Unknown
Additional Information
I also opened a topic in the ionic forum: forum
Prerequisites
Ionic Framework Version
v7.x
Current Behavior
I want to use 2 headers like shown in the docs condense header 1 (for ios) and used the correct props like transfluent and collape, but this breaks my page transitions. My dev console shows following error:
If i remove the second header, my page transitions work like usual. It is also working when i remove the ion-buttons from the toolbar - thats also strange.
I have a very basic “IonBase” component, which I use on every page. I also created a repo
Expected Behavior
Basic page transition without errors. Currently, there is no transition.
Steps to Reproduce
Clone the repo
Code Reproduction URL
https://github.com/KevinLeneschmidt/ionic-vue-ios-header
Ionic Info
Ionic:
Ionic CLI : 7.2.0
Ionic Framework : @ionic/vue 7.8.1
Capacitor:
Capacitor CLI : 5.7.4
@capacitor/android : not installed
@capacitor/core : 5.7.4
@capacitor/ios : 5.7.4
Utility:
cordova-res : not installed globally
native-run : 2.0.1
System:
NodeJS : v21.7.1
npm : 10.5.0
OS : macOS Unknown
Additional Information
I also opened a topic in the ionic forum: forum