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

General Documentation

Post

Replies

Boosts

Views

Activity

Enable/disable Safari web extension content blocker using declarative_net_request in manifest
Is it possible to enable/disable the enabled flag before the extension is loaded? we want to have a button in our app which controls the availability of the content blocker ruleSet in declarative_net_request in manifest (version 2). "declarative_net_request": { "rule_resources": [ { "id": "ruleset_1", "enabled": true, "path": "ruleset_1.json" } ] },
3
0
179
1w
iOS 18 - Safari Extension turned on but not working & storage nuked
Hello, I am developer of a Safari Extension. I have had a few reports from users who have paid for my app and have upgraded to iOS 18 report that the extension isn't working any more. I upgraded myself and opened Safari, my extension was turned on but not working. I turned the extension off and back on, then it started working. However it did not have anything in browser.storage.local... so it has to be setup again from scratch for all of these users... This has been confirmed by multiple users. What the hell is this Apple? Why have you nuked Safari Extension storage when upgrading to iOS 18? And why does the extension stop working when upgrading to iOS 18? Nowhere near good enough... was this even tested?
2
1
234
1w
Options and Services in Safari with Selenium?
Firefox and Chrome provide various options and services to set up browser characteristics while testing. These can be used with Selenium while setting up the driver. An example with Firefox is setting a custom user agent and a download directory different than the default. Using Python: from selenium.webdriver.firefox.options import \ Options as FirefoxOptions from selenium.webdriver.firefox.service import \ Service as FirefoxService firefox_options = FirefoxOptions() # set up user agent user_agent = UserAgent().get_user_agent() firefox_options.set_preference("general.useragent.override", user_agent) # set alternate download location firefox_options.set_preference('browser.download.folderList', 2) firefox_options.set_preference('browser.download.dir', download_dir_path) Many of these browser-specific options and services are listed at Selenium's website under Supported Browsers. However, Safari's information is very limited. On Selenium's site, for example, they list how to turn on Safari's limited logging: service = webdriver.SafariService(service_args=["--diagnose"]). Then, they point us to About WebDriver for Safari - which shows automaticInspection and automaticProfiling. The page primarily describes security features for testing with Safari. In a regular user session, one can configure an alternate download directory, set a custom profile with specific settings for that profile, and so on. And, in the Developer Menu I can set some of these items manually for a given session (user agent, for example). How can I access these features within Safari for use in automated web testing with Selenium? Edit: Alternatively, does Apple have, or recommend, a different automated testing package for Safari?
0
0
107
1w
Content blocker extensions vs content blocking using Safari extensions for dynamic URLs
We have observed that blocking content using Safari web extension does not fetch few URLS within the #document (documentURLs) because the onBeforeRequest webextension API is currently not available in Safari iOS. But it works fine using the Content blocking extension. We have a list of URLs which we want to block from the website. Which extension would you suggest the Content blocking extension or the Safari web extension?
1
0
143
1w
The difficulties of web development in the face of opaque inappropriate Safari autofill behavior
Through focussed debugging, I have discerned that if a web page's "text" input element's name attribute contains a dash (and does not contain -#- (e.g. -0-)), Safari will: Display a contacts icon inside the field and Add a drop-down populated with phone numbers from the user's contact card (on top of any pre-existing datalist dropdown). Ignore the element's autocomplete="off" There is post after post and blog article after blog article on the web that propose endless solutions to similar Safari issues, each working in various different contexts. It's a mess really. I am currently trying to develop a django web form for scientific data using django's FormSet class. Specifically, I was using FormsSet.empty_form to create a javascript clone-able form that would propagate field values to added (numbered) forms. I implemented things incrementally. I started out with a regular form and encountered a behavior where an autofill dropdown would present me with previously submitted values, e.g.: Adding autocomplete="off" to the input element prevented this. I then implemented formsets, defaulting to 1 form (so that all input elements' names started with form-0-) and everything worked as expected. However, when I changed the strategy with default to 0 initial forms and presented FormSet.empty_form as a template that would be cloned anytime files were dropped/selected, I started getting phone number drop-downs in all of the test fields: I googled this quite a bit and tried many things, including a strategy I'd employed before, to no avail, so to make debugging this issue easier and try a bunch of things quickly, I saved the page source and put it in the static folder, then started tweaking things to figure out what was causing this to happen. It appears that anytime a text input element's name attribute contains a dash (and does not contain -#-), Safari assumes it's a phone number field, despite the fact that the name's text, placeholder's text, possibly the label's text, the fact that the element has a list attribute set to the ID of a datalist element, and the fact that autocomplete is explicitly set to off. I would say that the heuristic used to trigger phone number autofill needs some serious tweaking. Not only that, but web developers need more transparency on how it works, so that non-sensical autofill behavior like this can be avoided. Another aspect of this is that if you have lots of cloned forms that Safari tries to apply autofill to, it dramatically decreases the page's performance. Safari autofill behavior has been a constant bane of mine, because many of our users use macs. I have not yet tried CSS solutions I've seen hints of (mainly because all the articles/posts I've seen about them are quite dated). Any information anyone can provide to tame Safari autofill and prevent this errant behavior would be much appreciated.
0
0
110
1w
Universal Linking not working
Hi Team, Universal linking is not working with safelink and when using the amazon SES. https://docs.aws.amazon.com/ses/ When we have email template and click on the links we are unable to open the app with safe links, does anyone faced this problem before for when using safe link with amazon SES or any other services. Please help me to resolve this issue as soon as possible.
1
1
122
1w
SFSafariApplication::dispatchMessage() in xcode 16
We are making Safari extension for MacOS, that uses SFSafariApplication.dispatchMessage() to communicate between native and javascript parts of extension. Until recently everything worked, however after update to xcode 16 I started getting this error: 'dispatchMessage(withName:toExtensionWithIdentifier:userInfo:completionHandler:)' is unavailable in application extensions for macOS: Not available to extensions 'dispatchMessage(withName:toExtensionWithIdentifier:userInfo:completionHandler:)' has been explicitly marked unavailable here (SafariServices.SFSafariApplication) I looked into documentation, however I did not find any hint of dispatchMessage() being replaced by something else. According to https://developer.apple.com/documentation/safariservices/messaging-between-the-app-and-javascript-in-a-safari-web-extension this is the way communication should be done. Is it a bug? Or can someone direct me to working alternative of communication?
6
0
276
2w
WKWebview form filling with cross origin iframe
Hi everyone, I’m working on an iOS app using WKWebView, and I have a specific use case involving cross-origin iframes and form autofill. I’m wondering if it’s possible to programmatically fill input elements, such as credit card numbers, within a cross-origin iframe loaded in a WKWebView. I understand that due to the Same-Origin Policy, direct DOM manipulation of cross-origin iframes is restricted. However, I’m curious if there are any methods or workarounds that might allow me to achieve this, specifically within the context of WKWebView. Thanks.
2
0
214
2w
Cannot Play mp3 File via AudioContext in iOS 18 Safari
I have a Safari extension that plays audio via the javascript AudioContext API. It was working fine under iOS 17 and is now broken under iOS 18. It does not play audio at all. I've tried in both the iOS 18 public beta and the iOS 18.1 developer beta. It is broken in both of them. I've also created Feedback item FB15170620 which has a url attached to a page I created which demonstrates the issue.
0
0
173
2w
Inquiry Regarding Significant Character Spacing Changes in PingFang Font within WebKit on iOS 18 for H5 Content
Dear Apple Support Team, Upon upgrading to iOS 18, I have noticed a marked change in the character spacing of the PingFang font when rendered by WebKit, the web content rendering engine utilized by Safari and other web views in iOS. Specifically, the spacing between characters appears to have increased or altered in a manner that is not consistent with previous iOS versions or with the font's specifications as defined in CSS. This issue has significantly impacted the visual presentation of my web pages, causing a notable deviation from the intended design and potentially affecting user experience. Expected Behavior: The character spacing of PingFang font in WebKit on iOS 18 should maintain consistency with previous versions or adhere strictly to CSS specifications, ensuring a seamless transition for web developers and end-users alike. Request for Assistance: Could you please investigate this issue and confirm if it is a known bug or an intentional change in iOS 18? If it's a bug, could you provide an estimated timeline for a fix or a workaround that we can implement in the meantime? Additionally, any guidance on how to best address this issue in our H5 content, such as alternative font choices or CSS hacks, would be greatly appreciated. Thank you for your attention to this matter. We value the stability and consistency of the WebKit engine and the overall iOS platform, and we look forward to your prompt response and resolution.
2
0
498
Jul ’24
Shadows are not displayed correctly
Open PDF https://bug-279812-attachments.webkit.org/attachment.cgi?id=472582 in Safari using https://mozilla.github.io/pdf.js/web/viewer.html It looks like: In Chrome it looks like: Bug tracker: https://bugs.webkit.org/show_bug.cgi?id=279812 Please fix the issue.
0
0
128
2w
Plans for web-based mID verification?
Hi, I run an online enrollment system for a school in Arizona. Through this, we've been able to streamline document collection ten-fold, however, we're now trying to optimize where the documents come from. Since Arizona supports mID, I was curious if Apple has any plans on allowing websites access to mID verification? I noticed Google had an interest form for a web API, so if there is one for Apple, I'd appreciate the link (i can't find it)! Thanks!
0
0
131
2w
Flutter iOS- The flutter webview on an iOS device fails to load assets, images, and CSS files with relative URLs from the local directory.
Flutter web view- I am downloading assets from server and using that assets to create html file to load on web view. I downloaded them to the local document directory on the device. From there I can load the HTML files in a webview using the file:// schema, with the benefit that images, css etc. that are referenced in the HTML are loaded as well. This works fine in Android (simulator and real device) as well as in an iOS simulator. But on an iOS device the flutter webview fails to load assets , images & css files with a relative URL from local directory. This is strange as the iOS simulator should behave the same in that case (as it is not really a hardware related issue). Help me out from this issue.
0
0
243
2w
Safari DNR Redirect Issue When Using Address Bar for Default Search Engine Queries
I’ve noticed that redirecting from one web page to another using DNR (Declarative Net Request) no longer works if: The source page is a search results page of the default search engine, and The user searches for a keyword from Safari’s address bar. Has this functionality been degraded, or is it an intentional restriction? I'd like a response from Apple. Steps to Reproduce Create a Safari extension that adds the following rule using browser.declarativeNetRequest.updateSessionRules() in background.js: { id: 37457985, priority: 1, action: { type: "redirect", redirect: { regexSubstitution: "https://search.brave.com/search?q=\\1" }, }, condition: { regexFilter: "https://duckduckgo.com/\\?(?:.*&)?q=([^&]*).*", resourceTypes: ["main_frame"] } } Enable the extension in Safari. Set Safari’s default search engine to DuckDuckGo. Type "hello" in the address bar to search for it. Expected: Search results for "hello" appear in Brave Search. Actual: Safari navigates to neither DuckDuckGo nor Brave Search. For further reference, please see: Sample Xcode project: GitHub link Demo video: GitHub link Environment I’ve confirmed this issue on the following environments: Safari Technology Preview 202 (macOS Sonoma 14.6.1 (23G93)) iOS 18 RC (22A3354) This issue does not occur in the latest release version of Safari 17.6 (19618.3.11.11.5) on macOS, so I believe it started with the current development version of Safari. Context My Safari extension, Redirect Web for Safari, uses DNR to redirect one web page to another. While the extension is not specifically designed to change the default search engine, some users use it to set their preferred search engine. Unfortunately, this issue will break their use case. Additional Information This issue only occurs when searching from the address bar. It does not happen when searching directly from https://duckduckgo.com. I haven’t submitted this issue via Feedback Assistant because I’m unsure if it’s a bug or intentional behavior. I’d like to confirm if this is by design first.
2
0
351
3w
Add website icon to Apple Pay payment sheet
https://developer.apple.com/design/human-interface-guidelines/apple-pay#Displaying-a-website-icon This tells us to: If your website supports Apple Pay, provide an icon in the following sizes for use in the summary view and the payment sheet: But doesn’t tell us how to do that. Please advise what steps we need to take to make this happen. I've seen from both Stack Overflow and a developer support email that this is supposed to come from standard website "favicons", but I have these in place, and still no icon is appearing on the payment sheet. So, I guess I need a very detailed answer to exactly what name/size/shape is required. I have the following HTML in my page <head>, and the images referenced are found and do load when accessed directly: <link rel="apple-touch-icon" sizes="120x120" href="/payment/htdocs/images/logo--azmvdnow-blue-60x60@2x.png" /> <link rel="apple-touch-icon" sizes="180x180" href="/payment/htdocs/images/logo--azmvdnow-blue-60x60@3x.png" /> (An earlier, unanswered question that seems to be asking the same thing: https://developer.apple.com/forums/thread/723419 )
1
0
225
3w
@@extension_id replacement in CSS file fails in Sequoia, Safari 18
Typically, you can use the @@extension_id special string to reference the absolute path into the bundled resources of an extension, such as an image or a custom font, in a CSS file. However, this broke with Safari 18. Consider this section in a popup.css file: .card-icon { height: 16px; width: 20px; background-image: url(safari-web-extension://__MSG_@@extension_id__/images/card.svg); background-size: 20px 16px; } In Safari 17.4, once loaded in the browser, @@extension_id is replaced with E8BEA491-9B80-45DB-8B20-3E586473BD47, and the background-image reads as so: background-image: url(safari-web-extension://E8BEA491-9B80-45DB-8B20-3E586473BD47/images/card.svg); But as of Safari 18, the @@extension_id just collapses to an empty string, and the background-image reads as so: background-image: url(safari-web-extension:///images/card.svg); and the svg fails to load with the following error: "Failed to load resource: You do not have permission to access the requested resource." This is a regression, does to match the behavior of the other major browsers, and should be fixed. Filed with Feedback ID: FB15104807
2
1
357
3w