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.
General
RSS for tagExplore 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
I want to know will element support an x3d model?
Topic:
Safari & Web
SubTopic:
General
I am building Safari extension. In my background script I am setting badge text and title like this:
browser.action.setBadgeText({text: badgeText, tabId: tabId});
browser.action.setTitle({title: badgeText + " found images", tabId: tabId})
, where tabId is correct id of current tab.
I was expecting that in this way I am setting a different badge and title for different tabs, so that badge and title would automatically switch if I activate different tab. However this does not happen, badge and title behave as if set globaly and don't change with tabs. How is this expected to work?
I have also tried to set badge globally, and update it every time user switches a tab. I have set up listener like this:
browser.tabs.onActivated.addListener(function(actInfo) {
console.log("switched tab to " + actInfo.tabId);
});
, however the event never fires, tab switch is never logged in console.
Am I doing something wrong here?
This is my manifest, if there was a problem with permissions or something similar.
{
"manifest_version": 3,
"default_locale": "en",
"name": "Test",
"description": "Test Extension",
"version": "1.0",
"icons": {
"48": "images/icon-48.png",
"96": "images/icon-96.png",
"128": "images/icon-128.png",
"256": "images/icon-256.png",
"512": "images/icon-512.png"
},
"action": {
"default_title": "a test title",
"default_popup": "popup/hello.html",
"default_icon": {
"16": "images/toolbar-icon-16.png",
"19": "images/toolbar-icon-19.png",
"32": "images/toolbar-icon-32.png",
"38": "images/toolbar-icon-38.png",
"48": "images/toolbar-icon-48.png",
"72": "images/toolbar-icon-72.png"
}
},
"web_accessible_resources": [
{
"matches": ["*://*/*"],
"resources": ["images/*", "css/*", "scripts/lib/*"]
}
],
"background": {
"service_worker": "scripts/background.js",
"type": "module"
},
"content_scripts":
[
{
"js": [
"scripts/content.js"
],
"matches": [
"http://*/*",
"https://*/*"
],
"css": ["css/style.css"],
"run_at": "document_end"
}
],
"permissions": [
"nativeMessaging", "tabs"
]
}
We’re currently trying to implement Apple Pay on our checkout flow pages, which are part of a NextJS application. Due to the fact that our checkout flow is a React-based application, we’re not using the element, but a custom button. We are using the Apple Pay JS API.
It seems like we are getting most of the pieces in place, however we’re not having any success with the session.onvalidatemerchant event. Currently when a user clicks the Apple Pay button, the Apple Pay dialog appears briefly with a ‘Payment not completed.’ message and then closes immediately.
Given the nature of the issue it seems like it could possibly be a configuration error, but we’re not really sure how to check that everything is configured as it should be.
Some questions that we have at the current moment:
What version of the Apple Pay API should we be using?
Should the domainName value that we’re passing to Apple contain https:// ?
Should we be calling the https://apple-pay-gateway.apple.com/paymentservices/paymentSession endpoint directly from our front-end code?
Should we pass data to session.completeMerchantValidation(sessionData); as a JavaScript object or JSON?
Topic:
Safari & Web
SubTopic:
General
I am using SFSafariViewController to process payments via a Stripe checkout URL. Once the payment is completed, the user is redirected to a success URL. I have also added associated domains for deep linking. Below is my implementation:
func presentCheckout(url: String) {
showProgressHUD()
let checkoutURL = URL(string: url)!
safariVC = SFSafariViewController(url: checkoutURL)
safariVC.delegate = self
self.present(safariVC, animated: true)
}
// Delegate method implementations
func safariViewControllerDidFinish(_ controller: SFSafariViewController) {
print("SafariViewController dismissed")
// Handle dismissal
}
func safariViewController(_ controller: SFSafariViewController, initialLoadDidRedirectTo URL: URL) {
print(URL.absoluteString)
if URL.absoluteString.contains("xsworld/payment/stripe/checkout/success") {
controller.dismiss(animated: true) {
if URL.absoluteString.contains("/v1/resources/xsworld/payment/stripe/checkout") {
NotificationCenter.default.post(
name: Notification.Name("StripePaymentStatus"),
object: nil,
userInfo: ["url": URL]
)
}
}
} else if URL.absoluteString.contains("xsworld/payment/stripe/checkout/cancel") {
// Handle failure
NotificationCenter.default.post(
name: Notification.Name("StripePaymentStatus"),
object: nil,
userInfo: ["url": URL]
)
}
}
func safariViewController(_ controller: SFSafariViewController, didCompleteInitialLoad didLoadSuccessfully: Bool) {
if didLoadSuccessfully {
print("Initial page loaded successfully")
} else {
print("Initial page load failed")
}
}
Issue:
The safariViewController(_:initialLoadDidRedirectTo:) method does not always get called after the payment is completed. Sometimes it works as expected, and sometimes it does not trigger at all.
What I’ve Tried:
Ensuring the associated domains for deep linking are correctly set up.
Checking the success and failure URLs.
Debugging to see if the redirect happens but is not detected.
What I Need Help With:
I want to ensure that the redirection always works after the payment process is completed, whether through deep linking or another reliable approach. How can I guarantee that my app correctly detects and handles the redirect every time?
Any guidance or best practices would be greatly appreciated.
Topic:
Safari & Web
SubTopic:
General
Tags:
Safari Developer Tools
Safari Services
Safari
Safari Extensions
Dear all,
I have a web application, where it is possible to book a subscription on a monthyl / yearly basis via PayPal.
Normally the users use the safari function "add-to-homescreen" for baving the webapp directly on the homescreen.
Nevertheless, since one of the last updates, it is not possible to book a subscription via PayPal. But this is only for the homescreen variant. If i open it directly in safari everthying works as desigend.
Looking forward to get some help from you.
Thank you!
Topic:
Safari & Web
SubTopic:
General
iOS WKWebview - When we run the WKWebview with loading the HTML file. Including JS method call and video looping it here in js file. Getting this method call webViewWebContentProcessDidTerminate(_ webView: WKWebView). Can anyone provide the solution?
Thanks
I’m trying to understand how the Reddit app knows to open in its anonymous mode when a link is opened from Safari’s Private Browsing mode.
Does Safari explicitly pass any flag or metadata indicating the request originated from Private Browsing?
Or is it inferred by the absence of shared cookies, session tokens, or other stateful data?
If the detection is based on the absence of cookies, could this logic misidentify other stateless scenarios as ‘private’?
I've a apple pay integration on my website. The new sdk, that allows third party browsers.
My integration works well everywhere, except on third party when I read the QR code it results in a "payment incomplete".
I have gone through several threads in apple dev forums, and several guides on implementation steps and troubleshooting. But I'm still without solution.
When Debugging in iOS device I get: "Application failed to provide a valid merchant session. We can't proceed to authorize the transaction."
I've doublechecked, the values I send to create the payment Session are correct, the domain and merchantIds. (It works well with the same implementation on safari, what's the difference here?)
I've also doublechecked the values i'm sending to the completeMerchantValidation, and they are all in the right format and types.
What else can iIcheck?
Styling overlap occurs between the input field style and the generated strong password field in Safari browser. Is there a way to completely override the original input field style with the styling of the filled strong password?
Topic:
Safari & Web
SubTopic:
General
Python version 3.9.1
Selenium version 4.25.0
Safari version 18.1.1
I want to operate Safari using Selenium. For this purpose, I would like to set the UserAgent to iOS and change the viewport. What should I do? The following is the content programmed with the Chrome driver. I would like to achieve this using the Safari driver.
import time,os
import chromedriver_binary
from selenium import webdriver
from selenium.webdriver import Safari
from selenium.webdriver.safari.options import Options as SafariOptions
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.support.select import Select
from selenium.webdriver.chrome import service
# selenium 4
from selenium.webdriver.chrome.service import Service as ChromeService
from selenium.webdriver.chrome.options import Options
from webdriver_manager.chrome import ChromeDriverManager
driver = webdriver.Chrome(service=ChromeService(ChromeDriverManager().install()),options = chrome_options)
# iPhone 13 params
viewport = {
"width": 390,
"height": 844,
"deviceScaleFactor": 3,
"mobile": True
}
#Chrome setting
ua = "Mozilla/5.0 (iPhone; CPU iPhone OS 15_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.4 Mobile/15E148 Safari/604.1"
driver.execute_cdp_cmd("Emulation.setDeviceMetricsOverride", viewport)
# change user agent
driver.execute_cdp_cmd("Emulation.setUserAgentOverride", {"userAgent": ua})
# ページにアクセス
driver.get("https://hogehoge")
I am working on some open source documentation genereator tools which should support pwa on apple.
I want to check whether some private apple meta tags are still supported like apple-touch-icon, I can only found some archived docs:
https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html
I searched for almost an hour but I can not find anything related to safari and it's behavior in the new documentation.
So I want to ask: do I miss anything? or apple is dropping docs for safari?
Topic:
Safari & Web
SubTopic:
General
We are Java application developers and we have a question regarding camera access via WebRTC on iPadOS. Specifically, on iPadOS 17.1, we are encountering an issue when trying to access the camera via the WKWebView API in the Chrome browser, where an error occurs and the camera capture fails. Our investigation suggests that device access through the navigator.mediaDevices property via the WKWebView API may not work in Chrome. However, it works as expected in the Safari browser, leading us to wonder if this is a Chrome-specific limitation, or if it's due to an iPadOS setting or specification.
At this point, we are unsure if this issue is related to the WKWebView and WebRTC specifications on iPadOS 17.1, or if there are specific limitations in Chrome. We would appreciate any insights or solutions regarding camera access in iPadOS 17.1 with WKWebView and WebRTC, especially in relation to Chrome.
I'm having issues with opening up role="link". links in wkwebview. Is there a way in my decideforpolicy to allow these links to open up in the current webview vs another window like a traditional web browser does? Thank you ahead of time.
Apple Pay fails with an "AbortError" when the dialog for the fingerprint sensor opens.
How do I find the cause of the "AbortError" which only occurs in the web integration in our production environment?
In the sandbox environment, Apple Pay works flawlessly. This concerns a web integration of Apple Pay using the Apple Pay SDK, one version before 1.2.0. The error occurs when I call the show() method on the PaymentRequest object. The Apple Pay dialog opens with the fingerprint icon, but after one second, an exclamation mark appears, and the Apple Pay dialog closes again while throwing the "AbortError".
I know that our Apple Pay integration worked for multiple customers in the production environment already. The current problem is that Apple's error message, called "AbortError," provides no indication of the cause. This could be greatly improved.
One affected customer, for example, is the one with the Merchant ID … (Is it safe to post a Merchant ID in this forum?) I can reproduce the "AbortError" issue at any time using my iPhone with iOS 16.7.8.
The extension popups don't seem to support the dark mode media query.
The only way the query gets detected is when a color-scheme is added:
<meta name="color-scheme"content="light dark">
Hi, I'm here to Report a Problem with the IOS 18.3 UPDATE.
So, when i Download a file, any file. The Download Progress has no problems, but when the download complete, Nothing happens it just keeps the blue line of the download, and then I can’t open that file…this only happened to me when i downloaded the IOS 18.3… hope it'll be fixed ASAP.
Bye!
Hello everyone,
in my website I need to give users the ability to choose a color via input type=“color”.
I don't understand why it works fine on desktop (even on Safari for Mac) but doesn't open the color picker on iPhone.
How can I solve this?
Thank you,
Andrea
For many years, I've noticed that although in native code I can handle continuous and simultaneous Apple pencil and touch inputs using UIKit, Safari and WKWebView's PointerEvents only seem to allow you to use one input type at a time. i.e. Apple Pencil down blocks touch input until lifted and touch input blocks Apple Pencil input. It's as though requiresexclusivetouchtype has been set in the underlying webkit implementation. There's decades of research (e.g. https://dl.acm.org/doi/10.1145/1866029.1866036 ) and several existing native applications in production showing that multimodal inputs open-up many unique and useful applications and interactions. Even a simple "hold object with finger" + "draw with stylus" controls are the norm. I recently built a native application using multimodal simultaneous inputs, but this is impossible to port to web due to the unexpected behavior of PointerEvents (and touch events, and mouse events; any variant exhibits the same behavior). I've researched and attempted to apply every possible flag, change, and css code to get this working, but I think the behind-the-scenes implementation is what's blocking the simultaneous touch types.
This is unexpected and undesired behavior because it's inconsistent with the native behavior. If it's unintended, it's a big priority to fix for creating better user experiences on the iPad. If it's intended, I do not believe that's reasonable (even if it might be more complex and used for more advanced applications). Please expose a way to support simultaneous touch types in iPadOS/iOS in both Safari and WKWebView.
At minimum, may we have a discussion on how to support the desired behavior? The simplest solution I can think of is to provide a webkit-platform-specific boolean in Safari and WKWebView called requiresExclusiveTouchType, which is set to False by default to keep the current behavior, and settable to True to get the more flexible behavior I'm expecting.
HI, please can someone help?
I have a web app where push notifications are in place for Chrome, Firefox, and Edge. Providing the user allows notifications then when they log in for the first time their details are registered to the subscriptions table in the backend. All good so far.
When trying to do the same with Safari on Mac I'm faced with this issue:
"Safari doesn’t support invisible push notifications. Present push notifications to the user immediately after your service worker receives them. If you don’t, Safari revokes the push notification permission for your site."
and the user is not registered in the subscription table with the Safari console just saying variations of this:
[Warning] Notification permission denied. (notifications_frontend.js, line 177, x2)
[Log] Enable Notifications button clicked (notifications_frontend.js, line 245)
[Log] Safari Push Notifications detected (notifications_frontend.js, line 248)
[Warning] Safari Push Permission denied. (notifications_frontend.js, line 278)
I've found this on an another forrum:
"Safari requires that you immediately post a notification when a push message is received. "Immediately" means that it cannot be after some async operation.
If you display a notification immediately from the service worker itself, it will stop displaying that error. I cannot remember 100% but I think if you clear your cache and cookies you will be able to receive push messages again if you accidentally get blocked while testing."
and I've tried adding buttons to trigger allowing notifications but it all seem to late to get the subscription registered in the subscription table.
I'm pretty new to coding so if any has a similar experience and can advice how to get the subscriptions registered when the user logs on for the first time in Safari in a Mac it would be greatly appreciated.
Thanks...