diff --git a/core/src/components/header/header.tsx b/core/src/components/header/header.tsx
index 29a5344785..17f623114e 100644
--- a/core/src/components/header/header.tsx
+++ b/core/src/components/header/header.tsx
@@ -64,6 +64,13 @@ export class Header implements ComponentInterface {
       const pageEl = this.el.closest('ion-app,ion-page,.ion-page,page-inner');
       const contentEl = (pageEl) ? pageEl.querySelector('ion-content') : null;
 
+      // Cloned elements are always needed in iOS transition
+      writeTask(() => {
+        const title = cloneElement('ion-title') as HTMLIonTitleElement;
+        title.size = 'large';
+        cloneElement('ion-back-button');
+      });
+
       await this.setupCollapsibleHeader(contentEl, pageEl);
     }
   }
@@ -127,10 +134,6 @@ export class Header implements ComponentInterface {
     this.scrollEl!.addEventListener('scroll', this.contentScrollCallback);
 
     writeTask(() => {
-      const title = cloneElement('ion-title') as HTMLIonTitleElement;
-      title.size = 'large';
-      cloneElement('ion-back-button');
-
       if (this.collapsibleMainHeader !== undefined) {
         this.collapsibleMainHeader.classList.add('header-collapse-main');
       }