Window message doesn't work on capacitor ios after deployment to Testflight

I have a ionic5 + capacitor app built using Angular and i have a page where i need the user to fill in the data into the iframe and submit it. I used window.postMessage and message event for communication with the iframe. The app works perfectly fine on chrome, firefox and android. The issue only lies with the iOS.

Issue:

Once the app has been deployed to the testflight and upon using the app i am able to post message to the iframe but the window doesnt trigger ‘message’ event listener.

I noticed that when i do the live reload using ionic capacitor run ios -l --external and plug my iphone into the mac it works fine. But the same iframe doesnt work when deployed. I also noticed that when i do live reload my window.origin is http://myip but when packaged the origin is capacitor://localhost

Error logs when the package app is run

2021-05-10 14:22:14.518064+1000 App[9997:2740595] API error: <_UIKBCompatInputView: 0x105d0bff0; frame = (0 0; 0 0); layer = <CALayer: 0x282854900>> returned 0 width, assuming UIViewNoIntrinsicMetric
2021-05-10 14:22:14.518205+1000 App[9997:2740595] API error: <_UIKBCompatInputView: 0x105d0bff0; frame = (0 0; 0 0); layer = <CALayer: 0x282854900>> returned 0 width, assuming UIViewNoIntrinsicMetric

I have also tried the @Host and @Hostlistener directives but they dont work once deployed.

App template.html

<ion-content class="ion-padding">
  <iframe
    id="i-frame"
    [src]="testUrl | safeUrl"
    frameborder="0"
    width="100%"
    scrolling="no"
  ></iframe>
</ion-content>

App component.ts

export class AppComponent implements OnInit {
  constructor(public modalController: ModalController, public zone: NgZone) {}

  async ngOnInit() {
    window.addEventListener('message', (e) => this.zone.run(() => this.receiveMessage(e)));
  }

  receiveMessage(e) {
    if (e.origin === window.location.origin || !e.data) {
      return;
    }
    try {
      const response = JSON.parse(e.data);
    } catch (e) {}
  }

  saveData(event: Event) {
    event.preventDefault();
    const frameById = document.getElementById('i-frame');
    const childFrame = frameById['contentWindow'] || frameById['contentDocument'];
    childFrame.postMessage({ actionType: 'create' }, this.testUrl);
  }
}