Hello,
I'm currently facing some issues with localization for the Safari extension on iOS:
Issues with Language Tags:
Folder names like pt-BR (Brazilian Portuguese) and pt-PT (European Portuguese) placed in the Resources/_locales/ directory are not displaying the respective languages correctly; instead, the default English is shown.
Similarly, using folder names like zh-CN (Simplified Chinese) and zh-TW (Traditional Chinese) also results in default English display instead of the intended Chinese language.
Conversely, when changing the folder names to pt (Portuguese general) and zh (Chinese general), the languages display correctly.
Could you please provide any recommendations or tips regarding language tag settings and how to ensure they are properly recognized according to RFC 5646?
Thanks for your help!
Best,
Explore 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 am developing a Mac application via Mac Catalyst and encountering an issue with WKWebView. Specifically, I'm loading a webpage (e.g., https://translate.google.com) in WKWebView, but when I press the copy button on the page, the content doesn't actually copy to the clipboard.
I've attempted modifying the UserAgent without any success. Here is the relevant part of my code:
override func viewDidLoad() {
super.viewDidLoad()
let config = WKWebViewConfiguration()
config.preferences = WKPreferences()
config.defaultWebpagePreferences.preferredContentMode = .desktop
let webView = WKWebView(frame: .zero, configuration: config)
webView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(webView)
webView.scrollView.showsVerticalScrollIndicator = false
webView.backgroundColor = UIColor.white
webView.scrollView.backgroundColor = UIColor.white
webView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
webView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
webView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
webView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true
if let url = URL(string: "https://translate.google.com") {
let req = URLRequest(url: url)
webView.load(req)
}
}
session.onvalidatemerchant = function(event) {
const validationURL = event.validationURL;
console.log("Validation URL:", validationURL);
document.getElementById('methodapplepay').value = "validate";
document.getElementById('validationURL').value = validationURL;
$.ajax({
url: 'ajax/processInternalDonate.php',
type: 'POST',
data: $("#payment_form").serialize(),
success: function(dataValidate) {
dataValidate = JSON.parse(dataValidate);
session.completeMerchantValidation(dataValidate);
},
error: function(xhr, status, error) {
console.error('Merchant validation failed:', error);
session.abort();
}
});
};
session.onpaymentauthorized = function(event) {
var payment = event.payment;
$.ajax({
url: 'ajax/processInternalDonate.php',
type: 'POST',
data: {pay_mode:"pay_mode",method:"process_payment",payment:JSON.stringify(payment)},
success: function(dataprocess) {
if (dataprocess.success) {
session.completePayment(ApplePaySession.STATUS_SUCCESS);
} else {
session.completePayment(ApplePaySession.STATUS_FAILURE);
}
},
error: function(xhr, status, error) {
console.error('Payment processing failed:', error);
session.completePayment(ApplePaySession.STATUS_FAILURE);
}
});
};
from this above two session methods for the first method I got the merchant validation response from the API calling from that method but for the session.onpaymentauthorized when the second API is calling then I got the message payment not processed on my apple pay popup upon autorisation from my phone so I want that you provide me the correct backend flow for this API calling so we get the amount charged and I also got the payment object from event.object on logging in my console.
On an older iPhone I'm testing with (6s, iOS 12.5.7), connected to the same Sandbox Apple ID that I'm using on multiple other devices, the Apple Pay button is not appearing. Neither on my web application, whatever version I set in the PaymentRequest, nor on the official demo site.
Further, 2 sandbox cards that were added fine to these other devices are failing to add on this one. Same cards and CVV codes are getting errors. At least "Invalid Card" on one of them. Although the other failed several times, then just worked this time when I tried it again :confused:
But on this phone, I have two cards successfully added, so the button should be appearing. On the demo site, whether I select Apple Pay JS API or Payment Request API, the button does not appear.
I have a hybrid mobile app which loads web server screens in its iframe(which is under the WKWebView); an https request is initiated from the mobile app to the web server which returns the html page to be loaded in the iframe.
The calls which are initiated from outside the iframe have cookies maintained in their requests, while the ones initiated from inside the iframe(web server page) loose the cookies and do not inherit them in IOS beta 18 while It worked fine in the previous IOS versions.
Anybody has infos about this or similar cases?
After the release of iOS17, our app has collected JavaScriptCore crashes, and the crash has recently appeared in iOS17 and above. The number of crashes collected recently is increasing.
The following are several complete crash log information. Currently, crashes are only collected on iOS17 and above systems.
2024-05-08_20-45-00.5216_+0800-fdb980f66f56d73b944ccc3466922d7fd0690089.crash
2024-05-11_02-42-46.0303_+0800-5ea1f23ba38c4782b80bd6304a9625e305c296a2.crash
2024-05-13_14-30-03.2084_+0800-d9598b08a153f5214b51257400423d4079049578.crash
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 )
I’m trying to figure out how to offer my Safari extension as a universal purchase. Does anyone know which targets I should use?
Should I use macOS or macOS Catalyst as a target? Any help would be appreciated, the docs don't answer this (I think)
Thank you
Topic:
Safari & Web
SubTopic:
General
Messages intended for a port connection created in content scripts are unable to receive messages from the extension background script.
Consider a content.js and background.js with the following contents:
content.js:
const port = chrome.runtime.connect({
name: 'TEST'
})
// THIS IS NEVER RECEIVED
port.onMessage.addListener((message) => {
console.log('RECEIVED TEST MESSAGE', message)
})
background.js:
chrome.runtime.onConnect.addListener((port) => {
if (port.name !== 'TEST') return
console.log('test port connected', port)
console.log('SENDING PORT MESSAGE')
port.postMessage('HELLO')
})
This behavior was broken in Sequoia, Safari 18. This behavior also does not match that of Firefox and Chrome, which are able to receive port messages in content scripts.
It's also worth noting that UI documents with the same origin as the extension, such as a popup or iFrame, ARE able to use the port messaging as expected.
However, this bug is a huge regression and should really be addressed. I've already filed an issue via Apple Feedback with the ID of FB14721836, over a month ago, but never received a response. I'm posting here for more visibility and hope a fix can be included before Sequoia goes live next week.
Shape Detection is a experimental feature on Safari/WebKit and can be enabled via feature flags in preferences.
Is there a way to enable it when using a WkWebView in my ios app?
Topic:
Safari & Web
SubTopic:
General
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.
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
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.
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!
Topic:
Safari & Web
SubTopic:
General
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.
Topic:
Safari & Web
SubTopic:
General
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?
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.
Topic:
Safari & Web
SubTopic:
General
Tags:
Safari Developer Tools
Safari and Web
Safari Services
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.
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?
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.