Hai guys,
I'm trying to do autofocus on the search input while user clicks the search icon but its not working as expected in iPhone and iPad so go through some blogs and stackoverflow they mentioned the apple has removed the focus() from touchable device for usablity reason is anyone come up with the same issue or having solution for this kindly share. That must be helpful for me.
General
RSS for tagExplore the integration of web technologies within your app. Discuss building web-based apps, leveraging Safari functionalities, and integrating with web services.
Post
Replies
Boosts
Views
Activity
PLATFORM AND VERSION
iOS
Development environment: Other: Xamarin iOS App
Run-time configuration: iOS 14.4.2 and above
DESCRIPTION OF PROBLEM
We are using WKWebView control in our application. It loads a page, wherein there is a code which gets triggered to execute a Synchronous Ajax/XmlHttpRequest. This request needs about 1 min time to complete, but it gets aborted after 10 secs.
Observed in iPhone 6S 14.4.2. Also seen the same behavior in the latest version of iPhone and iPad OS.
Need help on the below points:
How can I extend this timeout?
Making it an Asynchronous call would have regression. Hence the ask for any other alternative to extend this timeout.
STEPS TO REPRODUCE
In the WKWebView have a webpage, which gives a Synchronous ajax/XmlHttpRequest call to a Web API, which takes more than 10 seconds to complete. The Ajax call sample code is as below, which uses jquery:
var startTime = performance.now();
$.ajax({
async: false, // Synchronous ajax call
type: "POST",
url: "http://testsite:8000/api/RunTestTimer",
contentType: "application/json; charset=utf-8",
data: JSON.stringify({
timeInSeconds: 15
}), // timeInSeconds is the parameter name in the Web API, which I used to run a timer on the server-side for the value passed to the ajax call
dataType: "json",
beforeSend: skelta.forms.utilities.addRequestHeaders
})
.done(function (result) {
var endTime = performance.now();
var message = "Request Successful (Time Taken to execute: " + ((endTime - startTime) / 1000).toFixed(3) + " secs; Type: " + "POST" + "; Async: " + "FALSE" + "; Timer: " + "15" + " seconds):" + JSON.stringify(result);
console.log(message);
})
.fail(function (result) {
var endTime = performance.now();
var message = "Request Failed (Time Taken to execute: " + ((endTime - startTime) / 1000).toFixed(3) + " secs; Type: " + "POST" + "; Async: " + "FALSE" + "; Timer: " + "15" + " seconds):" + JSON.stringify(result);
console.log(message);
});
i have a site that host my videos using vdocipher. My videos are not showing up on apple devices. vidocipher instructed me to create an apple account and to Request Apple FairPlay DRM Production License.
Do i have to pay to be able to do that?
Hello,
I've encountered a problem in Safari where if I have an application hosted locally, it causes the files of dependencies such as CSS, JS, SVG. etc. to not load. Interestingly, every time the same page refreshes, different files are not loaded and it is very random which files are not loaded at which time. The error I see in the console is "Failed to load resource: unable to parse response" and for websockets I get: "WebSocket connection to 'ws://127.0.0.1:8000/socket.io/?EIO=4&transport=websocket&sid=MuZEbWIVEKZ2OJZAAABi' failed: WebSocket is closed before the connection is established.". Interestingly, the problem only appears when the application is hosted locally, when it is hosted in the cloud, the problem does not appear. Similarly, the problem only appears in Safari. I'm using macOS 15.0 (24A335) and Safari version 18.0 (20619.1.26.31.6). Have you encountered such a problem and do you have any idea how to solve this problem?
Thank you for your reply.
iOS 18 WKWebView images are not loading, no errors in older versions.
The example while loading HTML is as follows. A problem occurs when you pull an image from a url. To get a URL image you need a cookie or something. I add them too, but it doesn't work on iOS 18. I get the error "An error occurred trying to load the resource." and a blue question mark on the screen.
webView.configuration.websiteDataStore.httpCookieStore.setCookie(cookie)
<html>
<head>
<style>
body {
font-family: -apple-system;
margin: 0;
padding: 0;
text-align: center;
}
img {
width: 100%;
height: auto;
}
</style>
</head>
<body>
<h1>Resim Görüntüleme</h1>
<img src="https://xx.***.xx/example.png">
</body>
</html>
"""
I have an issue with web ads not working in Safari versions earlier than 16.4.
While debugging Safari Web Ads I found out that I don't get postbacks from versions 16.4 or below from Safari, although there are no technical limitations and the documentation says that web ads should work starting from versions 16.1 https://developer.apple.com/documentation/storekit/skadnetwork/skadnetwork_release_notes/skadnetwork_4_release_notes
For ads that appear in an app, the app is built with iOS 16.1 SDK or later. For web ads, the ad appears in Safari 16.1 or later.``
Maybe I missed something and Apple didn't update the documentation, is that normal?
Maybe it's related to this release and there was a technical problem with Apple? https://developer.apple.com/documentation/ios-ipados-release-notes/ios-ipados-16_4-release-notes/#SKAdNetwork
Has anyone encountered the same problem and how did you fix it?
Thanks!
Hi, I am building a Next.js app on top of Mapkit JS but I keep getting this error randomly. The map works most of the time but this error triggers randomly sometimes when the map loads even though I have not used the fillOpacity parameter at all. Even defining the parameter still causes the error.
mapkit.js:2 Uncaught TypeError: [MapKit] Expected a number value for Style.fillOpacity, but got NaN instead.
at Object.checkType (mapkit.js:2:205350)
at set fillOpacity (mapkit.js:2:670243)
at set fillOpacity (mapkit.js:2:673537)
at _.performScheduledUpdate (mapkit.js:2:643649)
at mapkit.js:2:221322
at m (mapkit.js:2:221358)
Code:
import React, { useEffect, useRef } from "react"
import { useTheme } from "next-themes"
declare global {
interface Window {
mapkit: any
}
}
interface MapKitProps {
latitude: number
longitude: number
zoom: number
}
const MapKit: React.FC = ({ latitude, longitude, zoom }) => {
const mapRef = useRef(null)
const mapInstanceRef = useRef(null)
const { setTheme, theme } = useTheme()
useEffect(() => {
if (window.mapkit && mapRef.current) {
window.mapkit.init({
authorizationCallback: (done: (token: string) => void) => {
const token = process.env.NEXT_PUBLIC_APPLE_MAPKIT_TOKEN
if (token) {
done(token)
} else {
console.error("MapKit JS token is not set")
}
},
})
// Clean up the previous map instance if it exists
if (mapInstanceRef.current) {
mapInstanceRef.current.destroy()
}
// Create a new map instance
mapInstanceRef.current = new window.mapkit.Map(mapRef.current, {
center: new window.mapkit.Coordinate(latitude, longitude),
zoom: zoom,
colorScheme: theme,
_allowWheelToZoom: true,
})
}
// Cleanup function to destroy the map instance when the component unmounts
return () => {
if (mapInstanceRef.current) {
mapInstanceRef.current.destroy()
}
}
}, [latitude, longitude, zoom])
return <div ref={mapRef} style={{ width: "100%", height: "100%" }} />
}
export default MapKit
Since iOS 18.1 launched as a beta, we've been getting reports from end users on iPhone 15 Pro and iPhone 15 Pro Max specifically. They're reporting that our WebView is unable to load our local HTML content. I'm curious if anyone else has had their app or users run into this issue?
So far I've tried installing the most recent XCode Beta 16B5014f and installed an 18.1 emulator, but our app worked fine. It's also working fine on all my real devices, but we don't have a 15 Pro to test on. I'm curious if this is related to the processor on these devices and how they are intended to support Apple's new AI coming in 18.1.
My website is using a lot of memory. JavaScript Allocations Timeline shows that js occupies 130MB. However, instruments show that the overall memory usage of webview reaches 480MB. I would like to know if there is any tool to analyze the distribution of this 480MB of memory usage.
i change everything about icon file in my web server but the icon just don't change at all.
why? is it about cache problem on the hugo or it is bug on safari?(i have remove cache on the iphone)
My Safari extension has a WKWebView in the main app and an HTML popup window in Safari. For some reason, both are in dark mode on visionOS, even though the device environment is light and Safari tabs are also showing light mode. Why does this happen, and how can I change it?
Hello,
we built an ios app using the capacitor framework (app rendered in webview) and recently implemented a cookie based authentication mechanism.
What we have no reliable information about is for how long these first-party cookies are stored and if/when they are cleared by some Apple policy. There is a lot of conflicting information out there and I want to reach out here to get some definitive information about this topic.
For how long are first-party cookies persisted using ios webview via capacitor. Is there any way to influence that behaviour?
Thank you very much.
Best Regards
Marcus
I have a small example project that ran on both the simulator and a connected iPhone but now it and all other projects are failing with the same error. I am using Xcode 16.0 on MacOS Sonoma 14.6.1., iPhone 11 with iOS 18. Thank you in advance.
The error is:
Failed to resolve host network app id to config: bundleID: com.apple.WebKit.Networking instance ID: Optional([_EXExtensionInstanceIdentifier: 1163B5D2-09D3-4704-9564-61099502138B])
WebContent process (0x114018680) took 1.375772 seconds to launch
GPU process (0x1140a0630) took 1.228457 seconds to launch
Networking process (0x114034d00) took 1.426249 seconds to launch
0x105820a20 - [pageProxyID=7, webPageID=8, PID=34786] WebPageProxy::didFailProvisionalLoadForFrame: frameID=1, isMainFrame=1, domain=NSURLErrorDomain, code=-1200, isMainFrame=1, willInternallyHandleFailure=0
Message from debugger: killed
Below is the code from one of the examples:
import UIKit
import WebKit
class ViewController: UIViewController {
let webView: WKWebView = {
let prefs = WKWebpagePreferences()
prefs.allowsContentJavaScript = true
let configuration = WKWebViewConfiguration()
configuration.defaultWebpagePreferences = prefs
let webView = WKWebView(frame: .zero, configuration: configuration)
return webView
}()
override func viewDidLoad() {
super.viewDidLoad()
view.addSubview(webView)
guard let url = URL(string: "https://google.com") else {
return
}
webView.load(URLRequest(url: url))
//evaluate JavaScript
DispatchQueue.main.asyncAfter(deadline: .now()+5){
self.webView.evaluateJavaScript("document.body.innerHTML") { result, error in
guard let html = result as? String, error == nil else {
return
}
print(html)
}
}
}
override func viewDidLayoutSubviews(){
super.viewDidLayoutSubviews()
webView.frame = view.bounds
}
}
When I create a polyline and add it to the map, it will disappear if the map is moved. If I add a polygon or annotation, it remains on the map if the map is moved:
const polyline = new mapkit.PolylineOverlay(path, {
style: new mapkit.Style({
lineWidth: 5,
strokeColor: '#007AFF',
lineJoin: 'round',
lineCap: 'round'
})
})
map.addOverlay(polyline)
// disappears if the map moves or zoom changes
const polygon = new mapkit.PolygonOverlay(shapes, {
style: new mapkit.Style({
fillRule: 'evenodd'
}),
enabled: false
})
map.addOverlay(polygon)
// remains on map when map moves or zoom changes
Why is it inconsistent? How can I make the polyline stay until I explicitly remove it?
I have a product developed base on the WKWebview.
I use Azure as IDP configured for login in. Azure have “keep me sign in” to allow user no need to enter credential again after reopen the app.
Every thing works fine in IOS 17. 16. But keep me sign in function not works anymore after upgrade device to IOS 18. User need to enter credential every time after reopen the app.
Is there any thing change in WKWebview in IOS 18?
When I run this program on iphone ( ios 18.0 with Xcode 16.0 (16A242d) ) I get these warnings from iphone ( not from the preview running ) :
Could not create a sandbox extension for '/var/containers/Bundle/Application/7BAE-82-4A3-98D-75A49B/xxxx.app'
Updated list with error: DownloadFailed
Updated list with error: DownloadFailed
Updated list with error: DownloadFailed
Updated list with error: DownloadFailed
Updated list with error: DownloadFailed
The programe is simple :
import SwiftUI
import WebKit
struct ContentView: View {
let htmlContent = """
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
</head>
<body>
<h1>Hello, World!</h1>
<p>This is a simple webpage displayed in a WebView.</p>
</body>
</html>
"""
var body: some View {
WebView(htmlContent: htmlContent)
.edgesIgnoringSafeArea(.all)
}
}
struct WebView: UIViewRepresentable {
let htmlContent: String
func makeUIView(context: Context) -> WKWebView {
let webView = WKWebView()
webView.loadHTMLString(htmlContent, baseURL: nil)
return webView
}
func updateUIView(_ uiView: WKWebView, context: Context) {
// No need to update the view since the content is static
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
any reason for this ?
otherwise the program is running correctly, but is this a bug or a programming problem?
So recently Intune add support for controlling safari web extension enablement using the new ddm configuration added in Macos 15, but unfortunately I can't make it work no matter what I try.
On the destination machine I see the that a user declaration for safari extension has been created, but there is not details on which extension they applied and it seems faulty (See attachment)
I have 2 questions:
Has anyone managed to make it work?
Is there a way to test this declaration like I can do with Mobile config by manually load it to the machine?
Thank you.
Here are the crash logs from Firebase Crashlytics
Crashed: com.apple.IPC.ReceiveQueue
0 libsystem_platform.dylib 0x70c8 _os_unfair_lock_recursive_abort + 36
1 libsystem_platform.dylib 0x42d8 _os_unfair_lock_lock_slow + 308
2 WebKit 0xe2a5f0 <redacted> + 44
3 WebKit 0xe2a264 <redacted> + 320
4 WebKit 0xe29b24 <redacted> + 304
5 WebKit 0x1d8fc <redacted> + 740
6 libdispatch.dylib 0x40d0 _dispatch_client_callout + 20
7 libdispatch.dylib 0x7580 _dispatch_continuation_pop + 596
8 libdispatch.dylib 0x1b53c _dispatch_source_latch_and_call + 420
9 libdispatch.dylib 0x1a104 _dispatch_source_invoke + 836
10 libdispatch.dylib 0xb560 _dispatch_lane_serial_drain + 368
11 libdispatch.dylib 0xc1e0 _dispatch_lane_invoke + 380
12 libdispatch.dylib 0x17258 _dispatch_root_queue_drain_deferred_wlh + 288
13 libdispatch.dylib 0x16aa4 _dispatch_workloop_worker_thread + 540
14 libsystem_pthread.dylib 0x4c7c _pthread_wqthread + 288
15 libsystem_pthread.dylib 0x1488 start_wqthread + 8
We are encountering an issue where the Safari extension we are developing stops working while in use on relatively new iOS versions (confirmed on 17.5.1, 17.6.1, and 18). Upon checking the Safari console, the content script is displayed in the extension script, so the background script or Service Worker must be stopping. The time until it stops is about 1 minute on 17.5.1 and about one day on 17.6.1 or 18.
When it stops, we would like to find a way to restart the Service Worker from the extension side, but we have not found a method to do so yet. To restart the extension, the user needs to turn off the corresponding extension in the iPhone settings and then turn it back on.
As mentioned in the following thread, it is written that the above bug was fixed in 17.6, but we recognize that it has not been fixed. https://forums.developer.apple.com/forums/thread/758346
On 17.5.1, adding the following process to the background script prevents it from stopping for about the same time as on 17.6 and above.
// Will be passed into runtime.onConnect for processes that are listening for the connection event
const INTERNAL_STAYALIVE_PORT = "port.connect";
// Try wake up every 9S
const INTERVAL_WAKE_UP = 9000;
// Alive port
var alivePort = null;
// Call the function at SW(service worker) start
StayAlive();
async function StayAlive() {
var wakeup = setInterval(() => {
if (alivePort == null) {
alivePort = browser.runtime.connect({ name: INTERNAL_STAYALIVE_PORT });
alivePort.onDisconnect.addListener((p) => {
alivePort = null;
});
}
if (alivePort) {
alivePort.postMessage({ content: "ping" });
}
}, INTERVAL_WAKE_UP);
}
Additionally, we considered methods to revive the Service Worker when it stops, which are listed below. None of the methods listed below resolved the issue.
①
Implemented a process to create a connection again if the return value of sendMessage is null. The determination of whether the Service Worker has stopped is made by sending a message from the content script to the background script and checking whether the message return value is null as follows.
sendMessageToBackground.js
let infoFromBackground = await browser.runtime.sendMessage(sendParam);
if (!infoFromBackground) {
// If infoFromBackground is null, Service Worker should have stopped.
browser.runtime.connect({name: 'reconnect'}); // ← reconnection process
// Sending message again
infoFromBackground = await browser.runtime.sendMessage(sendParam);
}
return infoFromBackground.message;
Background script
browser.runtime.onConnect.addListener((port) => {
if (port.name !== 'reconnect') return;
port.onMessage.addListener(async (request, sender, sendResponse) => {
sendResponse({
response: "response form background",
message: "reconnect.",
});
});
②
Verified whether the service worker could be restarted by regenerating Background.js and content.js.
sendMessageToBackground.js
export async function sendMessageToBackground(sendParam) {
let infoFromBackground = await browser.runtime.sendMessage(sendParam);
if (!infoFromBackground) {
executeContentScript(); // ← executeScript
infoFromBackground = await browser.runtime.sendMessage(sendParam);
}
return infoFromBackground.message;
}
async function executeContentScript() {
browser.webNavigation.onDOMContentLoaded.addListener((details) => {
browser.scripting.executeScript({
target: { tabId: details.tabId },
files: ["./content.js"]
});
});
}
However, browser.webNavigation.onDOMContentLoaded.addListener was not executed due to the following error.
@webkit-masked-url://hidden/:2:58295
@webkit-masked-url://hidden/:2:58539
@webkit-masked-url://hidden/:2:58539
③
Verify that ServiceWorker restarts by updating ContentScripts
async function updateContentScripts() {
try {
const scripts = await browser.scripting.getRegisteredContentScripts();
const scriptIds = scripts.map(script => script.id);
await browser.scripting.updateContentScripts(scriptIds);//update content
} catch (e) {
await errorLogger(e.stack);
}
}
However, scripting.getRegisteredContentScripts was not executed due to the same error as in 2.
@webkit-masked-url://hidden/:2:58359
@webkit-masked-url://hidden/:2:58456
@webkit-masked-url://hidden/:2:58456
@webkit-masked-url://hidden/:2:58549
@webkit-masked-url://hidden/:2:58549
These are the methods we have considered. If anyone knows a solution, please let us know.
declarativeNetRequest.getMatchedRules() gives us the below error:
Error retrieving tabs or matched rules: – Error: Invalid call to declarativeNetRequest.getMatchedRules(). The 'activeTab' permission has not been granted by the user for the tab.
We have added the "activeTab" permissions in the manifest (version 2). And in the device Safari extension settings we see that user has given permission as "allow".