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

General Documentation

Posts under General subtopic

Post

Replies

Boosts

Views

Activity

Safari WebExtensions (MV3): Content Script context persists across navigation, causing message routing to wrong (zombie?) pages
Summary: Content scripts injected via manifest continue to receive and respond to chrome.tabs.sendMessage() calls even after the user has navigated away from the original page, causing messages intended for the current tab to be handled by zombie contexts from previous pages. Environment: Safari/iOS Version: 18.5 Extension Manifest: Version 3 Expected Behavior: When a user navigates from Page A to Page B: Page A's content script context should be destroyed. chrome.tabs.sendMessage(currentTabId, message) should only reach Page B's content script Only Page B should be able to respond to action button clicks (or other background to content messages). Actual Behavior: When navigating from Page A to Page B: Page A's content script context persists as a "zombie". chrome.tabs.sendMessage(currentTabId, message) reaches zombie context instead of the Page B's one. Hence, it looks like the extension is broken because the content script does not respond to the background messages. Details: Tab ids are properly recognized by both background and content script The problem does not always occur; it occurs on random occasions. It's quite easy to have it reproduced. It can be reproduced easier if user clicks ext icon during site loading (before it fully loaded), triggering ActionClick (ext icon click) event and then sending a msg upon it to the content script Regardless of whether the content script is injected into the tab using manifest.json, registerContentScripts, or executeScript, the problem is still there Once the problem occurs, e.g. user is on macys.com but zombie injected content script believes it's google.com (a previous page), even refreshing the tab doesnt change anything - zombie context is still there (thinking it's still google.com) . Changing a domain to something completely different one could help though. Then going back to macys.com could still lead to the described issue. A zombie content script does not have access to the page's console function and others. Example communication Sending following message from the background to the content script using chrome.tabs.sendMessage() { "tab": { "id": 155, "active": true, "url": "https://www.macys.com/", "title": "Macys.com" } } Results in the content-script zombie context response (the url is taken from the window.location.href) "message": { "type": "ActionClicked", "data": {} }, "response": { "data": { "windowUrl": "https://www.google.com/", "contentReached": true, "timestamp": "1,753,138,945,272", } } }
1
3
336
Jul ’25
iOS 16, iOS 17, MacOS Sonoma, Safari 17.5, permissionStatus.onchange not working
navigator.permissions.query -> 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) => { permissions = permissionStatus.state; // this value gets set correctly permissionStatus.onchange = () => { // 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
Apple Pay Js in Not working (while getting all data from serverside for validation)
Subject: Apple Pay JS - "Payment Was Cancelled by the User" Issue (Braintree + Server-Side Validation) Issue I am implementing Apple Pay using Braintree with server-side validation. However, when initiating the payment process, I receive the following error: [Log] Payment was cancelled by the user: (apple-pay-test-ucxp.onrender.com, line 286) Additionally, the console logs an ApplePayCancelEvent with: sessionError: {code: "unknown", info: {}} Despite successfully fetching merchant session validation data from the backend and completing merchant validation, the payment process does not proceed. Setup Details Payment Processor: Braintree (Apple Pay integration) Backend API: Fetching merchant session validation via createPaymentSessionGet Payment Processing: Using Braintree nonce tokenization Client-Side Code (Key Sections) session.onvalidatemerchant = async (event) => { try { const merchantSession = await fetch( "https://api.paybito.com:9443/ApplePay/api/apple-pay/createPaymentSessionGet", { method: "GET", headers: { "Content-Type": "application/json" }, } ).then((res) => res.json()); session.completeMerchantValidation(merchantSession); } catch (err) { console.error("Merchant validation failed:", err); session.abort(); } }; session.onpaymentauthorized = async (event) => { try { const payload = await applePayInstance.tokenize({ token: event.payment.token, }); const response = await fetch( "https://api.paybito.com:9443/ApplePay/api/braintree/process-payment", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ nonce: payload.nonce }), } ).then((res) => res.json()); if (response.success) { session.completePayment(ApplePaySession.STATUS_SUCCESS); } else { session.completePayment(ApplePaySession.STATUS_FAILURE); } } catch (err) { console.error("Payment authorization failed:", err); session.completePayment(ApplePaySession.STATUS_FAILURE); } }; Observations Merchant validation completes successfully. The error occurs before onpaymentauthorized executes. Session error code is unknown, making debugging difficult. Questions Has anyone encountered this issue before? Could this be related to how the validation session is fetched from the backend? Is there a way to obtain more meaningful debug information from Apple Pay? Any insights would be greatly appreciated!
3
3
765
Jan ’25
PerApp VPN Broken on iOS 18.2 if Huge Safari Domains Configure?
When configuring a Per-App VPN payload with 250+ Safari domains under a managed app, the VPN does not trigger for the other managed apps(like chrome etc). However, the same VPN successfully starts and works when used with Safari. Reducing the number of Safari domains in the VPN payload resolves the issue, allowing the VPN to trigger for the managed app as expected. Has anyone else faced this issue, and what's the workaround for it?
2
3
534
Dec ’24
browser.runtime.onMessage in content script intermittently fails on iOS 18.5 (Safari Web Extensions)
Hi everyone, I’m encountering a critical reliability issue with message passing in my Safari Web Extension on iOS 18.4.1 and iOS 18.5. In my extension, I’m using the standard messaging API. The background script sends a message to the content script using browser.tabs.sendMessage(...), and the content script registers a listener via: browser.runtime.onMessage.addListener(handler); This setup has been working reliably in all prior versions of iOS. However, after updating to iOS 18.4.1 and 18.5, I’ve noticed the following behavior: ✅ The content script is successfully injected, and onMessage.addListener is registered (I see logging confirming this). ✅ The background script sends the message using the correct tabId (also confirmed via logs). ❌ The content script’s onMessage listener is not consistently triggered. ⚠️ This issue is intermittent, sometimes the message is received, sometimes it is silently dropped. ❌ No exceptions or errors are thrown in either script, the message appears to be sent, but not picked up from the content script message listener.
3
3
223
Jul ’25
Content overlapping address bar after clicking links in Safari with the one-tab bar enabled
Title: Content Overlapping Address Bar After Clicking Links in Safari, tested on iPhone 11 (iOS 18.1.1) Description: When browsing in Safari on iPhone (iOS 18.1.1), the one-tab bar (address bar) collapses as expected when scrolling down a page. However, after clicking on a link and loading the next page, the content appears to overlap the collapsed address bar. This results in parts of the content being hidden or obscured by the address bar, which affects the user experience, especially on mobile devices with limited screen space. This issue is reproducible on Next.js applications and can be observed on websites such as rotterdam.nl and halderberge.nl. Steps to Reproduce: Enable the One-Tab Bar: Go to Settings > Safari and enable the one-tab bar feature. Open the website rotterdam.nl or halderberge.nl in Safari on an iPhone 11 (iOS 18.1.1). Scroll down the page so that the top address bar collapses. Click on any link on the page to load a new one. Once the new page loads, observe that the content appears on top of the collapsed address bar, causing parts of the content to be hidden or obscured. Expected Result: The content should not overlap or be hidden behind the collapsed address bar after the page reloads. The layout should adjust properly without interference from the address bar, providing a smooth user experience. Actual Result: When the new page loads, the content overlaps or appears on top of the collapsed address bar, causing parts of the content to be hidden or obscured. Device(s) Affected: iPhone 11 running iOS 18.1.1. OS Version: iOS 18.1.1 Technical Notes: To address this issue, the following solutions have been attempted with no success: Viewport Meta Tag: <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" /> This was added to help ensure proper layout on mobile devices, but did not resolve the issue. CSS Safe Area Insets: body { padding-top: env(safe-area-inset-top); } This CSS rule was applied to account for the safe area and prevent content from being hidden under the address bar, but it did not solve the overlapping issue. Scroll Position Adjustment (for scroll-to-top button): Adjusting the scroll behavior by changing the scroll position to {top: 1} instead of {top: 0} was a successful workaround to keep the address bar collapsed when clicking the "scroll to top" button. However, this did not resolve the issue when navigating between pages or changing routes, where the content still overlaps the collapsed address bar.
0
2
507
Feb ’25
In Tahoe, Safari tabs and Favorite bookmarks unreadable
This is my first post, so please forgive me if it is to the wrong area. I've been using Tahoe for a few days and, overall, it's very stable. But the one thing that has bothered me to no end is Safari's new behavior with respect to its header (Address bar, Favorite bookmarks bar, tab bar) background color. The web content of the active tab seems to affect everything - and oftentimes makes things completely unreadable - at least in "Dark" mode. For instance, if a web page uses a white background, the Favorites bookmark labels are the same color as the bookmark background, so reading the labels is simply impossible. At other times, they're just very difficult to read. Similarly, it is almost always impossible to tell which tab is the active one - my only workaround is to try 100% brightness....or to just guess. When Apple previously experimented with letting content bleed through to the top, there was a setting for stopping it - but I don't see such a setting anymore. Do you you know of any way to stop this effect?
2
2
151
Jun ’25
iOS 26/MacOS 26 - PWA App Icons: Dark,Clear,Tinted Appearance
Hi everyone, I'm exploring the new app icon appearance options (Clear, Dark, Tinted) for Progressive Web Apps (PWAs) on iOS26, iPadOS26, and macOS26. Currently, PWA icons don't seem to render well with these new appearances, particularly in Clear and Tinted modes, resulting in very very poor visual quality. You can hardly see anything. Has support for these icon appearances been fully implemented for PWAs? If so, could someone point me to the relevant Apple Developer documentation or provide guidance on how to configure PWA icons to support Clear, Dark, and Tinted appearances? I've searched the Apple Developer Forums, Stack Overflow, and Reddit but haven't found clear information on this topic.A possible solution is a png file with transparent areas, but if the pattern is dark, nothing will be visible in dark mode. Any insights or resources would be greatly appreciated. Thanks! (plz don't give up on PWA😭) Reference: https://developer.apple.com/forums/thread/761615 https://stackoverflow.com/questions/78780916/is-there-a-way-to-provide-light-dark-and-tinted-variants-of-apple-touch-icon https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html
0
2
439
Jun ’25
Safari: Sticky element with bottom: 0 does not follow viewport when toolbar hides on scroll
Device: iPhone 15pro, ios26.0 (23A 341) IOS version: 26.0 (23A 341) When using position: sticky; bottom: 0, the div is expected to stick to the bottom of the viewport when the browser toolbar hides while scrolling. However, it stops at the height where the toolbar was, instead of moving down with the disappearing toolbar. In the image below, the red-bordered navigation shows the situation where it does not stick to the bottom. i
1
2
407
Sep ’25
WebKit Null pointer WebPageProxy::updateActivityState on iOS 17
We are using WebKit in our app and recently started noticing a crash occurring on iOS 17 and earlier versions. The crash log shows the following error: Thread 0 Crashed: 0 WebKit 0x00000001a38593cc WebKit::WebPageProxy::updateActivityState(WTF::OptionSet<WebCore::ActivityState>) + 220 (WebPageProxy.cpp:2544) 1 WebKit 0x00000001a39cb1e0 WebKit::WebPageProxy::dispatchActivityStateChange() + 132 (WebPageProxy.cpp:2653) 2 WebKit 0x00000001a3f541f8 WTF::Detail::CallableWrapper<WebKit::WebPageProxy::scheduleActivityStateUpdate()::$_5::operator()() const::'lambda'(), void>::call() + 52 (Function.h:53) 3 JavaScriptCore 0x00000001a48317ec void WTF::dispatchWorkItem<WTF::(anonymous namespace)::DispatchWorkItem>(void*) + 60 (WorkQueueCocoa.cpp:48) 4 libdispatch.dylib 0x00000001964f5dd4 _dispatch_client_callout + 20 (object.m:576) 5 libdispatch.dylib 0x00000001965045a4 _dispatch_main_queue_drain + 988 (queue.c:7898) 6 libdispatch.dylib 0x00000001965041b8 _dispatch_main_queue_callback_4CF + 44 (queue.c:8058) 7 CoreFoundation 0x000000018e623710 __CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__ + 16 (CFRunLoop.c:1780) 8 CoreFoundation 0x000000018e620914 __CFRunLoopRun + 1996 (CFRunLoop.c:3149) 9 CoreFoundation 0x000000018e61fcd8 CFRunLoopRunSpecific + 608 (CFRunLoop.c:3420) 10 GraphicsServices 0x00000001d34d01a8 GSEventRunModal + 164 (GSEvent.c:2196) 11 UIKitCore 0x0000000190c5890c -[UIApplication _run] + 888 (UIApplication.m:3713) 12 UIKitCore 0x0000000190d0c9d0 UIApplicationMain + 340 (UIApplication.m:5303) After investigating, we found that this crash was addressed in this https://github.com/WebKit/WebKit/pull/24778 WebKit PR. However, our app is still crashing for users on older iOS versions where this fix is not available. Is there a known workaround to prevent this crash on affected iOS versions? Any guidance would be greatly appreciated.
0
2
440
Feb ’25
Tracking Campaigns (Downloads) with Smart App Banners
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!
1
1
431
1w
WKWebView/Sandbox Intermittent Local File Access Denial in macOS Sandbox Environment
Dear Apple Developer Experts, We're experiencing an intermittent issue with WKWebView in our macOS application where local HTML file access is occasionally denied by the sandbox, despite proper implementation and permissions. We seek your guidance in understanding and resolving this issue. Issue Description: The WKWebView occasionally fails to load local HTML files stored in the app's Contents/Resources directory Error occurs in WebKit Networking Process with sandbox denial Issue is intermittent and can be resolved by app restart or WebKit Networking Process restart Affects all local HTML files in the same directory once the issue occurs Technical Details: Error from Kernel Log: 2025-02-07 14:57:17.179821 +0800 kernel Sandbox: com.apple.WebKit.Networking(58661) deny(1) file-read-data /Applications/DingTalk.app/Contents/Resources/webcontent/contact-2024.html WKWebView Delegate Error (captured in WKNavigationDelegate method): (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(WKNavigation *)navigation withError:(NSError *)error Error Details: Domain: NSPOSIXErrorDomain Code: 1 Description: "Operation not permitted" UserInfo: { networkTaskMetricsPrivacyStance: Unknown, _NSURLErrorFailingURLSessionTaskErrorKey: LocalDataTask &lt;3694CA1E-481B-4E06-975D-E3A56AD56C0F&gt;.&lt;1&gt;, _kCFStreamErrorDomainKey: 1, _kCFStreamErrorCodeKey: 1 } Key Observations: Error is captured in WKNavigationDelegate's didFailProvisionalNavigation method The issue affects all local HTML files in the same directory once it occurs Temporary workarounds we've discovered: Restarting the application completely resolves the issue Without restarting the application, terminating the "WebKit Networking Process" via Activity Monitor causes the process to automatically restart, and this resolves the issue and load works again Additional Information: We've collected complete system diagnostics (system_logs.logarchive) at the time of failure The issue appears similar to discussions in Apple Developer Forums (https://developer.apple.com/forums/thread/110072), though we're uncertain if it's the same root cause We've prepared a minimal demo project demonstrating: Our release version app can be downloaded from: https://dtapp-pub.dingtalk.com/dingtalk-desktop/mac_dmg/Release/M1-Beta/DingTalk_v7.6.45_43521682_universal.dmg?spm=0.0.0.0.UuwovG&amp;file=DingTalk_v7.6.45_43521682_universal.dmg for examining our app's codesign, sandbox, and entitlements configurations if needed Important Investigation Finding: We attempted to simulate the issue by using chmod 000 /path/to/test.html, but this produces a different error: CopyError Domain=NSURLErrorDomain Code=-1102 Description="You do not have permission to access the requested resource." UserInfo={ NSLocalizedDescription=You do not have permission to access the requested resource., NSErrorFailingURLStringKey=file:///Users/sunus/Library/Developer/Xcode/DerivedData/WKWebViewLocalDemo-eumardnlfbmwgnhkaadglsrrhzhs/Build/Products/Debug/WKWebViewLocalDemo.app/Contents/Resources/test.html, NSUnderlyingError=0x600003aedc50 {Error Domain=kCFErrorDomainCFNetwork Code=-1102 "(null)"} } This error is distinctly different from our original issue's "Operation not permitted" error, suggesting that the sandbox denial we're experiencing is not a simple file permission issue. Questions: Is this a known issue with the WebKit sandbox in recent macOS versions? Are there recommended best practices or workarounds to prevent this sandbox denial? Could this be related to the WebKit Networking Process's sandbox configuration? Are there additional diagnostics or logs we should collect to help investigate this issue? We appreciate your assistance in investigating this issue. Please let us know if you need any additional information or clarification. STEPS TO REPRODUCE Open App Then loads the local file in /WKWebViewLocalDemo.app/Contents/Resources/test.html PS, We also submit a DTS &amp; Feedback DTS:Case-ID: 11876957 Feedback-ID: FB16493282 sysdiagnose is in the Feedback-ID: FB16493282 is uploaded
2
2
499
Feb ’25
Web Extension : browser.cookies.getAll() does not work
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.
3
2
711
Mar ’25
PDF links in WKWebView not clickable on iOS 26 (working on pre-iOS 26)
Hello Apple Developer Community, I'm experiencing an issue with PDF link interaction in WKWebView that appears to be specific to iOS 26. Problem Description: I'm loading a PDF in WKWebView.The links may vary widely and are not necessarily DPF, so I need to load them using WKWebView. On iOS versions prior to 26, links within the PDF are clickable and work correctly. On iOS 26, the same links are not clickable (no response when tapped). Expected Behavior: PDF links should remain clickable and functional across all iOS versions. What I've Tried: Tested opening the PDF directly in Safari on iOS 26 - links still not clickable This suggests the issue might be related to changes in the system's PDF rendering engine Reproduction Steps: Load the PDF URL in WKWebView Navigate to page 12 Attempt to tap the link Environment: Test Devices: iPhone 15(26.0 ) / iPhone 16 Pro Max(18.0.1 ) Xcode: 16.2 Questions: Is this an intentional change in iOS 26's PDF handling or WKWebView? If so, is there a new API or configuration to restore link interactivity? Any guidance or suggestions would be greatly appreciated!
1
2
426
Nov ’25
Canvas performance slow on Safari, iPad 10 only
This is my first time to post on this forum. If there are something we didn't notice, please tell me. Thanks. Background We're using canvas to provide a web component to marketing. https://demo.mescius.jp/spreadjs/BenchmarkSample/ Problem Recently we have met an issue from customer. He is using iPad 10th to access the web component but when he tries to scroll it and it's very slow on iPad 10th. His iPad OS version is 17.7 and this issue also can be reproduced on our iPad 10th with iPad OS 18.0.1. But if we use iPad 9th with iPad OS 17.7 and 18.0.1, things are fine and there isn't any performance issue. We developer took some time investigating and found it's because of iPad 10th's safari takes longer time to paint each frame. On iPad 9th, it needs nearly 10ms to paint each frame. But on iPad 10, it needs nearly 70ms to paint each frame. Also we can provide simple code for you to check the different. We tried to simulate the repaint when user is scrolling. You can see on iPad 9th, it will be 2~3ms but on iPad 10th, it will be more than 10ms for each frame. test-ipad10.html It has been happening on iPad 10th only with iPad OS 17.6/17.7/18.0. This will be a big problem for us because it means on the iPad 10th (the latest iPad, non Pro or Air), it can't be used. Question Is there anyone knowing similar issue with this one? And do you know how to solve it on iPad 10?
Topic: Safari & Web SubTopic: General
1
2
709
Oct ’25
Web inspector only works with HTTPS contexts in iOS simulator
Up until some point relatively recently, I have been able to use Safari's web inspector to connect to the iOS simulator in order to debug our web application in development at http://localhost:8088. Now, the web inspector still OPENS, but it opens in a broken state. The context is available to select from Safari's "Develop" menu: Develop > "iPhone 16 Pro (Simulator)" > "localhost - login". It appears under the Safari heading if I have navigated to the web app in the browser, or under the Expo heading if I am accessing it through the webview in our React Native wrapper app. When I select it, the web inspector window does appear. However, once it opens, the Elements pane is empty, the Console pane is empty, expressions entered into the console are not evaluated, there's no content in Sources, Network, Storage, etc. Important notes: This broken state happens at http://localhost:8088 as well as http://127.0.0.1:8088, and it seems that the insecure context is the issue. The web inspector DOES work for HTTPS sites. If I navigate to, e.g., https://example.com in the simulator and connect the web inspector, everything works fine. The web inspector also works fine in Safari on macOS (OUTSIDE the simulator) when accessing non-HTTPS sites. It's only a problem for non-HTTPS sites when connecting to the simulator. A coworker has the same problem, so it is not isolated to my machine. I would enable TLS locally as a workaround, but this web app is very complex, and I know from experience that it is very difficult for various reasons to set it up properly for our project in development, and it will take significant non-trivial work to do so. So... Why is this happening? Is this expected behavior? Is there a way that I can debug my site on localhost without HTTPS?
2
2
764
3w
Issue webview 18.4 beta
Hi all, With version 18.4 beta, I have a problem with the display of webviews in the app. In particular, the app of my bank has webviews inside it, and as they are not loading, I am unable to access it. Can you help me? Thank you.
Topic: Safari & Web SubTopic: General Tags:
2
2
696
Mar ’25
The bottom tab bar appears after using the keypad in OS26.
hi Testing on OS26 Public Beta 6. In Safari, if you enter x homepage and scroll, the tab bar sticks to the bottom and moves. Make the keyboard appear in the search window When scrolling down on the Safari homepage again, the issue of not being able to stick to the bottom appears. Is it because the liquid glass UI was applied this time? and safari bug? Please let me know if I'm missing anything
Topic: Safari & Web SubTopic: General
5
2
1.6k
Sep ’25