I'm converting a Chrome Extension to a Safari Web Extension, I found it's not easy to get favicon of current tab/url natively.
The tab object in Safari doesn't have favIconUrl.
{
	"id": 121,
	"index": 6,
	"active": true,
	"width": 1324,
	"audible": false,
	"url": "https://github.com/",
	"mutedInfo": {
		"muted": false
	},
	"windowId": 2,
	"title": "GitHub",
	"incognito": false,
	"pinned": false,
	"height": 935,
	"highlighted": true,
	"status": "complete"
}
		
2. I didn't find Safari has similar thing like chrome://favicon
3. I found Safari's favicon caches in ~/Library/Safari/Favicon Cache/favicons but have no idea how to use them in Safari Web Extension.
Safari Extensions
RSS for tagEnhance and customize the web browsing experience on Mac, iPhone, and iPad with Safari Extensions
Posts under Safari Extensions tag
113 Posts
Selecting any option will automatically load the page
Post
Replies
Boosts
Views
Activity
Sometimes Safari is rendering the icon for an active extension in its original provided colored representation, other times Safari is applying an overlay color in line with the system's highlight color.
This difference can even be seen seen on the Safari Extensions Developer home page: https://developer.apple.com/safari/extensions/images/extensions-hero-large_2x.png
You will notice that Grammarly's icon is shown in it's original color format, while the others aren't.
Example of extensions where the icon is shown in color:
Bitwarden
Grammarly
1Password
Consent-O-Matic
I've compared the source code of Bitwarden and Consent-o-Matic with my own extension and cannot find any differences in the settings or image properties (resolution, DPI, file type, color profile). If I take the exact PNG source files from said open source extensions and replace them in my own source code, these icons show up in full color.
Does this perhaps mean there is a bug in Safari's processing of the icons where it fails to overlay the icon with the highlight color in some cases?
I and I assume many developers with me would like to understand what determines this difference. Ideally, there is a consistent UX where the end user has the choice between icons in color or highlight color overlay.
I have a web extension that I want to send data to, and receive a response containing modified data.
My understanding is that the native app is only contactable by a background script. How does a webpage contact the background script?
One answer is by adding a content script, which is able to communicate with the background script using browser.native.sendMessage(). Unfortunately this triggers a warning that "this extension can read and alter web pages".
I do not want to read and alter web pages, nor do I want users to be concerned about a permission the app doesn't need. I just want to receive data, and then return a response.
What API should I be using to achieve this?
I have a simple Safari extension which contains only Javascript and no native code.
Currently I have the placeholder SafariWebExtensionHandler.swift that Xcode created when I added the extension. It's not doing anything useful, but simply deleting it doesn't seem to work.
Can I have an extension that includes no native code?
Hello, our app is non-sandboxed app, but we do want to support widget extension and safari extension. Those extensions require sandboxing. Is it possible to do this without sandboxing our app? Thank you!
It seems fetch() does not include credentials (cookie) even when credentials: include is used and Safari extension has host_permissions for that domain when using from a non-default Safari profile.
It includes credentials (cookie) when using from the default profile (which has the default name Personal).
Is there anyone who has this problem?
I try to request in popup.js like this:
const response = await fetch(
url,
{
method: 'GET',
mode: 'cors',
credentials: 'include',
referrerPolicy: 'no-referrer',
}
);
and it does not include the credentials (cookie) from host_permissions.
I already posted https://developer.apple.com/forums/thread/764279, and opened feedback assistant (FB15307169).
But it is still not fixed yet. (macOS 15.4 beta 3)
I hope this is fixed soon.
I have a simple Safari extension for iOS.
In its popup, I want a button that will open the app via a universal link.
I have this kind-of working, except that Safari opens the actual online destination of the link with a banner at the top saying "Open in the XXXX app" and an OPEN button.
What do I have to do to go directly to the app?
More generally, I know that if I copy-and-paste a universal link into the Safari address bar, Safari does the same thing - but it does go directly to the app from an <a href="...."> link.
In my app extension JavaScript, I set window.location. Presumably this is too similar to pasting into the address bar.
Is there some alternative to setting window.location that is more like clicking on a link and will go directly to the universal link's app?
Thanks.
Is it possible to open the native app from a web extension?
I have tried creating a new tab that uses the app's URL scheme but the UI asking the user to open the app is not shown until the new page UI is dismissed.
Creating a tab with an HTTPS URL that the app is setup to handle does not work and always the link in a new tab.
I tried sending a message to the app extension and using NSExtensionContext.open(_:completionHandler:) but the URL is not opened and the closure received false, indicating it was not handled.
Having the option to link back to the native app would be very useful.
I'm creating a Safari Web Extension, which successfully uses storage.local and storage.session on MacOS (14.x/15.x) and iOS (15.x,18.x). However, when testing on an iPad running iPadOS 16.3, it fails with an undefined error:
TypeError: undefined is not an object (evaluating 'api.storage.session.get')
Dropping to the console, I can access 'api.storage.local', but no luck for 'api.storage.session'.
First question, why would storage.session not be available? Is there something different on this iPadOS version to enable it? I could just use local storage, but don't need the data to persist. I'll probably just fall back to this solution.
Second question, should I instead be using localStorage and sessionStorage? I can't find any helpful direction on if using localStorage vs storage.local is best practice?
I develop a tab manager extension: https://apps.apple.com/ua/app/tab-finder-for-safari/id6741719894
It's written purely in Swift. All Safari interactions are done solely inside a SFSafariExtensionHandler .
But now i'm considering adding some features from Google Chrome's Extension API like window switching.
Is it possible to add a background.js worker to my existing Safari App Extension to have access to the beginRequest method override inside SFSafariExtensionHandler?
Without converting my extension from Safari App Extension to Safari Web Extenion?
I have a Safari Web Extension that successfully receives a message from a webpage and returns a response.
I now want to add a user interface to the Safari Web Extension. How do I do this?
I have modified the default template code as follow to add an NSAlert for testing. The modal runs, but no alert ever appears, and the code remains stuck at runModal.
What is the correct way to add a UI to a webextension?
- (void)beginRequestWithExtensionContext:(NSExtensionContext *)context {
id message = [context.inputItems.firstObject userInfo][SFExtensionMessageKey];
NSLog(@"Received message from browser.runtime.sendNativeMessage: %@", message);
NSAlert* alert = [[NSAlert alloc]init];
[alert setMessageText:message[@"request"]];
[alert setInformativeText:@"Hello"];
[alert runModal];
NSExtensionItem *response = [[NSExtensionItem alloc] init];
response.userInfo = @{ SFExtensionMessageKey: @{ @"id": message[@"id"], @"uuid": message[@"uuid"], @"contentType": message[@"contentType"], @"response": message[@"request"] } };
[context completeRequestReturningItems:@[ response ] completionHandler:nil];
}
@end
I have a Safari extension which allows the user to load their own homepage upon opening a new tab. The extension works by retrieving the homepage URL from UserDefaults and then redirecting to it using window.location.replace. In iOS 18, if the homepage is unable to be loaded due to, for example the user having no internet connection, Safari will go into an rapid loading loop, which eventually stops after a while. This is unlike iOS 17, where trying to reproduce the same scenario will end up with a Safari error page, which should be the expected behaviour.
In short, instead of Safari going into an infinite loading loop, it should display a Safari error page like iOS 17 does.
As this issue is only happening on iOS 18, I am almost certain it's an iOS bug and would appreciate if this can be fixed as soon as possible.
I have created a Feedback Assistant report with ID FB15853821, which contains a sysdiagnose file from my iPhone 16 Pro, as well as two videos, one from my iPhone 16 Pro with iOS 18.2 beta 3 and the other video showing a comparison between iOS 18 and 17. Both videos first show the extension functioning correctly with an active internet connection, but when I disable my internet, the iOS 18 Safari goes into an infinite loop.
Here are the steps to reproduce the issue:
Download the Homepage for Safari app from the App Store: https://apps.apple.com/gb/app/homepage-for-safari/id6481118559
Enter any valid homepage URL, such as https://apple.com and tap Save
Go to Settings -> Apps -> Safari -> Extensions -> Homepage and enable the extension
Make sure Open New Tabs is set to “Homepage”
Turn off both WiFi and cellular data and attempt to open a new tab in Safari
Please note that this also happens with iOS 18.2 beta 4.
Hi. I'm a developer of Tab Finder (https://apps.apple.com/us/app/tab-finder/id6741719894)
My problem is that every time i switch from my first window to a second window, the tabs in the validateToolbarItem() are INcorrect on a first call, but when I switch back from the second window to my main window, the tabs are CORRECT even on a first call.
To demonstrate it, i recorded a video: https://youtu.be/RwskzrSJ8u0
To run the same sample extension from the video, you can get the code from this GitHub repo: https://github.com/kopyl/test-tabs-change
Its only purpose is to log URLs of an active page of all tabs.
The SafariExtensionHandler's code of the sample app is very simple:
import SafariServices
func printOpenTabsHost(in window: SFSafariWindow) async {
let tabs = await window.allTabs()
log("Logging tabs for a new window: \(window.hashValue)")
for tab in tabs {
let page = await tab.activePage()
let properties = await page?.properties()
let url = properties?.url
log(url?.absoluteString ?? "No URL")
}
}
class SafariExtensionViewController: SFSafariExtensionViewController {
static let shared = SafariExtensionViewController()
}
class SafariExtensionHandler: SFSafariExtensionHandler {
override func validateToolbarItem(in window: SFSafariWindow, validationHandler: @escaping ((Bool, String) -> Void)) {
Task {
await printOpenTabsHost(in: window)
}
validationHandler(true, "")
}
override func popoverViewController() -> SFSafariExtensionViewController {
return SafariExtensionViewController.shared
}
}
Could you please tell if i'm missing something and how to see the actual tabs inside the overridden validateToolbarItem call of the SafariExtensionHandler (or in any other way, I'm okay with any implementation as long as it works).
Topic:
Safari & Web
SubTopic:
General
Tags:
Extensions
Safari Services
Safari and Web
Safari Extensions
DNR rules redirecting to an extension path lead to an error page: “Safari can’t open the page. The error is: “The operation couldn’t be completed. (NSURLErrorDomain error -1008.)” (NSURLErrorDomain:-1,008).”
Here is a demo extension that replicates the bug: https://github.com/lenacohen/Safari-Test-Extensions/tree/main/dnr-extension-path-redirect
This is an example of a redirect rule that leads to an error page instead of the extension path page:
chrome.declarativeNetRequest.updateDynamicRules({addRules: [
{
id: 2,
priority: 1,
action: {
type: "redirect",
redirect: {
extensionPath: "/web_accessible_resources/test_redirect.html"
}
},
condition: {
urlFilter: "||washingtonpost.com^",
resourceTypes: [
"main_frame"
]
}
}
]});
The extension path is included in web_accessible_resources in the extension manifest:
"web_accessible_resources": [{
"resources": [
"web_accessible_resources/test_redirect.html"
],
I also submitted a bug report on Apple's Feedback Assistant: FB16607632
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).
My app is a Safari extension. When trying to validate the app, I get the following error:
App sandbox not enabled. The following executables must include the "com.apple.security.app-sandbox" entitlement with a Boolean value of true in the entitlements property list: [( "app.rango.Rango.pkg/Payload/Rango for Safari.app/Contents/MacOS/Rango for Safari" )] Refer to App Sandbox page at https://developer.apple.com/documentation/security/app_sandbox for more information on sandboxing your app.
I don't know why this is happening. I have app sandbox enabled in both the app and the extension target. I have both entitlement files. When executing codesign -d --entitlements :- /path/to/binary I get the following:
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "https://www.apple.com/DTDs/PropertyList-1.0.dtd"><plist version="1.0"><dict><key>com.apple.security.app-sandbox</key><true/><key>com.apple.security.files.user-selected.read-only</key><true/><key>com.apple.security.get-task-allow</key><true/><key>com.apple.security.network.client</key><true/></dict></plist>
If I check on Activity Monitor, on the sandbox column it shows true. I have no idea why I keep getting this error when all indicates that the app is actually sandboxed.
We are testing our safari web extension (https://apps.apple.com/us/app/whatfix-for-jnj-centris/id6723895659) on an iPad 7th Gen (iPadOS v - 17.4.1)
I am sharing a video link where you can see the widget (named Self Help) appears on the application. However after a couple of refreshes, it vanishes. This widget is powered by the extension.
We tried connecting the iPad to Mac and opened the webinspector. The extension content script sends a message to the service worker and it is expected to send back a response which it is not doing
We believe it is related to an issue that has been highlighted multiple times in the developer forum -
https://developer.apple.com/forums/thread/758346
We have tried using several workaorunds as suggested by peer developers in the thread but we are unable to revive the service worker once it is killed.
We would like to understand from you, how to recover from this issue. Is there any workaround that we can apply to make sure that extension works fine?
It would be immensely helpful if we can get on a call to explain the issue further
Video Link: https://www.icloud.com/iclouddrive/0a7NR7BzDQHHU8zCHERuySBMw#RPReplay%5FFinal1740034010
I have a Safari App Extension which allows users to switch between last open tabs with a shortcut option+tab in the same way it's possible to switch between last open apps with command+tab.
Here is how i do it:
I inject a content script on all websites which has the only thing – key listener for option+tab presses.
When a user presses option+tab, that keyboard listener detects it and sends a message to the Safari Handler.
Then Safari Handler sends a message to the containing app and it shows a panel with last open tabs.
This approach has a problem: it shows a message to a user in settings: "Can read sensitive info from web pages, including passwords..."
Which is bad, because in reality i don't read passwords.
If i remove SFSafariContentScript key in the Safari App Extension target's Info.plist, then this message about reading sensitive data disappears, but then i loose the ability to open the tabs panel.
How can I open my app window with a shortcut without frightening a user?
It's possible to listen to global key presses, but that would require a user to grant the app permissions of Accessibility (Privacy & Security) in macOS system settings, which also sounds shady.
I know an app which does not require an Accessibility permission: https://apps.apple.com/ua/app/tabback-lite/id6469582909 and at the same time it does not tell a user about reading sensitive data in the extension settings.
Here is my app: https://apps.apple.com/ua/app/tab-finder/id6741719894 It's open-source: https://github.com/kopyl/safari-tab-switcher
Hi,
I'm developing an extension and I need to debug console logs that are logged in the Service Worker. The worker is configured in the manifest and is generally working as expected:
However, when I open the browser, go to any site, and open Develop -> Service Workers or Develop -> Web Extension Background Content it is not visible there, so I can't really access the logs:
But then I noticed that if I go out of focus from the browser for some time (and probably let the SW die), it becomes visible and I can open it without an issue:
So, a couple of questions:
Why isn't it instantly accessible? The extension Service Worker dev tools should be accessible regardless of what is happening to the tab or the browser, even if the SW terminates.
Why does it eventually appear under Web Extension Background Content instead of the Service Workers when it is in fact an SW?
Hello! I've made a Safari extension that supports command "ReTab", and a couple of month ago, adding a customized macOS shortcut for Safari with menu title "ReTab" did trigger the extension. However, it's not working anymore and I'm not sure if it's from macOS/Safari update or because I changed manifest from v2 to v3 - could you help check if there's anything wrong with either the manifest.json or background.js? (the default Cmd+E still works)
Thank you in advance!
Xun
manifest.json:
{
"manifest_version": 3,
"default_locale": "en",
"name": "ReTab",
"description": "Go to the last active tab with Cmd+E!",
"version": "1.4",
"homepage_url": "https://LycheeIsle.com",
"background": {
"service_worker": "background.js"
},
"action": {
"default_icon": "images/toolbar-icon.svg"
},
"permissions": [ "commands", "tabs", "storage" ],
"commands": {
"ReTab": {
"suggested_key": {
"default": "Command+E"
},
"description": "Go to the last active tab"
}
},
"options_page": "options.html"
}
in background.js, I have this line which should listen to the command, and Cmd+E works but any customized shortcut for "ReTab" in Safari doesn't:
browser.commands.onCommand.addListener(async (command) => {
if (command === "ReTab" || command === "retab") {
await retab()
}
});