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>
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.
Selecting any option will automatically load the page
Post
Replies
Boosts
Views
Activity
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.
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?
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).
Hello,
I've got Smart App Banner set up on my website. However, I want to be able to measure the traffic coming from this banner to the app store / app (i.e. measure impressions/downloads).
Apple documentation (https://developer.apple.com/help/app-store-connect/view-app-analytics/manage-campaigns/) says you can set up a campaign link and use it in the Smart Banner to track those who download / open the app store page using your smart banner (so that we can get attribution).
However, there is no documentation at all in terms of how this should be added to the tag when implementing a Smart App Banner.
I've tried so many different variations and none have tracked downloads. This includes a structure based on an example taken from WWDC from a few years back which also did not work.
I would appreciate any help!
We are experiencing an issue with Safari in all versions from 18.0 to 18.5 that does not occur in version 17. It affects both iPhones and Macs. And does not happen in Chrome or Windows.
The problem is impacting our customers, and our monitoring tools show a dramatic increase in error volume as more users buy/upgrade to iOS 18.
The issue relates to network connectivity that is lost randomly. I can reliably reproduce the issue online in production, as well as on my local development environment.
For example our website backoffice has a ping, that has a frequency of X seconds, or when user is doing actions like add to a cart increasing the quantity that requires backend validation with some specific frequency the issue is noticable...
To test this I ran a JS code to simulate a ping with a timer that calls a local-dev API (a probe that waits 2s to simulate "work") and delay the next HTTP requests with a dynamic value to simulate network conditions:
Note: To even make the issue more clear, I'm using GET with application/json payload to make the request not simple, and require a Pre-flight request, which doubles the issue.
(async () =&gt; {
for (let i = 0; i &lt; 30; i++) {
try {
console.log(`Request start ${i} ${new Date().toLocaleString()}`);
const res = await fetch(`https://api.redated.com:8090/1/*****/probe?`, {
method: 'GET',
mode: "cors",
//headers: {'Content-Type': 'text/plain'},
headers: { 'Content-Type': 'application/json' },
});
console.log(`Request end ${i} ${new Date().toLocaleString()} status:`, res.status);
} catch (err) {
console.error(`Request ${i} ${new Date().toLocaleString()} error:`, err);
}
let delta = Math.floor(Math.random() * 10);
console.log("wait delta",delta);
await new Promise(r =&gt; setTimeout(r, 1000 - delta));
}
})();
For simplicity lets see a case where it fails 1 time only out of 10 requests.
(Adjusting the "delta" var on the time interval create more or less errors...)
This are the results:
The network connection was lost error, which is false, since this is on my localhost machine, but this happens many times and is very reproducible in local and production online.
The dev-tools and network tab shows empty for status error, ip, connection_id etc.. its like the request is being terminated very soon.
Later I did a detailed debugging with safari and wireshark to really nail down the network flow of the problem:
I will explain what this means:
Frame 10824 – 18:52:03.939197: new connection initiated (SYN, ACK, ECE).
Frame 10831 – 18:52:04.061531: Client sends payload (preflight request) to the server.
Frame 10959 – 18:52:09.207686: Server responds with data to (preflight response) to the client.
Frame 10960 – 18:52:09.207856: Client acknowledges (ACK) receipt of the preflight response.
Frame 10961 – 18:52:09.212188: Client sends the actual request payload after preflight OK and then server replies with ACK.
Frame 11092 – 18:52:14.332951: Server sends the final payload (main request response) to the client.
Frame 11093 – 18:52:14.333093: captures the client acknowledging the final server response, which marks the successful completion of the main request.
Frame 11146 – 18:52:15.348433: [IMPORTANT] the client attempts to send another new request just one second later, which is extremely close to the keep-alive timeout of 1 second. The last message from the server was at 18:52:14.332951, meaning the connection’s keep-alive timeout is predicted to end around 18:52:15.332951 but it does not. The new request is sent at 18:52:15.348433, just microseconds after the predicted timeout. The request leaves before the client browser knows the connection is closed, but by the time it arrives at the server, the connection is already dead.
Frame 11147 – 18:52:15.356910: Shows the server finally sending the FIN,ACK to indicate the connection is closed. This happens slightly later than the predicted time, at microsecond 356910 compared to the expected 332951. The FIN,ACK corresponds to sequence 1193 from the ACK of the last data packet in frame 11093.
Conclusions:
The root cause is related to network handling issues, when the server runs in a setting of keep-alive behavior and keep-alive timeout (in this case 1s) and network timming issue with Safari reusing a closed connection without retrying. In this situation the browser should retry the request, which is what other browsers do and what Safari did before version 18, since it did not suffer from this issue.
This behaviour must differ from previous Safari versions (however i read all the public change logs and could not related the regression change).
Also is more pronounced with HTTP/1.1 connections due to how the keep-alive is handled.
When the server is configured with a short keep-alive timeout of 1 second, and requests are sent at roughly one-second intervals, such as API pings at fixed intervals or user actions like incrementing a cart quantity that trigger backend calls where the probability of failure is high.
This effect is even more apparent when the request uses a preflight with POST because it doubles the chance, although GET requests are also affected.
This was a just a test case, but in real production our monitoring tools started to detect a big increment with this network error at scale, many requests per day... which is very disrupting, because user actions are randomly being dropped when the user actions and timming happens to be just near a previous connection, where keep alive timeout kicks-in, but because the browser is not yet notified it re-uses the same connection, but by the time it arrived the server is a dead connection. The safari just does nothing about it, does not even retry, be it a pre-flight or not, it just gives this error.
Other browsers don't have this issue.
Thanks!
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.
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
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.
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
Posting this here since Apple Discussion Forums kept deleting this citing it was a "developer issue" even though it's not and there's no way to appeal. Can someone help me?
I can't get 2FA SMS/Email Codes to autofill in Brave or Chrome as of this writing. Has anyone else had this issue?
Topic:
Safari & Web
SubTopic:
General
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
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
I'm developing an application that makes use of a WebView. When resuming the app I occasionally run into an issue where the application just shows as a blank page. In the Console.app I see a stack trace, however the details are hidden (see below).
The stack trace is thrown from JavaScriptCore.
default 13:37:07.029261+0200 outlinerrs_dioxus 1 0x1b80cd678 <private>
default 13:37:07.029360+0200 outlinerrs_dioxus 2 0x1b7d50e30 <private>
default 13:37:07.029369+0200 outlinerrs_dioxus 3 0x1047ec800 <private>
default 13:37:07.029539+0200 outlinerrs_dioxus 4 0x1b7d37924 <private>
default 13:37:07.029548+0200 outlinerrs_dioxus 5 0x1b8102a78 <private>
default 13:37:07.029789+0200 outlinerrs_dioxus 6 0x1b8100cb8 <private>
default 13:37:07.029834+0200 outlinerrs_dioxus 7 0x1b7ba7b0c <private>
default 13:37:07.029851+0200 outlinerrs_dioxus 8 0x1b879a520 <private>
default 13:37:07.029870+0200 outlinerrs_dioxus 9 0x1b817f204 <private>
default 13:37:07.030159+0200 outlinerrs_dioxus 10 0x1b76bfce8 <private>
default 13:37:07.030186+0200 outlinerrs_dioxus 11 0x1b76ad838 <private>
default 13:37:07.030245+0200 outlinerrs_dioxus 12 0x1b76bd76c <private>
default 13:37:07.030324+0200 outlinerrs_dioxus 13 0x1b22c827c <private>
default 13:37:07.030424+0200 outlinerrs_dioxus 14 0x1b22c8034 <private>
default 13:37:07.030461+0200 outlinerrs_dioxus 15 0x19d6df230 <private>
default 13:37:07.030514+0200 outlinerrs_dioxus 16 0x19d6df1a4 <private>
default 13:37:07.030584+0200 outlinerrs_dioxus 17 0x19d6bcc6c <private>
default 13:37:07.030592+0200 outlinerrs_dioxus 18 0x19d6928b0 <private>
default 13:37:07.030601+0200 outlinerrs_dioxus 19 0x19d691c44 <private>
default 13:37:07.030607+0200 outlinerrs_dioxus 20 0x23ca6e498 GSEventRunModal
default 13:37:07.030675+0200 outlinerrs_dioxus 21 0x1a300cddc <private>
default 13:37:07.031049+0200 outlinerrs_dioxus 22 0x1a2fb1b0c UIApplicationMain
default 13:37:07.031064+0200 outlinerrs_dioxus 23 0x104a76278 <private>
default 13:37:07.031070+0200 outlinerrs_dioxus 24 0x1047a0064 <private>
default 13:37:07.031254+0200 outlinerrs_dioxus 25 0x104781efc <private>
default 13:37:07.031343+0200 outlinerrs_dioxus 26 0x1047493e0 <private>
default 13:37:07.031352+0200 outlinerrs_dioxus 27 0x10477e1c8 <private>
default 13:37:07.031358+0200 outlinerrs_dioxus 28 0x1047a0184 <private>
default 13:37:07.031373+0200 outlinerrs_dioxus 29 0x1047a033c <private>
default 13:37:07.031409+0200 outlinerrs_dioxus 30 0x104733724 <private>
default 13:37:07.031451+0200 outlinerrs_dioxus 31 0x104464e98 <private>
I tried to create com.apple.WebKit.plist in /Library/Preferences/Logging/Subsystems with the following contents:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>DEFAULT-OPTIONS</key>
<dict>
<key>Enable-Private-Data</key>
<true/>
</dict>
</dict>
</plist>
Does anyone know how to reveal the hidden logs?
The issue of fixed elements with
{ bottom: 0 }
moving up when scrolling still persists.
It seems to be a general issue with the IOS 26 release.
It affects other browser too. I tested on browsers such as Safari, Chrome, Firefox, Edge and Bravo.
With the exception of Edge, all the others display the behavior.
Device: iPhone 15 Pro
IOS Version: 26.0.1
"The Safari web extension packager enables you to package and distribute your Safari extensions using App Store Connect from any web browser, without requiring a Mac or access to Xcode."
I upload the unzipped folder I'd test in Chrome://extensions to the Safari web extension packager in App store connect.
I get error:
Embedded binary's bundle identifier is not prefixed with the parent app's bundle identifier.
The only solution i've seen to this error involves xcode/a mac, being without which doesn't help
Hi folks!! Anyone here experienced issues with video not showing up in webview?
I have a simple index.html with a video tag but its doesn't load why?
This is a really strange issue on iOS Safari. Under certain conditions a basic input element will not be focusable or show the on screen keyboard. I can reproduce the issue with a very simple HTML file by dynamically adding an anchor element with an href during a touch event. If you add a different element or an anchor without an href, there is no issue. Similarly, if you apply the same listener to a click event there is no issue.
Reproducible in iOS Simulator 17.2 and 18.1
This HTML/JS showcases the problem:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>InputIssue</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body>
<div id="parent">
<input type="text" name="test" />
<div id="child"></div>
</div>
<script>
document.addEventListener("touchstart", () => {
const child = document.getElementById("child");
if (!child) return;
while (child.firstChild) {
child.removeChild(child.firstChild);
}
const link = document.createElement("a");
link.href = "https://test.com";
link.textContent = "test";
child.appendChild(link);
});
</script>
</body>
</html>
Topic:
Safari & Web
SubTopic:
General
After reading several posts I see that I need to add the "com.apple.developer.web-browser.public-key-credential" capability to my macOS app in order to get it to work.
So my noob question is where do I request this capability? Can I as a developer request it or does the Account owner need to request it?
Once approved, how do I add it to my app's capabilities?
Thanks for your patience
We’ve noticed that the ApplePaySession.applePayCapabilities() check has stopped working correctly in Safari over the past couple of days.
Behavior observed:
1.) In Safari Private Window, paymentCredentialStatus behaves as expected and case 1 is triggered.
2.) In a normal Safari window, it always triggers case 3 (paymentCredentialsUnavailable), even when the user has active cards provisioned in Wallet.
We tested across multiple devices, and the behavior is consistent.
if (window.ApplePaySession) {
var merchantIdentifier = 'YOUR MERCHANT IDENTIFIER';
var promise = ApplePaySession.applePayCapabilities(merchantIdentifier);
promise.then(function(capabilities) {
switch (capabilities.paymentCredentialStatus) {
case "paymentCredentialsAvailable":
// Show Apple Pay button as primary option
case "paymentCredentialStatusUnknown":
// Offer Apple Pay
case "paymentCredentialsUnavailable":
// Consider showing Apple Pay button
case "applePayUnsupported":
// Don’t show Apple Pay button
}
})
}
This used to work fine until a few days ago, but now the capability check in non-private Safari windows always indicates unavailable, even with valid active cards.
Has anyone else faced this issue recently? Could this be a Safari regression or a change on Apple’s side?
Thanks in advance!