I'm building a progressive web app (PWA) and came to the conclusion that almost nobody knows that this feature exists - Add to Home Screen. Not many people even understand what a PWA is or that you can add it to the home screen. This feels unnatural compared to installing an app from a store. Why do we make it so hard for users? Could we not make this easier by having the ability to call this installation or show an install notification?
Right now, when users visit a PWA on iOS, there's no way for developers to let them know they can install it. The "Add to Home Screen" option is tucked away in the Share menu, and most users never find it. I'd really like to be able to show them a friendly prompt.
Comparing to other browsers, this is possible via the beforeinstallprompt event. This would make a huge difference for user experience. Right now the only way is to show iOS users a separate set of instructions with screenshots, which feels clunky compared to what's possible on other platforms.
I'm curious - is there any reason why this hasn't been added to Safari yet? Other browsers have supported this for years now. Is there any progress being made on this, or is it being considered for the roadmap? It would be really helpful to know if this is something that will be worked on in the future.
I know there's a lot on the roadmap, but this would really help developers create better installation experiences for our users.
Thanks for considering this!
Selecting any option will automatically load the page
Post
Replies
Boosts
Views
Activity
Create shortcut to open chrome with url and put it on the desktop.
Tap the shortcut.
Tap the username text field.
When launching Safari from an iOS shortcut on an iOS device with a valid passkey registered, the passkey suggestion does not appear; instead, the password suggestion appears sometimes.
Topic:
Safari & Web
SubTopic:
General
Tags:
WebKit
Safari
Safari and Web
Passkeys in iCloud Keychain
Does webkit have a way to display a smart banner for a home screen web app similar to how a smart banner can be displayed for native apps?
I recently noticed (10/23) that Twitter showed a smart banner encouraging Home Screen web app on my Mac running Sonoma.
How is this done?
Hi! We are having a hard time with the universal link, help is appreciated! Thanks in advance!
The universal link doesn't work after installation for some time. A user has to wait for from 5 to a couple of hours after the app is installed on the device.
This has also affected App reviewers since we need the universal link to work for successful login. Each submission will receive a rejection of we cannot login and it will be approved until we kindly ask them to try again.
I believe the JSON is delivered to devices by Apple's CDN system and the fact that it works on most devices most of the time should imply that we have a valid apple-app-site-association setup.
So I am really confused about the wait time, which is giving us trouble with app review and a bad user experience
Hello,
I’m encountering a problem with WebSocket connections in Safari on iOS 18.1 and later when initiated from an iframe. The same implementation works perfectly in other browsers like Chrome but fails in Safari.
In Safari, the WebSocket connection fails with error message
"WebSocket connection to 'wss://MY_CONNECTION_URL' failed: The internet connection appears to be offline."
Has anyone else faced this? Is this a known limitation or bug in Safari? Any workarounds or solutions would be greatly appreciated.
Thank you!
Hi Apple Team,
Can we use SFSafariViewController to launch a 3rd party passkey authentication experience from a native iOS app?
Regards
Hi folks,
When doing HLS v6 live streaming with fmp4 chunks we noticed that when the encoder timestamps slightly drift and a #EXT-X-DISCONTINUITY tag is created in either the audio or video playlist (in an ABR setup), the tag is not correctly handled by the player leading to a broken playback containing black screen or no audio (depending on which playlist the tag is printed in).
We noticed that this is often true when the number of tags is odd between the playlists (eg. the audio playlist contains 1 tag and the video contains 2 tags will result in a black screen with audio).
By using the same "broken" source but using Shaka player instead won't break the playback at all.
Are there any possible fix (or upcoming) for AV Player?
I want use the Safari Extension to decorate the window.fetch function, But No matter how I try, I can't get the fetch function to execute correctly. I was going through the documentation: https://developer.apple.com/documentation/safariservices/using-injected-style-sheets-and-scripts
and found this sentence:
"Injected scripts have an implied namespace — you don’t have to worry about your variable or function names conflicting with those of the website author, nor can a website author call functions in your extension. In other words, injected scripts and scripts that you include in the webpage run in isolated worlds, with no access to each other’s functions or data."
Does this mean I can't modify the window object in the content script just like a Chrome extension does with the webpage?
BTW, In chrome I use chrome.scripting.executeScript API, and in
plasmo I just use world: "MAIN" content script's config to achieved this feature.
When using iOS VoiceOver to navigate a webpage, selecting a element correctly activates the :focus-visible state. However, when VoiceOver moves to a non-button element (such as a or ), the previously focused button retains its :focus-visible state. The focus indicator only updates when VoiceOver moves to another .
This behavior can be confusing for screen reader users, as it creates the appearance of multiple elements being focused simultaneously. It also differs from expected keyboard navigation behavior, where focus styles typically update as soon as the user moves to a new interactive element.
Is this an intentional VoiceOver behavior, or could this be a bug? If intentional, is there a recommended workaround to ensure correct focus indication when moving between different types of elements?
Steps to Reproduce:
Enable VoiceOver on an iOS device.
Navigate using swipe gestures or explore-by-touch to focus on a .
Observe that the button correctly receives the :focus-visible styling.
Move to a non-button element (e.g., a with tabindex="0" or an ).
Notice that the button still retains its :focus-visible state, even though VoiceOver has moved to a new element.
Expected Behavior:
The previously focused should lose its :focus-visible state when VoiceOver moves to a different interactive element, just as it does when using keyboard navigation.
Actual Behavior:
The :focus-visible state remains on the previously focused button unless VoiceOver moves to another . This can create confusion by displaying multiple focus indicators at once.
Tested On:
iOS 17.7, 18.3.1
iOS Safari
iPhone 11 Pro, iPhone 14 Pro Max
I'm posting a question here as I have encountered an issue while seeking help from engineers in the thread. thread773837
If the "Not Secure Connection Warnings" is enabled in Settings > App > Safari, are HTTP connections not allowed under any circumstances?
I also posted a question about NSAllowsLocalNetworking not being applied, and I was informed that ATS (App Transport Security) is not related to SFSafariViewController. If that's the case, what feature causes the error "Safari cannot open the page. Error: Failed to navigate to an HTTP URL with HTTPS-only mode enabled"?
I am currently working to resolve this issue.
In a project to create a web extension for Safari, using scripting.registerContentScript() API to inject a bunch of scripts into web pages, I needed to manage a dynamic whitelist (i.e., web pages where the scripts should not be injected).
Fortunately, scripting.registerContentScripts() gives you the option of defining a list of web pages to be considered as a whitelist, using the excludeMatches parameter in the directive, to represent an array of pages where the script should not be injected.
Here just a sample of what I mean:
const matches = ['*://*/*'];
const excludeMatches = ['*://*.example.com/*'];
const directive = {
id: 'injected-jstest',
js: ['injectedscript.js'],
matches: matches,
excludeMatches: excludeMatches,
persistAcrossSessions: false,
runAt: 'document_start'
};
await browser.scripting.registerContentScripts([directive])
.catch(reason => { console.log("[SW] >>> inject script error:",reason); });
Of course, the whitelist (the excludeMatches array) is not static, but varies over time according to the needs of the moment.
Everything works perfectly in Chromium browsers (Chrome, Edge, ...) and Firefox, but fails miserably in Safari. In fact, Safari seems to completely ignore the excludeMatches parameter and injects the script even where it should not.
Has anyone had the same problem and solved it somehow?
NOTE : To test the correctness and capabilities of the API in each browser, I created a simple repository on Github with the extension code for Chromium, Firefox and Safari (XCode project).
I want to migrate from a Safari App Extension to a Safari Web Extension, but don't know how to get rid of the message, telling users that my extension can access their passwords. Here is a message which I see:
I was thinking that this might be because all Safari Web Extension get this type of access, but I have a Safari Web Extension which does not require such level of access:
Here is the manifest:
{
"manifest_version": 2,
"default_locale": "en",
"name": "__MSG_extension_name__",
"description": "__MSG_extension_description__",
"version": "1.1",
"icons": {
"48": "images/icon-48.png"
},
"background": {
"scripts": [
"background.js"
],
"persistent": true
},
"browser_action": {
"default_popup": "popup.html",
"default_icon": {
"16": "images/toolbar-icon-16.png"
}
},
"permissions": [
"nativeMessaging", "tabs"
]
}
and here is the Info.plist file:
Here is the entire code of the extension:
https://github.com/kopyl/web-extension-simplified
I am trying to build and run a Safari Web Extension from Xcode and I have enabled "Allow unsigned extensions" in Safari settings. However, I see the below pop up:
And, if click on the "Quit and Open Safari Extensions Preferences..." button, the project stops running on Xcode and nothing happens.
What can be the issue? The extension works and runs fine if I get it from the Mac App Store and this only happens when running from Xcode. I even tried completely uninstalling the mac app store version and still facing the same issue.
Please update Accessibility OS Settings for VoiceOver in iPhone iOS and iPadOS to include frames on the Rotor, and to make web navigation and component gestures easier to find and assign. Please add content to the iPhone and iPad Apple User Guide to use VoiceOver in web navigation with touch gestures.
Specifically... iframes.
There is no clear guidance in Apple documentation for VoiceOver users in iPhone or iPadOS to access iframes with touch gestures. A common belief as written on AppleVis, other blogs, and internet searches is that iframes in Safari or a webView in an app are only available with explore by touch.
If explore by touch is the only option for some interactions, that needs to be included in Apple User Guides. If not, details on equivalent touch gestures for VO that have keyboard interactions in Mac need to be clear for users.
VoiceOver for Mac includes a default keyboard interaction of VO-Command-F in its extensive User Guide (https://support.apple.com/guide/voiceover/by-images-or-frames-mchlp2740/mac). A user can include a rotor option for web navigation for iframes.
VoiceOver for iPhone and iPad does not include a default swipe gesture assigned to frames. An option is not available for the Rotor.
While there is iPhone User Guide guidance that gestures can be customized (https://support.apple.com/guide/iphone/customize-gestures-and-keyboard-shortcuts-iph59a8e6fd2/18.0/ios/18.0), it is not clear that for adding this gesture, "Move to the next frame" is tucked into the advanced navigation commands for VoiceOver Accessibility Settings in the OS. At least in my phone, the word "frame" was not searchable despite the All Commands screen using a search bar.
After updating to iOS 18.4, our web application (with service workers) crashes on devices that accessed it prior to the update. This issue also affects hybrid mobile apps using the same web application; reinstalling the app resolves it by refetching and reinstalling service workers. Debugging is challenging because clearing the cache or reinstalling the app fixes the problem, and no useful error logs are available. Has anyone encountered similar crashes related to service workers after an iOS update and have any insights into the cause?
Howdy,
WKWebView feature request: allow Fullscreen API without User Gestures
similar to ElectronJS' userGesture: true flag that allows devs to bypass user gesture restriction for Fullscreen API and similar
executeJavaScript(code[, userGesture])
https://www.electronjs.org/docs/latest/api/web-contents#contentsexecutejavascriptcode-usergesture
afaik this is allowed because of a fairly recent update to Chromium that also allows users to give Fullscreen API permissions per domain
https://chromeos.dev/en/posts/using-the-fullscreen-api-without-gestures
Would be greatly useful for a use case in my cross-platform app, so I can avoid rewriting all platforms to use Chromium
Thanks
updateDynamic rules is blocking ads on my device with iOS 17.4, but on my iOS 18 device the same code is not blocking ads.
Is this a known issue?
Calling SFContentBlockerManager.reloadContentBlocker from related App extension intermittently fails
I have an app which has at least two extensions:
A Content Blocker extension with a request handler that returns an appropriate NSExtensionItem as part of beginRequest. A different file URL is returned depending upon if the content blocking is on or off by a user setting
A Safari Web Extension that includes a toolbar button and popover that enables users to enable or disable the ad blocking of the content blocker extension
All three targets (App, Content Blocker appex and Web Extension appex) use an App Group default to read and set the on or off status of the content blocking.
When the user changes the content blocking status, the app group default is updated and SFContentBlockerManager.reloadContentBlocker(...) is called.
The Content Blocker extension reads the default and then returns the appropriate file URL.
The issue is, I have noticed that whenever SFContentBlockerManager.reloadContentBlocker(...) is called from the app, Safari always applies the correct rules from the returned file URL.
However sometimes when SFContentBlockerManager.reloadContentBlocker(...) is called from the Safari Web Extension using native messaging, Safari does NOT apply the correct rules from the returned file URL.
Using logging I have confirmed that the Content Blocker extension always returns the appropriate file URL irrespective if called as a result of the app or the web extension.
Despite this, Safari does not seem to always apply the returned file URL rules when it is called from the Safari Web Extension appex. In these cases, quitting Safari and relaunching it seems to make it apply the rules correctly (obviously this is applying it due to its launch state, not due to the Web extension appex asking it to do so at that point).
All targets have access to the App Group location where the active content blocking file URL belongs and the inactive content blocking file URL is within the Safari content blocker target as a resource.
I don't think this is a memory status issue as I cannot see the Content Blocker extension being killed when it returns complex rules --- the fact it always works when called via the app also seems to rule this possibility out.
This brings up a number of questions:
Is calling SFContentBlockerManager.reloadContentBlocker(...) from a different appex, of the same app target and app group supported? (it seems to work sometimes and did work in previous versions of the app).
Is there an issue that the Content Blocker extension sometimes returns a file URL that perhaps the calling Web Extension appex may not have access to (even though Safari should via the Content Blocker extension)?
Any other ideas of why this may not be working correctly?
Has anyone else experienced this?
It seems to happen on both iOS and macOS Safari using the same codebase.
Hi, I'm using a webview in Swift, where I load an html file locally. Basically I have an angular project built and loaded directly into my app bundle. The webview requires the use of the camera. I request permissions via and javascript, the pop-up appears, I accept the permissions and the app works correctly. Only that after a certain number of seconds, the permissions are requested again. It's as if the webview doesn't cache the accepted permissions.
Is this normal behavior?
I am using Angular version 14
Topic:
Community
SubTopic:
Apple Developers
Tags:
Safari Developer Tools
Safari Services
Safari and Web