I need to capture the HTTP logs triggered from Websheets on iPad to troubleshoot some production issues, I tried with USB option/Xcode but it is not capturing the HTTP logs. Enabled the developer Mode on ipad and the device is connecting to Mac. Appreciate immediate help on this.
Explore 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
What are the conditions under which Safari will clear local storage -- other than script executing localStorage.clear()?
Hi,
iOS 18.1 Safari 18 does not play HLS/.m3u8 audio tracks (while all previous iOS Safari still do).
If I turn on the Web Inspector toggle and put it on, restart Safari/ refresh the page, the player works.
Before filing a bug, are you already aware of such behavior or some way to deal with it?
I'm porting a web extension from Chrome to Safari, and I need to execute a method as a content script that is part of an ES module (in particular its default export).
In Chrome I use following snippet (via Stack Overflow)
const results = await chrome.scripting.executeScript({
args: ["/js/content_script/main.js"],
func: async (path) => {
const src = chrome.runtime.getURL(path);
const { default: asyncMain } = await import(src);
return asyncMain();
}
});
In Safari this seems to either not work, cause the Web Extension Background Context window to close, or crash the browser.
Am I doing something wrong, or is this not possible?
The strange_behaviour.mp4 video attached shows how when running a list of statements to open (startCamera) and close (closeCamera) the camera against a MacBook Pro 2019 using the FaceTime camera, these return their value almost immediately, when in reality the camera is still opening and closing.
We believe that there might be a queue for statements to run against the camera and it finishes the awaits when all the statements are inserted in the queue instead of when they are actually solved.
We also attached the expected_behaviour.mp4 video where we replicate the same flow but using an external camera instead of the FaceTime camera. In this video, the promises take a bit longer to return but they do once the camera has already been opened and closed the requested amount of times.
The project used in the videos is attached as project.tar.xz.
We would like to know if the behaviour in strange_behaviour.mp4 is replicable on your side and if there is a way to access the cameras to make it behave like when using an external camera (expected_behaviour.mp4).
Attachments: https://drive.google.com/drive/folders/1cOeFb5GMbh4mPOeZiZyyevk3N778Kn1M?usp=sharing
Starting Safari 18, Declarative Net Request redirections are no longer working (it used to be working on Safari 17). It seems to be related to the regex validation that is not working as expected.
Here is an example of our DNR rule:
{
priority: 1,
action: {
type: 'redirect',
redirect: {
regexSubstitution: `${scheme}//${extensionHost}/index.html\\1#/\\2`,
},
},
condition: {
// app.dashlane.com, *.app.dashlane.com
regexFilter: '^https?://w*\\.?app\\.dashlane\\.com(\\??[^/#]*)[^#]*#?/?(.*)$',
resourceTypes: [
'main_frame'
],
},
}
Is it a known issue ?
Also, it seems to be related to this existing issue:
https://forums.developer.apple.com/forums/thread/763505
Any ideas why safaridriver is asking for "password to make changes" when launching?
This only started after upgrading to Sequoia 15.1 and Safari 18, was working fine before that.
I am admin on the machine.
JavascriptCore doesn't come with any support for setTimeout (which is an API on the window/DOM object not provide din JavaScriptCore). So you need to implement a version of this yourself - no worries on that (there are examples to refer to out there, so it is fairly easy to set this up).
But I have come across an issue with this that I am not sure how to handle properly. It relates to when the timer callback fires and runs code in the JavaScript engine itself.
Consider this code snippet (assume I have provided an implementation of setTimeout):
console.log('Hello - here we go');
setTimeout(() => {
console.log('Hi from setTimeout callback ...');
}, 0);
Promise.resolve().then(() => {
console.log('Hi from promise');
});
console.log('Hi from main block');
In Node.js or say Safari, I would see this output:
Hello - here we go
Hi from main block
Hi from promise
Hi from setTimeout callback ...
So the promise then() is handled before the settimeout callback is handled. I think this is basically because Promise then() handlers are pushed onto something like a microtask queue, and the setttimeout callbacks on a separate queue, and the microtask queue is emptied before any other queue is processed (after completing the current event loop of course).
But when I implement this in JavaScript core, I don't always see the above - instead I can have:
Hello - here we go
Hi from main block
Hi from setTimeout callback ...
Hi from promise
So the timeout callback can be run BEFORE the promise handler. This obviously is different from Node or Safari.
Now I assume that is because the timeout callback is triggered from Swift native code that uses the call() API on a JSValue object that is provided when the settimeout is given to the native layer to process. And it seems that when native code attempts to execute JavaScript code (via call() or similar) then this is just executed as soon as possible - obviously not interrupting the Javascript core when executing any current event loop code, but potentially running between the point when the Javascript core finishes a normal event loop cycle and then starts processing the queued promise handlers.
This means that code that runs nicely in Node (for example) might not work the same way due to this behaviour.
Also, I also notice another thing: if JavaScript code makes a call to a native-provided method (e.g. by calling the setTimeout I show above, which I implement via a native-side handler) then during that call from JavaScript, it is possible for the native side to execute a call() and run Javascript code it wants. Again this is not what would happen in Node or Safari: it is not possible for timeouts (or network completions) to interrupt any 'builtin' function call, but in JavascriptCore it certainly is (to get around this I set a flag on the JavaScript side indicating a native call is being made, and if any native-triggered callback occurs on the javascript side when this flag is set, I have to 'queue' it via a promise handler for execution AFTER the current event loop is complete).
Are these known issues with Javascript core and are there ways to get around them?
thanks
Safari samesite none cookie added after login but we are facing the issue in post method.
While doing the post method cookie not getting into request header.And always sending the new cookie in the response header.
Safari not sending the cookie into request header with samesite none.
Kindly help me out.
I'm experiencing a persistent issue with transparent WebM videos rendered via WKWebView in an iOS Capacitor app. The videos play normal, however, they display a black background frame, which does not occur in the web version of the app. I've tried:
Playing with the css setting,
Enabling experimental WKWebView features,
Adjusting meta tags for inline video playback and hardware acceleration.
That my code:
showThumbs={false}
showStatus={false}
showIndicators={true}
showArrows={false}
infiniteLoop={true}
autoPlay={true}
interval={5000} // Change slide every 5 seconds
onChange={(index) => {
if (playerRefs.current[index]) {
playerRefs.current[index]?.seekTo(0);
playerRefs.current[index]?.getInternalPlayer()?.play();
}
}}
>
{videos.map((video, index) => (
<div key={index} className="video-slide">
<ReactPlayer
ref={(player) => (playerRefs.current[index] = player)}
url={video.src}
playing={isLoaded[index]} // Play only when video is loaded
loop
muted
width="100%"
onReady={() => handleVideoReady(index)} // Set loaded state when video is ready
style={{ backgroundColor: 'transparent' }}
config={{
file: {
attributes: {
playsInline: true,
},
},
}}
/>
<p className="description">{video.description}</p>
</div>
))}
</Carousel>
Working with React, capacitor.
The videos work perfect when I test it on the web app, the problem occurs just on my ios app
I'm experiencing a persistent issue with transparent WebM videos rendered via WKWebView in an iOS Capacitor app. The videos display a black background frame, which does not occur in the web version of the app. I've tried:
Enabling experimental WKWebView features.
Adjusting meta tags for inline video playback and hardware acceleration.
That's my code:
<Carousel
showThumbs={false}
showStatus={false}
showIndicators={true}
showArrows={false}
infiniteLoop={true}
autoPlay={true}
interval={5000} // Change slide every 5 seconds
onChange={(index) => {
if (playerRefs.current[index]) {
playerRefs.current[index]?.seekTo(0);
playerRefs.current[index]?.getInternalPlayer()?.play();
}
}}
>
{videos.map((video, index) => (
<div key={index} className="video-slide">
<ReactPlayer
ref={(player) => (playerRefs.current[index] = player)}
url={video.src}
playing={isLoaded[index]} // Play only when video is loaded
loop
muted
width="100%"
onReady={() => handleVideoReady(index)} // Set loaded state when video is ready
style={{ backgroundColor: 'transparent' }}
config={{
file: {
attributes: {
playsInline: true,
},
},
}}
/>
<p className="description">{video.description}</p>
</div>
))}
</Carousel>
It is not occur in the web version of the app (testing with xCode).
After upgrading to Safari version 18, we encountered an issue with my extension’s background script not being able to access cookies. Previously, in Safari versions 17 and below, the extension worked as expected. Now, when the extension tries to retrieve cookies using browser.cookies.getAll(), it returns an empty list. However, if we open the extension’s developer tools, the cookies are visible and accessible.
It seems that Safari only provides cookie data after the developer tools have been opened. However, after relaunching Safari and launching the extension without opening the developer tools, browser.cookies.getAll() still returns an empty list.
Has anyone else experienced this?
STEPS TO REPRODUCE
Download this minimal app : https://www.icloud.com/iclouddrive/0bajlhnuQaG6T5NsFKXEB0U9Q#test%5Fcookies
Compile test_mv2 extension (in test_cookies.getAll.zip).
Launch test_mv2.app and activate extension.
Click on the extension's button (browserAction).
Open the developer tools.
Observe an empty list of cookies.
Click on the extension's button (browserAction).
Cookies are retrieved as expected.
The specification states that the timestamp property is a DOMHighResTimeStamp which always represents a value in milliseconds. However, in my testing (on iOS as I don't have a mac) the timestamp is given as seconds. This could break compatibility if an app/library is not tested in Safari.
Worse is that the deviation seems to be undocumented as every compatibility chart states full compatibility and defines the property as milliseconds.
Any workaround would also be up to one frame incorrect. So a stutter can affect input accuracy.
I know this might seem small but it could mean that an app or game is unplayable in Safari if it relies on this for input.
I need to load both the local source images and remote source images in WKWebView.
The url of remote images is a relative url.
To load the local images in WebView, I could use loadFileURL(:allowingReadAccessTo:).
To load the remote images in WebView, I could use loadHTMLString(:baseURL:).
But, I need both the local images and remote images.
How can I do?
hi anybody can help me with webpush fcm? after some hours and pwa closed the webpush notification doesn't arrive until i re-open webapp and recreate a new token
Hi,
I implemented push notifications on my PWA, and it work fine with all browsers except with Safari. I followed all the recommendations given by Brady Eidson in this video :
Meet Web Push for Safari
And the result is that all the push notification process work fine with others browsers, from the subscription to the notification delivery and display. But with Safari the endpoint is always empty and I do not understand why. No error is triggered during subscription. Just the result is a subscription with an empty endpoint.
I have the same result on iPad, iPhone and iMac. Everything is working well with others browsers or with android smartphone. But contrary to what Brady Eidson promised in his video, it does not work with Safari.
Hi,
I implemented push notifications on my PWA, and it work fine with all browsers except with Safari. I followed all the recommendations given by Brady Eidson in this video :
Meet Web Push for Safari
And the result is that all the push notification process work fine with others browsers, from the subscription to the notification delivery and display. But with Safari the endpoint is always empty and I do not understand why. No error is triggered during subscription. Just the result is a subscription with an empty endpoint.
I have the same result on iPad, iPhone and iMac. Everything is working well with others browsers or with android smartphone. But contrary to what Brady Eidson promised in his video, it does not work with Safari.
When a video in Safari is played in fullscreen mode and the user pauses it, an overlay (such as a play button or other controls) appears. This affects the user experience, as we want to avoid showing the overlay during fullscreen viewing after the video is paused.
Expected Behavior:
The overlay should not appear after the video is paused in fullscreen mode.
Steps to Reproduce:
Open a webpage https://slides-dev.pitchavatar.com/rtxuf in Safari.
Start playing the video.
Enter fullscreen mode.
Pause the video.
The overlay appears after the video is paused.
Screenshot:
Additional Information:
Safari version: Safari 18.0.1 (20619.1.26.31.7)
Environment: macOS Sequoia 15.0.1 (24A348)
We would like to know if there is there any way to prevent the overlay from appearing in Safari when the video is paused in fullscreen mode.
Hello, Team.
We used WKWebView for our project. We loaded the HTML file into the webview and added the following configuration.
weak var webView: WKWebView!
func configWebView() {
let webViewConfig = WKWebViewConfiguration()
let controller = WKUserContentController()
controller.add(self, name: "sometest")
webViewConfig.userContentController = controller
webViewConfig.processPool = WKProcessPool()
webViewConfig.setValue(true, forKey: "allowUniversalAccessFromFileURLs")
webViewConfig.mediaTypesRequiringUserActionForPlayback = []
let webpagePreferences = WKWebpagePreferences()
webpagePreferences.allowsContentJavaScript = true
webViewConfig.defaultWebpagePreferences = webpagePreferences
webViewConfig.websiteDataStore = WKWebsiteDataStore.default()
webView = WKWebView(frame: .zero, configuration: webViewConfig)
webView.navigationDelegate = self
webView.uiDelegate = self
webView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(webView)
NSLayoutConstraint.activate([
webView.topAnchor.constraint(equalTo: view.topAnchor),
webView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
webView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
webView.trailingAnchor.constraint(equalTo: view.trailingAnchor)
])
loadWebView()
}
func loadWebView() {
guard let documentsDirectoryURL = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first else {
return
}
let contentFolderURL = documentsDirectoryURL.appendingPathComponent("content")
let assetFolderURL = contentFolderURL.appendingPathComponent(interactiveGUID)
if FileManager.default.fileExists(atPath: assetFolderURL.path) {
let documentsPath = NSSearchPathForDirectoriesInDomains(.documentDirectory, .userDomainMask, true).first!
let documentsURL = URL(fileURLWithPath: documentsPath)
let fileToLoadPath = (documentsPath as NSString).appendingPathComponent("content/index_p.html")
let fileURL = URL(fileURLWithPath: fileToLoadPath)
autoreleasepool {
DispatchQueue.main.async { [weak self] in
guard let self = self else { return }
self.webView.loadFileURL(fileURL, allowingReadAccessTo: documentsURL)
}
}
}
We are experiencing webview crashes when loading an HTML file. What happened when I loaded the video file? It automatically looped. Webview frequently crashes when the HTM/JS file is loaded.
When a webview crashes, the delegate method usually calls webViewWebContentProcessDidTerminate. This method calls webview.reload().
Also we are clear and cache/ deallocate eveything when i initialized those configuration mentioned as the above.
Can you suggest a solution to this? Why is webview crashing?
Thank you.
Description:
When using a multilingual keyboard that includes Korean in iOS 18, the input element's onChange event is triggered multiple times instead of just once. This issue occurs not only when entering numbers with input type="tel" or inputMode="numeric", but also when entering text with input type="text". This causes unexpected behavior in forms and other input-related functionalities.
Affected Devices and OS Version:
Device: iPhone 16 Pro
OS Version: iOS 18.0
You can reproduce the issue with this CodeSandbox example:
https://codesandbox.io/p/sandbox/elegant-dream-jnqh39
Steps to reproduce:
Use a multilingual keyboard (e.g., Korean and English) on iOS 18.
Type some text into the input field (input type="text").
Also try entering numbers using input type="tel" or inputMode="numeric".
Observe that the onChange event is fired multiple times for both text and numeric input.
Expected behavior:
The onChange event should only be triggered once when text or numeric input changes.
Additional Information:
This issue has been reported under feedback ID FB15377631. Currently waiting for a response from Apple regarding this feedback.