app-xerintel opened a new issue #974:
URL: https://github.com/apache/cordova-ios/issues/974
# Bug Report
Iframe elements do not work properly when the application launches first time
## Problem
We have several applications made with Ionic and with your platform,
cordova-ios, which include iframe tags.
In Android they always work correctly, but in iOS it happens that when the
application is run for the first time, several actions of the embedded web page
(such as adding products to the cart, filling out forms, etc) are not executed
correctly.
However, when you close the application and open it again, these actions do
work correctly.
After investigating the problem ourselves, we have checked in the Safari
inspector that the iframe cookies are not set when the application is first
loaded. However, when closing the application and reopening it do appear, so we
believe that this could be the origin of the problem (correct us if we are
wrong).
Can you give us any idea, solution or alternative to fix this error?
### What is expected to happen?
Iframe elements always working on iOS devices
### What does actually happen?
Several actions of the embedded web page (such as adding products to the
cart, filling out forms, etc) are not executed correctly.
However, when you close the application and open it again, these actions do
work correctly.
## Information
<!-- Include all relevant information that might help understand and
reproduce the problem -->
### Command or Code
<!-- What command or code is needed to reproduce the problem? -->
Angular code (.ts file):
```
import { Component, OnInit } from '@angular/core';
import { environment } from 'src/environments/environment';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
import { UtilitiesService } from '../../services/utilities.service';
import { Storage } from '@ionic/storage';
@Component({
selector: 'app-tab1',
templateUrl: 'tab1.page.html',
styleUrls: ['tab1.page.scss']
})
export class Tab1Page {
public urlFrame: SafeResourceUrl;
public loading: boolean = true;
constructor(private sanitizer: DomSanitizer,
private utilities: UtilitiesService, private storage: Storage) {
}
public ionViewDidEnter(): void {
this.utilities.showLoading();
this.loading = true;
this.storage.get('idioma').then(idioma => {
this.urlFrame =
this.sanitizer.bypassSecurityTrustResourceUrl(environment.iframeUrl + 'locale/'
+ idioma + '/home');
})
}
public dismissLoading() {
this.loading = false;
this.utilities.dismissLoading();
}
}
```
.html file:
```
<ion-content>
<div class="scroll" [hidden]="loading">
<iframe #iframeCheckout id="iframe" class="web-page" name="events-page"
[src]="urlFrame" frameborder="0"
allowfullscreen sandbox="allow-same-origin allow-scripts allow-forms"
(load)="dismissLoading()"></iframe>
</div>
</ion-content>
```
.scss file:
```
.scroll {
height: 100%;
}
.web-page {
width: 100%;
height: 100%;
background-color: transparent;
}
```
### Environment, Platform, Device
<!-- In what environment, on what platform or on which device are you
experiencing the issue? -->
Environment: macOS Catalina 10.15.4
Platform: iOS 13, iOS 13.+
Device: iOS devices
### Version information
<!--
What are relevant versions you are using?
For example:
Cordova: Cordova CLI, Cordova Platforms, Cordova Plugins
Other Frameworks: Ionic Framework and CLI version
Operating System, Android Studio, Xcode etc.
-->
Cordova CLI: `9.0.0 ([email protected])`
Cordova plugins:
```
cordova-plugin-device 2.0.2 "Device"
cordova-plugin-ionic-keyboard 2.2.0 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 4.1.3 "cordova-plugin-ionic-webview"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.4 "Whitelist"
phonegap-plugin-push 2.3.0 "PushPlugin"
```
Ionic Framework: 4.7.1
Ionic CLI: 6.4.0
## Checklist
<!-- Please check the boxes by putting an x in the [ ] like so: [x] -->
- [X] I searched for existing GitHub issues
- [X] I updated all Cordova tooling to most recent version
- [X] I included all the necessary information above
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
