Explore the integration of web technologies within your app. Discuss building web-based apps, leveraging Safari functionalities, and integrating with web services.

All subtopics
Posts under Safari & Web topic

Post

Replies

Boosts

Views

Activity

iOS 26 Safari & WebView: VisualViewport.offsetTop not reset after keyboard dismissal, causing fixed elements misplacement
System/device combinations where the issue does not occur: Physical device: iOS 26.0 (23A5318c) + iPhone 16 Pro Max System/device combinations where the issue does occur: System versions: Physical device: iOS 26.0 (23A5330a), iOS 26.0 (23A340) Simulator: iOS 26.0 (23A339) Device models: Physical device: iPhone 12 Reproducible in Safari, WKWebView, and UIWebView: Yes Actual behavior In WebView (and identically in Safari): Before the keyboard is shown, header/footer elements with position: fixed are correctly aligned with the screen viewport. Scrolling up/down works as expected. After the keyboard appears, the visualViewport position changes. Bug: When the keyboard is dismissed, visualViewport.offsetTop does not reset to 0. As a result, fixed header/footer elements remain misaligned: When scrolling down, the position looks correct. When scrolling up, the header/footer are visibly offset. Steps to reproduce Focus an input field → the keyboard appears Dismiss the keyboard Observe that visualViewport.offsetTop remains >0 (does not reset to zero) position: fixed header/footer elements are misplaced relative to the screen Expected behavior After the keyboard is dismissed, visualViewport.height should return to match the layout viewport, and visualViewport.offsetTop should reset to 0. When scrolling upward, fixed elements should remain correctly positioned within the layout viewport. Minimal reproducible demo A simple HTML file containing: A header and footer with position: fixed An input element to trigger the keyboard <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" /> <title>H5 吸顶吸底页面 Demo</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: Arial, sans-serif; height: 2000px; /* 设置内容高度 */ background-color: #f0f8ff; /* body 背景浅蓝色 */ padding-top: 120px; /* 预留 header 高度 */ padding-bottom: 60px; /* 预留 footer 高度 */ overflow-x: hidden; } /* 吸顶 Header */ header { position: fixed; top: 0; left: 0; width: 100%; height: 120px; background-color: #ff6b6b; /* 红色 */ display: flex; align-items: center; justify-content: center; color: white; font-size: 24px; font-weight: bold; z-index: 1000; } /* 吸底 Footer */ footer { position: fixed; bottom: 0; left: 0; width: 100%; height: 60px; background-color: #4ecdc4; /* 青绿色 */ display: flex; align-items: center; justify-content: center; color: white; font-size: 18px; font-weight: bold; z-index: 1000; } /* 输入框样式 */ .input-container { margin: 100px auto; width: 80%; max-width: 600px; text-align: center; } input[type='text'] { padding: 12px; font-size: 16px; border: 2px solid #ddd; border-radius: 8px; width: 100%; box-sizing: border-box; } input[type='text']:focus { outline: none; border-color: #4ecdc4; } </style> </head> <body> <!-- 吸顶 Header --> <header>吸顶 Header (120px)</header> <!-- 主体内容 --> <div class="input-container"> <input type="text" placeholder="请输入内容..." /> </div> <!-- 吸底 Footer --> <footer>吸底 Footer (60px)</footer> </body> </html>
10
11
3.6k
Oct ’25
Private Relay and locally hosted server
Enabling Private Relay seems to block XHR in Safari from reaching a local HTTPS server hosted by an iOS app, though it works in other browsers. Before (working): JS → https://local.example.com → 127.0.0.1 → OK After (blocked / no DNS reply probably): JS → https://local.example.com → ERR Is there any way to restore local domain access or mitigate this issue?
0
0
495
Oct ’25
iOS26 WKWebView:Remote page becomes unresponsive after loading local file
Subject: iOS 26 WKWebView: Remote Pages Become Unresponsive After Loading Local HTML Files Description We're experiencing a critical issue with WKWebView in a React Native 0.64.3 application where remote web pages become completely unresponsive after loading local HTML files in iOS 26. It works well before iOS26. Environment: React Native 0.64.3 iOS 26.0 Xcode 26.0.1 Using custom WKWebView implementations in Native modules Problem Details App loads local HTML files using loadFileURL:allowingReadAccessToURL: Later, when loading remote pages via loadRequest:, the remote pages load successfully but become unresponsive to user interactions This occurs even when using different WKWebView instances The issue is reproducible 100% of the time once a local file has been loaded Restarting the app and loading remote pages directly works fine Code Example: // Loading local file (works fine) [self.webView loadFileURL:localFileURL allowingReadAccessToURL:accessURL]; // Later, loading remote page (loads but becomes unresponsive) NSURLRequest *request = [NSURLRequest requestWithURL:remoteURL]; [self.webView loadRequest:request]; What We've Tried: Using different WKWebView instances for local vs remote content Comprehensive cleanup in dealloc (removing all user scripts and message handlers) Loading blank HTML before switching to remote content Using shared WKProcessPool (understanding its limitations in iOS 15+) Ensuring proper decisionHandler management in navigation delegates Resetting WKWebView configuration settings Clearing cookies and cache between loads Using loadFileRequest:allowingReadAccessToURL: instead of loadFileURL: Key Observations: The remote page renders correctly and network requests complete No JavaScript errors in console The view hierarchy appears normal in Debug View Hierarchy Touch events seem to be delivered but not processed by the web content Questions: Has Apple introduced new security restrictions in iOS 26 that affect the transition from file:// URLs to http:// URLs? Are there specific WKWebView configuration changes required for React Native applications in iOS 26? Could this be related to the React Native bridge or JavaScript context persistence? Any insights or workarounds would be greatly appreciated, as this is blocking our iOS 26 compatibility.
2
0
1.2k
Oct ’25
WebRTC answerer client ICE gathering event not triggered
I have a working answerer-only WebRTC client to view video from a remote device. This client, works in all common web browsers (Chrome, Edge, Firefox, etc.) except in Safari. After trying to debug the problem, I noticed that after calling await peerConnection.setLocalDescription(answer); RTCPeerConnection.iceGatheringState never changes to the "gathering" state and stays the default initial "new" state. This is a problem because the ICE candidates can never be gathered and thus the client in Safari does not work at all. What is surprising and weird is that by explicitly calling setLocalDescription(), ICE gathering should start as mentioned in the documentation: https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/icecandidate_event. However, in Safari, this never happens. I experienced this issue in both Safari 18.x and 21.x versions.
Topic: Safari & Web SubTopic: General
1
0
612
Oct ’25
New IOS Safari CSS Issue with DVH & VH
After updating to the new iOS, in Safari, my overlays and backdrops using 100dvh no longer cover the full screen there's now a gap at the bottom. Switching to 100vh fixes it, but that causes scrolling issues on older Safari versions since 100vh includes extra height. Has anyone else experienced this? What's the recommended fix that works across iOS versions?
1
1
316
Oct ’25
Launching MacOS app via Url Scheme
I'm looking for answer or documentation on gatekeeper and launching a MacOS app via a url scheme/custom protocol. Our application is delivered via a zip file downloaded from the web. We utilize a url scheme. The act of extracting the app from the zip registers the url scheme with the OS. From previous research/testing we found we had to break the gatekeeper lock (have the user move the app from the downloaded location) to ensure that the url is honored on first launch of the application. To ensure user compliance, we added a check to make sure that the lock has been removed by looking at the quarantine attribute. This flow is not ideal. I am looking for alternatives and was previously under the impression that if we were to move to a DMG then that would provide the user a better user experience for moving it. However, now that I am getting around to looking into it, I am seeing some implied statements that this is not the case and that the quarantine bit will just be moved from the DMG to the app. Questions: Does a DMG allow the app to be launched via custom protocol without prior launch or movement? With a notarized app, will the custom protocol work on a subsequent launch, even without prior movement?
Topic: Safari & Web SubTopic: General
2
0
315
Oct ’25
iOS 16, iOS 17, MacOS Sonoma, Safari 17.5, permissionStatus.onchange not working
navigator.permissions.query -&gt; permissionStatus.onchange is Supposed to listen to the event of a change in permissions in the browser settings. This works for all browsers, but in Safari for iOS and MacOS this seems to be broken in the currently recent versions 17.x Example: navigator.permissions.query({ name: 'notifications' }).then((permissionStatus) =&gt; { permissions = permissionStatus.state; // this value gets set correctly permissionStatus.onchange = () =&gt; { // This will not get executed when permissions have been changed // within the safari settings app, or iOS Settings for PWA or Safari }; }); Can someone from Apple's Webkit Team please comment on this? Thank you. T.
Topic: Safari & Web SubTopic: General Tags:
5
3
1.6k
Oct ’25
WebKit HTML Anchor download attribute ignored by PDF files
When trying to create an anchor with the download attribute it does not work for PDF files, it displays the files inline. Also when the download attribute is set the target attribute is ignored too. The tag: ... The behavior: It displaies the file in line. The correct behavior: The file should be downloaded and not displayed or at least displayed but with the "_blank" target (new tab). This is an issue when working with WebSockets which is closed when the file is opened inline.
2
0
215
Oct ’25
iOS 26 Safari & WebView: VisualViewport.offsetTop not reset after keyboard dismissal, causing fixed elements misplacement
1. System/device combinations where the issue does not occur: Physical device: iOS 26.0 (23A5318c) + iPhone 16 Pro Max 2. System/device combinations where the issue does occur: System versions: Physical device: iOS 26.0 (23A5330a), iOS 26.0 (23A340) Simulator: iOS 26.0 (23A339) Device models: Physical device: iPhone 12 Reproducible in Safari, WKWebView, and UIWebView: Yes Actual behavior In WebView (and identically in Safari): Before the keyboard is shown, header/footer elements with position: fixed are correctly aligned with the screen viewport. Scrolling up/down works as expected. After the keyboard appears, the visualViewport position changes. Bug: When the keyboard is dismissed, visualViewport.offsetTop does not reset to 0. As a result, fixed header/footer elements remain misaligned: When scrolling down, the position looks correct. When scrolling up, the header/footer are visibly offset. Steps to reproduce Focus an input field → the keyboard appears Dismiss the keyboard Observe that visualViewport.offsetTop remains >0 (does not reset to zero) position: fixed header/footer elements are misplaced relative to the screen Expected behavior After the keyboard is dismissed, visualViewport.height should return to match the layout viewport, and visualViewport.offsetTop should reset to 0. When scrolling upward, fixed elements should remain correctly positioned within the layout viewport. Minimal reproducible demo A simple HTML file containing: A header and footer with position: fixed An input element to trigger the keyboard <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" /> <title>H5 吸顶吸底页面 Demo</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: Arial, sans-serif; height: 2000px; /* 设置内容高度 */ background-color: #f0f8ff; /* body 背景浅蓝色 */ padding-top: 120px; /* 预留 header 高度 */ padding-bottom: 60px; /* 预留 footer 高度 */ overflow-x: hidden; } /* 吸顶 Header */ header { position: fixed; top: 0; left: 0; width: 100%; height: 120px; background-color: #ff6b6b; /* 红色 */ display: flex; align-items: center; justify-content: center; color: white; font-size: 24px; font-weight: bold; z-index: 1000; } /* 吸底 Footer */ footer { position: fixed; bottom: 0; left: 0; width: 100%; height: 60px; background-color: #4ecdc4; /* 青绿色 */ display: flex; align-items: center; justify-content: center; color: white; font-size: 18px; font-weight: bold; z-index: 1000; } /* 输入框样式 */ .input-container { margin: 100px auto; width: 80%; max-width: 600px; text-align: center; } input[type='text'] { padding: 12px; font-size: 16px; border: 2px solid #ddd; border-radius: 8px; width: 100%; box-sizing: border-box; } input[type='text']:focus { outline: none; border-color: #4ecdc4; } </style> </head> <body> <!-- 吸顶 Header --> <header>吸顶 Header (120px)</header> <!-- 主体内容 --> <div class="input-container"> <input type="text" placeholder="请输入内容..." /> </div> <!-- 吸底 Footer --> <footer>吸底 Footer (60px)</footer> </body> </html>
27
27
19k
Oct ’25
LocalOverride Request regular expression broke dev tools
Hello, I'm using Safari 18.2 on Sonoma 14.6.1. I was using the Developer Tools to do a Local Request Override in the Source tab for a CSS file that had a changing query string. I thought I had a good regular expression to catch all variants, but apparently it was too generic and possibly wrong, and made both Source and Network tabs no longer work in my Safari. The regular expression I entered for the Local Request Override was: //build/style.css(?.*)?$ Now my dev tools is broken to the extent that the Source and Network tabs no longer work. The slide-out panel on Source that shows Breakpoints, LocalOverrides, etc no longer shows. The toggle for it does, but does nothing now. UI in general looks a little wack on both tabs. So, since I can't turn off the Local Request Override, I've been trying to locate where Safari may have stored it to manually delete it. Not having a lot of luck on that front. It seems to me that Safari was unable to escape my regular expression correctly and it then causes additional issue. Just a guess though. Any advice or help in getting Safari Source & Network working again / manual removal of the LocalOverride would be greatly appreciated. I'm fluent in OSX and Linux, but grep was not much help surfacing anything that worked. Thanks in Advance, possibly a Safari bug as well.
2
0
481
Oct ’25
Safari Web Extension checkbox missing or not persistent in Safari 26.0.1 on macOS 15.7
I’m observing an intermittent issue with a Safari Web Extension on macOS 15.7 (Safari 26.0.1). After installing the Safari extension from the App Store, it appears under Settings → Extensions, but the enable checkbox is often missing. Sometimes, after restarting Safari multiple times, the checkbox becomes visible. However, even when I manage to enable the extension, reopening Safari often hides the checkbox again. However, I don't see this issue in safari 26 with macOS 26 I’d like to know if this behavior is a known issue with Safari 26 or macOS 15.7? Any workaround available?
1
0
252
Oct ’25
declarativeNetRequest redirect action causing page reload/error in Safari 26.0
After updating to Safari 26.0 (on macOS Sequoia or Tahoe), the Declarative Net Request (DNR) API rule with "type": "redirect" no longer works as expected. When the rule is applied, the browser initially shows a banner at the top of the page: "This webpage was reloaded because a problem occurred." After the reload, the page fails to load and displays an error page with the message: "A problem repeatedly occurred with https://extensionworkshop.com/?test=true " This behavior is new in Safari 26.0. The same rule was working correctly in earlier Safari versions (17.x / 18.x).
1
0
191
Oct ’25
How to print WKWebView in Sequoia?
I want to print the content of a WKWebView. I've done some searching, and many people have struggled with this over the years. Some claimed success, but their solutions don't work for me. One person created images for each pages and printed that, but then if you were to print to PDF, you'd get a PDF containing images rather than text. If I just call the printView(_:)) method of the view, I get blank pages. With the following more elaborate code, I get a partial printout, 11 out of what should be about 13 pages. let info = NSPrintInfo.shared info.topMargin = 72.0; info.bottomMargin = 72.0; info.leftMargin = 72.0; info.rightMargin = 72.0; info.isVerticallyCentered = false; info.isHorizontallyCentered = false; info.horizontalPagination = .fit; info.verticalPagination = .automatic; let printOp = webView!.printOperation( with: info ) printOp.canSpawnSeparateThread = true printOp.view?.frame = NSMakeRect( 0, 0, info.paperSize.width, info.paperSize.height ) printOp.runModal(for: webView.window!, delegate: self, didRun: nil, contextInfo: nil ) When I run the above under the debugger, I see console messages saying CGContextClipToRect: invalid context 0x0. Once the print dialog appears, if I touch (but not change) the selected printer, then the page count changes to the correct value.
13
0
219
Oct ’25
iOS 26 BETA 4 Safari Web Extension disappearing right after install, "extension" is no longer available.
our company created a web safari extension. before iOS 26 (beta) release we would archive our extension and install to our devices no problem. since iOS 26 (beta) (we also tried in beta 4 23A5297m) the extension would archive perfectly but when installing the extension would just not run. its found in settings under safari extension, but when enabled the extension and open safari it will show error message "Ext" is no longer available. to rule out all code issues, we built a new project from scratch with a new bundle id, tried to archive with no problem, but when installed in an iphone 16 with iOS 26 BETA (23A5297m) same error ocurs it installs but when opening safari it will give an error message saying extension is no longer available. attached in the google drive link is a zip file of the new project, a zip file with a succesfull build of the ipa file with enterprise distribute, a video of the entire proccess and the error that the iphone gives. also attached a log file from the iphone that includes the install and the crash of the app. within the logs there is a log saying Error occurred during transaction: The provided identifier "dev.sacal.ext" is invalid. before ios 26 the exact steps worked perfectly. https://drive.google.com/file/d/1PYDOv8IRvRY_ouqiOc0sJdcfh0CHbL72/view?usp=sharing
10
4
1.6k
Oct ’25
iOS 26.1 beta Safari audio input is broken
I'm a web developer of WebRTC based web app for video and audio calls. After updating to iOS 26.1 beta I noticed, that my app can't use microphone anymore. When I'm calling to getUserMedia with audio set to true, Safari returns error "No AVAudioSessionCaptureDevice device". Other WebRTC demo apps also can't access microphone on this firmware. And maybe it's connected somehow, but safari can't detect connected AirPods Pro 2 as an input device. So, this bug brakes any WebRTC app, that uses microphones.
Topic: Safari & Web SubTopic: General Tags:
4
2
957
Oct ’25
iOS26 Safari private mode blocking our page code from reading inputs
With most recent Safari update, our page started having some of it's core functionality broken while users access it on Private mode due to Fingerprinting protection. The issue is that the code that breaks is our first-party code and I want understand why it is breaking and how to properly fix it. One thing we discovered was that a service of ours that uses the same code base doesn't have these issues and current assumption is that their page bundles are served on the same domain as the actual page request, while ours is coming from a different one. The other assumption was that the domain which we use for serving the bundles of the page are set on the domain that is flagged as tracking domain. Is there some documentation on how Safari decides which code is allowed reading user inputs and which isn't and what is the appropriate approach to fix this issue as it would be possible that these changes get release as default in the future?
Topic: Safari & Web SubTopic: General
0
0
157
Oct ’25
First installation of the extension - sending messages to the background script from the event handler in the content script does not work
After the first installation (out of AppStore) of the extension in the browser, the content script is correctly inserted into the page (twice for some reason) and a message is sent from the root of the content script to the background script, which responds correctly. However, if an event handler is registered within the content script, within which the message is also sent to the background script, it will never reach the background script. window.addEventListener("message", function (event) { // We only accept messages from ourselves if (event.source !== window) { return; } if (event.data.source && event.data.source === appIdentification) { browser.runtime.sendMessage(event.data); } }, false); It does not matter with what delay the event handler is called (i.e. the background script is not asleep). If I refresh the page or close and reopen the browser and reload the page, everything works correctly and the message sent from the event handler is already delivered to the background script. The event handler is used so that the extension code is uniform for all browsers (Chrome, Safari, Edge, Opera, Firefox), i.e. it is not intended to use externally_connectable for sending messages from the webpage directly to the background script, which Safari should support. The expected behavior is that the extension will work even after the first installation, as is the case with other browsers. Procedure: Enter the test website: https://www.mssf.cz/testapp/check_client.aspx Do the initial installation of the extension (could be downloaded from here: https://1drv.ms/f/c/76f4c93826df41a0/Ej5MQX9ctyhHv_P9_t_6uAwB05ET-nzXuMhPeu56nOgkWg?e=cudqRJ) Set a breakpoint in the event handler for "message" within the content script, open the background script and set a breakpoint in the event handler for onMessage Click on the "Validate certificate" button on the page loaded in point 1 Step through the content script to the point where the message is sent to the background script, the breakpoint within the background script is never hit, which is an error, the message should come to the background script
0
0
148
Oct ’25
No longe rable to obtain network name
We have a JavaScript api that queries our Secure Browser to get the network information – signal strength, network name, plugged in/wifi. Everything worked fine through the Tahoe betas, still does. Now we are getting on the network name and this is breaking our UI. Was this an intentional change or a bug? The other two properties still appear to be working. And it works in all lower MacOS versions. We are currently obtaining it through AppleScript try   set ssid to do shell script "system_profiler SPAirPortDataType | awk '/Current Network Information:/ {getline; sub(/^ +/, ""); sub(/:$/, ""); print}'"   if ssid is equal to "" then     return "Not connected to any Wi-Fi network."   else     return ssid   end if on error errMsg   return "Error: " & errMsg end try
Topic: Safari & Web SubTopic: General
2
0
370
Oct ’25