I have the following html that is opened in a WKWebView.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Popup Window Test</title>
</head>
<body>
<textarea id="myTextarea" cols="5" rows="1">Empty</textarea>
<script>
function openWindow() {
const popup = window.open(
"https://www.apple.com/",
"PopupSample",
"width=400,height=400,dialog=yes,dependent=yes,scrollbars=yes,location=yes"
);
console.log("Popup closed: ", popup.closed);
document.getElementById("myTextarea").value = popup.closed
? "Closed"
: "Open";
const timer = setInterval(() => {
console.log(popup.location.href);
if (popup.closed) {
clearInterval(timer);
console.log("Popup closed: ", popup.closed);
document.getElementById("myTextarea").value = "Closed";
}
}, 1000);
}
</script>
<button onclick="openWindow()">Open Window</button>
</body>
</html>
When I click the button and open page "https://www.apple.com/" in another WKWebView, the javascript code does not work as expected here, the popup object returned from window.open() does not refer to the valid window object, and the closed property is set to true even the new popup window is still alive.
This is a regression since MacOS14.4 updated, I've reported to apple DTS, but they said it's out of their scope.
Does anyone has any clue about this?
WebKit JS
RSS for tagAccess and modify DOM elements within a webpage, including touch events and visual effects, using WebKit JS.
Posts under WebKit JS tag
52 Posts
Sort by:
Post
Replies
Boosts
Views
Activity
Hi
In my app I've to complete the IDV [Identity verification] by capturing the face os user and his/her documents, for this the backend developer provides me the URL from the IDV 3rd party, which URL I do open in webview, so before during loading the camera captureing screen in webview the Live Broadcast screen pops up from no where. I don't want this Live Broadcast screen but somehow it opens anyway. Although it is good thing that my expected camera screen was still open in background so I can go further from there.
First time I'm also bit confused like how this kind of screen popsup even if I did't code for it. Also it takes me a little bit time to figure out how to close that screen.
Simple peoples/users who're going to use my app they don't know how to close it. Please check the screenshots I attached. Please help me to rid of this popup.
Thank You
Issue Summary:
I have encountered an issue where JavaScript does not execute in a WebView when another UIViewController is presented modally with modalPresentationStyle.fullScreen. This problem only occurs on physical devices running iOS 17.5.1. The issue is not present on iOS 17.5 simulators or devices running iOS 17.4.1 or earlier.
Reproduction Steps:
Create a ViewController with a WebView.
Load a web page (e.g., https://apple.com) in the WebView.
Present another ViewController modally with modalPresentationStyle.fullScreen.
Verify that JavaScript execution in the initial WebView stops working.
Test Code:
import UIKit
import WebKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Set up the WebView
let configuration = WKWebViewConfiguration()
let webView = WKWebView(frame: view.frame, configuration: configuration)
view.addSubview(webView)
webView.frame = view.frame
if #available(iOS 16.4, *) {
webView.isInspectable = true
} else {
// Fallback on earlier versions
}
webView.load(URLRequest(url: URL(string: "https://apple.com")!))
}
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
let navigationController = UINavigationController(rootViewController: TargetViewController())
navigationController.modalPresentationStyle = .fullScreen
present(navigationController, animated: true)
}
}
class TargetViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Set up the WebView
let webView = WKWebView(frame: view.frame, configuration: WKWebViewConfiguration())
view.addSubview(webView)
webView.frame = view.frame
if #available(iOS 16.4, *) {
webView.isInspectable = true
} else {
// Fallback on earlier versions
}
webView.load(URLRequest(url: URL(string: "https://apple.com")!))
}
}
Observations:
The JavaScript within the WebView stops executing only on physical devices running iOS 17.5.1.
This issue does not occur on the iOS 17.5 simulator.
Devices running iOS 17.4.1 or earlier do not experience this issue.
Request for Assistance:
Could you please provide any insights or potential workarounds for this issue? Additionally, if this is a known bug, any information on upcoming fixes would be highly appreciated.
Thank you.
We are using a WKWebKit based Cordova application and we are getting WKWebKit crash resulting in blank page.
The same web app is working in browser and other platforms. Upon investigation we found the memory used in iOS app using safari debugger / profiler.
The total memory used is 870.13 MB. Break up of that is
Page: 549MB
JavaScript: 321.13MB
However, the max comparison for memory shown in safari is 1.37GB while the current usage is 870.13MB. Is there any internal memory calculation for crash cutoff?
In this case the current memory is around 62% of the max comparison. Hence, we need to know whether this is the expected behaviour from iOS platform.
JetsamEvent-2024-05-23-102822.ips
Since my question exceeds 700 words, please check it in the attachment. Thank you!
Question
i can sure the app already hava the camera access, but in the embedded html, i still cannot open the camera. And this HTML page is work at Safari, but cant work on app when the page is embedded in app.
there is the error message:
DOMException: undefine is not an object (evaluating 'navigator.mediaDevices.getUserMedia')
and i also try to use 'navigator.getUserMedia' and 'navigator.mediaDevices.enumerateDevices()', this all dont work.
I am new to swift, so any advice would be appreciated. So the I have seen URL and URLSession return a timeout response, the android varient of my app does not show this issue.
class HasInternet: ObservableObject {
let monitor = NWPathMonitor()
let queue = DispatchQueue(label: "Monitor")
private var status: NWPath.Status = .requiresConnection
@Published var isConnected = false
init(){
monitor.pathUpdateHandler = { [weak self] path in
if let url = URL(string: "https://google.com") {
var request = URLRequest(url: url)
request.httpMethod = "HEAD"
request.timeoutInterval = 30
let sessionConfig = URLSessionConfiguration.default
sessionConfig.timeoutIntervalForRequest = 30.0
sessionConfig.timeoutIntervalForResource = 60.0
URLSession(configuration: sessionConfig)
.dataTask(with: request) { (_, response, error) -> Void in
guard error == nil else {
return
}
guard (response as? HTTPURLResponse)?
.statusCode == 200 else { return }
DispatchQueue.main.async {
self?.isConnected = true
}
}
.resume()
}
}
monitor.start(queue: queue)
}
}
Here is another place with the same behaviour.
func post(dModel: DialogModel? = nil, url: String, type: responseTypes, body: [String: Any], headers: [headerType], async: Bool = true) { //async
let semaphore = DispatchSemaphore(value: 0)
let timeout: TimeInterval = 10
if let url = URL(string: url) {
var request = URLRequest(url: url)
request.httpMethod = "POST"
request.timeoutInterval = 30
for header in headers {
request.setValue(header.value, forHTTPHeaderField: header.key)
}
do {
request.httpBody = try JSONSerialization.data(withJSONObject: body, options: .prettyPrinted)
} catch let error {
self.processError(dModel: dModel, error: error.localizedDescription, type: .report)
return
}
let sessionConfig = URLSessionConfiguration.default
sessionConfig.timeoutIntervalForRequest = 30.0
sessionConfig.timeoutIntervalForResource = 60.0
URLSession(configuration: sessionConfig)
.dataTask(with: request) { (data, response, error) -> Void in
if let error = error {
self.processError(dModel: dModel, error: error.localizedDescription, type: .report)
if(async){
semaphore.signal() // Signal semaphore even in case of error
}
return
}
if let httpResponse = response as? HTTPURLResponse{
if let unWrappedData = data {
if let httpResponseData = String(data: unWrappedData, encoding: .utf8) {
self.parse(dModel: dModel, type: type, response: httpResponseData, statusCode: httpResponse.statusCode)
}
}
} else {
self.processError(error: "Invalid response")
}
if(async){
semaphore.signal() // Signal semaphore after processing the response
}
}
.resume()
if(async){
semaphore.wait(timeout: .now() + timeout)
}
} else {
processError(error: "Invalid URL")
}
}
17.5+, when the wkwebview is not visible, the setTimeout function fails to execute when it reaches time.how to fix?
I use the WKWebView to show my content. And inside it, I also used a shared worker to run my task. And while I move focus out, the WKWebview is still working but the tasks inside shared worker stops. Is this by design or a bug?
Do you have any suggestions to handle this situation to let the task inside shared worker to continue while focus changes.
In my project, I'm using the WKWebView to display the Google OAuth popup. And after it appears, the JS window.opener is null, and because of that the original window cannot receive an auth token in a callback. This works perfectly fine in iOS 17.0 and earlier, but broken starting from 17.5. I've tested on the 18.0 too - same results the opener is always null no matter what I try.
Web Part:
<html>
<head>
<script src="https://accounts.google.com/gsi/client" async></script>
</head>
<script type="text/javascript">
var global = {};
window.addEventListener("message", function (ev) {
console.log("=== Event Listener ===");
console.log(ev);
});
function client() {
if (global.client === undefined) {
global.client = google.accounts.oauth2.initTokenClient({
client_id: '<client_id>',
scope: 'https://www.googleapis.com/auth/userinfo.email \
https://www.googleapis.com/auth/userinfo.profile',
callback: function (responseToken) {
console.log("=== Callback ===");
console.log(responseToken);
let auth = document.getElementById("auth");
auth.textContent = 'Token: ' + responseToken.access_token
}
});
}
return global.client;
}
function googleOauthClient() {
console.log("Trying to login");
let auth = document.getElementById("auth");
auth.textContent = 'In Progress...';
client().requestAccessToken();
}
</script>
<body>
<div id="center">
<a onclick="googleOauthClient()"><h1>Google Login Attempt</h1></a>
<h2 id="auth"></h2>
</div>
</body>
</html>
In iOS showing popup is implemented as:
#import "WebViewController.h"
#import "SafariServices/SafariServices.h"
@interface WebViewController () <WKNavigationDelegate, WKUIDelegate> {
WKWebView *web;
WKWebView *popupWebView;
}
@end
@implementation WebViewController
- (void)loadView {
[super loadView];
WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init];
[[config preferences] setJavaScriptEnabled:YES];
[[config preferences] setJavaScriptCanOpenWindowsAutomatically:NO];
[[config defaultWebpagePreferences] setAllowsContentJavaScript:YES];
[config setAllowsInlineMediaPlayback:YES];
web = [[WKWebView alloc] initWithFrame:self.view.frame configuration:config];
[web setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight];
[web setAllowsLinkPreview:YES];
[web setNavigationDelegate:self];
[web setUIDelegate:self];
[web setInspectable:YES];
[web setCustomUserAgent:[[web valueForKey:@"userAgent"] stringByAppendingString:@" Safari"]];
[[self view] addSubview:web];
}
- (void)viewDidLoad {
[super viewDidLoad];
NSString *url = @"http://localhost:8080/oauth"; // A simple Spring Boot App where HTML is hosted
[web loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:url]]];
}
- (void)webView:(WKWebView *)webView
decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction
decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
decisionHandler(WKNavigationActionPolicyAllow);
}
- (WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures {
if (navigationAction.targetFrame == nil) {
popupWebView = [[WKWebView alloc] initWithFrame:webView.frame configuration:configuration];
[popupWebView setCustomUserAgent: [webView customUserAgent]];
[popupWebView setUIDelegate:self];
[popupWebView setNavigationDelegate:self];
[popupWebView setInspectable:true];
[[[popupWebView configuration] defaultWebpagePreferences] setAllowsContentJavaScript:YES];
[[[popupWebView configuration] preferences] setJavaScriptCanOpenWindowsAutomatically:NO];
[[[popupWebView configuration] preferences] setJavaScriptEnabled:YES];
[[popupWebView configuration] setSuppressesIncrementalRendering:YES];
[webView addSubview:popupWebView];
[popupWebView loadRequest:[navigationAction.request copy]];
return popupWebView;
}
return nil;
}
- (void)webViewDidClose:(WKWebView *)webView {
[webView removeFromSuperview];
popupWebView = nil;
}
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error {
NSLog(@"didFailProvisionalNavigation: %@", [error description]);
}
- (void)webView:(WKWebView *)webView didFailNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error {
NSLog(@"didFailNavigation: %@", [error description]);
}
- (void)webView:(WKWebView *)webView requestMediaCapturePermissionForOrigin:(WKSecurityOrigin *)origin initiatedByFrame:(WKFrameInfo *)frame
type:(WKMediaCaptureType)type decisionHandler:(void (^)(WKPermissionDecision decision))decisionHandler {
decisionHandler(WKPermissionDecisionGrant);
}
- (void)webView:(WKWebView *)webView requestDeviceOrientationAndMotionPermissionForOrigin:(WKSecurityOrigin *)origin
initiatedByFrame:(WKFrameInfo *)frame decisionHandler:(void (^)(WKPermissionDecision decision))decisionHandler {
decisionHandler(WKPermissionDecisionGrant);
}
- (void)webView:(WKWebView *)webView runOpenPanelWithParameters:(WKOpenPanelParameters *)parameters
initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSArray<NSURL *> * _Nullable URLs))completionHandler {
completionHandler(nil);
}
@end
What I tried so far:
Disabled in the Settings -> Safari -> Cross-Origin-Opener-Policy;
Disabled popup blocking;
Added Allow Arbitrary Loads to Info.plist (actually added all possible security policies);
This actually works in the SFSafariViewController, but I cannot use it because I need to hide the Navigation and Status bar panels.
How it looks in 17.0
vs 17.5
And ideas about what I might be doing wrong? Or maybe some workaround I can utilize to get the Google OAuth token from the popup. Thanks in advance.
Hi:
I saw the post WWDC WebKit release notes said Safari will support largeblob extension from version 17. But when I create a credential with largeblob extension, different action takes according what authenticator used.
The credential options is:
"credCreateOptions": {
"rp": {
"name": "WebAuthn demo",
"id": "webauthn.turinggear.com"
},
"user": {
"name": "Jonathon.Runte97@gmail.com",
"displayName": "Jonathon.Runte97@gmail.com",
"id": "bqShD9YGRicjM-1foXiBqrdCzTHTuG1bkmKaxzn7oEM"
},
"challenge": "9BP4y2epk2b3MhRCRRS5tt4bdWYLPJcKBLMMiB_7p7E",
"pubKeyCredParams": [
{
"alg": -7,
"type": "public-key"
},
{
"alg": -257,
"type": "public-key"
}
],
"excludeCredentials": [],
"authenticatorSelection": {
"requireResidentKey": true,
"residentKey": "required",
"userVerification": "discouraged"
},
"attestation": "none",
"extensions": {
"credProps": true,
"largeBlob": {
"support": "preferred"
}
}
}
When i choose use iPhone be my authenticator, it seems that largeblob act as it should be:
"credential" : {
"id": "ZRxBdH4LKE4eiVxbwcA4Kmn9VZk",
"rawId": "ZRxBdH4LKE4eiVxbwcA4Kmn9VZk",
"response": {
"attestationObject": "o2NmbXRkbm9uZWdhdHRTdG10oGhhdXRoRGF0YViYSETDPyxegNfyH_fI_8t9iVRDn34LxYd8YH1k2u4xSk5dAAAAAPv8MAcVTk7MjAtuAgVX170AFGUcQXR-CyhOHolcW8HAOCpp_VWZpQECAyYgASFYICY6gkqg6OG_v1BlGCPj7gSwsu_c0vTmVzmfd7TsqEh5Ilgg_Cn0mAiO8QCx7J1xw809VBq8iI-U5pgY0I947B7XF9g",
"clientDataJSON": "eyJ0eXBlIjoid2ViYXV0aG4uY3JlYXRlIiwiY2hhbGxlbmdlIjoiOVcta3RMbEswemZDSXpFb2hNd3E3OTgxQXJlRzV0aEVBdmRHdXNHcUsxcyIsIm9yaWdpbiI6Imh0dHBzOi8vd2ViYXV0aG4udHVyaW5nZ2Vhci5jb20ifQ",
"transports": [
"internal",
"hybrid"
],
"publicKeyAlgorithm": -7,
"publicKey": "MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEJjqCSqDo4b-_UGUYI-PuBLCy79zS9OZXOZ93tOyoSHn8KfSYCI7xALHsnXHDzT1UGryIj5TmmBjQj3jsHtcX2A",
"authenticatorData": "SETDPyxegNfyH_fI_8t9iVRDn34LxYd8YH1k2u4xSk5dAAAAAPv8MAcVTk7MjAtuAgVX170AFGUcQXR-CyhOHolcW8HAOCpp_VWZpQECAyYgASFYICY6gkqg6OG_v1BlGCPj7gSwsu_c0vTmVzmfd7TsqEh5Ilgg_Cn0mAiO8QCx7J1xw809VBq8iI-U5pgY0I947B7XF9g"
},
"type": "public-key",
"clientExtensionResults": {
"largeBlob": {
"supported": true
}
},
"authenticatorAttachment": "platform"
}
Safari returns clientExtensionResults.largeBlob.supported= ture.
But when I use an NFC authenticator with the same credCreateOptions, safari didnot return clientExtensionResults section. Response as follows(ignore the challenge and others random data):
"credential" : {
"id": "uEVMzgsINXj7bHFD5Z5xbMGJ7k6tnrMQSLjB4yB8_0GxbUPoWYUYX8E3D9XB24Cv-PMh6cRpCFt5klUHqsot2Yc48BVu5TN8sbabTgped2x46ljdsxFzaNCA8D2y9FZK8BHLLZTKHNuzJw4SCYUkzg",
"rawId": "uEVMzgsINXj7bHFD5Z5xbMGJ7k6tnrMQSLjB4yB8_0GxbUPoWYUYX8E3D9XB24Cv-PMh6cRpCFt5klUHqsot2Yc48BVu5TN8sbabTgped2x46ljdsxFzaNCA8D2y9FZK8BHLLZTKHNuzJw4SCYUkzg",
"response": {
"attestationObject": "o2NmbXRkbm9uZWdhdHRTdG10oGhhdXRoRGF0YVj0SETDPyxegNfyH_fI_8t9iVRDn34LxYd8YH1k2u4xSk5FAAABeAAAAAAAAAAAAAAAAAAAAAAAcLhFTM4LCDV4-2xxQ-WecWzBie5OrZ6zEEi4weMgfP9BsW1D6FmFGF_BNw_VwduAr_jzIenEaQhbeZJVB6rKLdmHOPAVbuUzfLG2m04KXndseOpY3bMRc2jQgPA9svRWSvARyy2UyhzbsycOEgmFJM6lAQIDJiABIVggg2LXO5Q2U0ETrSxrLKxCfKKCTCitTCx9bpxD1Gw917ciWCDsxnw4Wd7M_UTiGQJ7swCMXN83nprsT8wkTlftXRizmw",
"clientDataJSON": "eyJ0eXBlIjoid2ViYXV0aG4uY3JlYXRlIiwiY2hhbGxlbmdlIjoiOUJQNHkyZXBrMmIzTWhSQ1JSUzV0dDRiZFdZTFBKY0tCTE1NaUJfN3A3RSIsIm9yaWdpbiI6Imh0dHBzOi8vd2ViYXV0aG4udHVyaW5nZ2Vhci5jb20ifQ",
"transports": [
"nfc"
],
"publicKeyAlgorithm": -7,
"publicKey": "MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEg2LXO5Q2U0ETrSxrLKxCfKKCTCitTCx9bpxD1Gw917fsxnw4Wd7M_UTiGQJ7swCMXN83nprsT8wkTlftXRizmw",
"authenticatorData": "SETDPyxegNfyH_fI_8t9iVRDn34LxYd8YH1k2u4xSk5FAAABeAAAAAAAAAAAAAAAAAAAAAAAcLhFTM4LCDV4-2xxQ-WecWzBie5OrZ6zEEi4weMgfP9BsW1D6FmFGF_BNw_VwduAr_jzIenEaQhbeZJVB6rKLdmHOPAVbuUzfLG2m04KXndseOpY3bMRc2jQgPA9svRWSvARyy2UyhzbsycOEgmFJM6lAQIDJiABIVggg2LXO5Q2U0ETrSxrLKxCfKKCTCitTCx9bpxD1Gw917ciWCDsxnw4Wd7M_UTiGQJ7swCMXN83nprsT8wkTlftXRizmw"
},
"type": "public-key",
"clientExtensionResults": {},
"authenticatorAttachment": "cross-platform"
}
Even without a clientExtensionResults.largeBlob.supported= false.
According to w3c, it should return clientExtensionResults.largeBlob.supported= false ?
The NFC authenticaor do support largeblob extensions and act write with the same credCreateOptions on edge on windows.
Does safari need some extra parameters?
My safari is the newest version of 17.5 (19618.2.12.11.6), mac version is Sonoma 14.5(23F79).
Thank you very much.
Dear Apple Support Team,
Upon upgrading to iOS 18, I have noticed a marked change in the character spacing of the PingFang font when rendered by WebKit, the web content rendering engine utilized by Safari and other web views in iOS. Specifically, the spacing between characters appears to have increased or altered in a manner that is not consistent with previous iOS versions or with the font's specifications as defined in CSS. This issue has significantly impacted the visual presentation of my web pages, causing a notable deviation from the intended design and potentially affecting user experience.
Expected Behavior:
The character spacing of PingFang font in WebKit on iOS 18 should maintain consistency with previous versions or adhere strictly to CSS specifications, ensuring a seamless transition for web developers and end-users alike.
Request for Assistance:
Could you please investigate this issue and confirm if it is a known bug or an intentional change in iOS 18? If it's a bug, could you provide an estimated timeline for a fix or a workaround that we can implement in the meantime? Additionally, any guidance on how to best address this issue in our H5 content, such as alternative font choices or CSS hacks, would be greatly appreciated. Thank you for your attention to this matter. We value the stability and consistency of the WebKit engine and the overall iOS platform, and we look forward to your prompt response and resolution.