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

Universal Link Causing Too Many Redirects
I was wondering if anyone else ran into a similar problem. We have an universal link that leads to out iOS application. If we use the link by itself everything works properly. On to the problem. We run some campaigns that utilise universal links to redirect users to the application directly from the email. The emails are using click tracking, which means that they put the universal link behind another link. So it goes like this: User clicks link in the email User gets redirected to click tracking link User is redirected to the universal link Expected: App opens; Actual: User gets too many redirects error. The weird thing about this issue is that if, after clicking on the link from email app, user chooses to open link in Safari, they get too many redirects. But if they choose Open In Default Browser (which is also safari btw) then it works and opens the app. Any help here will be much appreciated since we tried everything we can think of and this problem still persists.
0
0
321
Jan ’24
Safari Web Extension allow external connection from any website
Hey! We are developing a Safari Web Extension which requires the background script for localhost Web Socket communication (it doesn't work if we try to connect from the injected content script), everything works fine but we need it to be accessible from any URL since we have a SDK that is distributed to the customers and the domain name depends on each of them, is there a way to do this? Or is there any workaround to not have to use browser.runtime.connect or browser.runtime.sendMessage for communication between the injected content script and the background script? We have tried to use <all_urls> but that's not allowed for externally_connectable. Thanks!
1
1
490
Jan ’24
Safari iOS Browser Auto-Navigation Issue During OTP Input
Steps to Reproduce: Open Safari browser on an iOS device. Navigate to a webpage requiring OTP input for authentication. Request OTP and wait for the SMS containing the code. When the SMS is received, Safari browser attempts to read the OTP automatically. The suggested OTP is displayed, and upon selecting it, the browser navigates to the previous screen or page. The navigation triggers the current screen button, preventing the entered OTP from being applied. IOS version: 17.0.3 Expected Behavior: After selecting the suggested OTP, Safari should not automatically navigate to the previous screen/page, and the entered OTP should be successfully applied to the authentication process. Actual Behavior: Safari browser on iOS automatically navigates to the previous screen/page after selecting the suggested OTP, preventing successful entry of the OTP.
0
0
294
Jan ’24
How to receive redirects in Safari extensions
I am developing a safari extension When a redirect occurs on a web page, I want to detect the redirect and obtain all redirect URLs. If there is any way, please let me know Below is what I tried manifest version is 3 1, Use webNabvigation in background.js browser.webNavigation.onBeforeNavigate.addListener(function(details) { console.log("Redirected to:", details.url); }); This works, but I couldn't get the expected URL 2, Use webRequest in background.js This resulted in an error as it was not possible to listen to events in a non-persistent background. This is caused by using manifest version 3.
1
1
725
Jan ’24
Custom UI and gracefully failing the .pkg installation
We have an app that is distributed in our .pkg installer (using pkgbuild and productbuild). Now we need to perform various system checks, eg. minimum macOS version and then continue or abort the installation, based on conditions. When we do that in the pre-install script, it works but the user experience is not what we need. The installation aborts with a generic message. What we want is to show the progress, eg. which checks have failed and why, a link to open the installation log, and to gracefully exit the installation. Is it possible to achieve all this without resorting to writing a custom installation mac app ?
0
1
657
Jan ’24
Link cant be opened inside iframe
Hi, I have a mobile app that uses iframe to show the html content. I noticed that the link cant be opened on the IOS but its works well on android. Here's general example html code: <iframe id="view-html-viewer-iframe" src="about:blank" frameborder="0"> ... <p><a href="https://google.com/" target="_parent">Google</a></p> ... </iframe> Anyone encounter the same issue.? is there any solution for this.? Thanks.
0
1
560
Jan ’24
TCC permissions for Safari App Extensions incorrectly displayed in Security & Privacy preferences
Hi, We provide a Safari App Extension to our customers. It follows the standard Safari Extension App layout - the Extension is inside the App, the App takes care of installing the Extension in Safari. The Extension requires the Input Monitoring and Screen Recording permissions to be granted from the user. At some point during its execution, the Extension runs the code that triggers the TCC permission prompt. When the user goes to Security & Privacy Preferences dialog and clicks on the checkbox next to the Extension entry to grant the permission, the checkbox remains unchecked, however, the permissions are actually granted. This is the issue, and it is confusing for the user. Moreover, if the user decides not to grant the permissions (closes the initial prompt by clicking on the 'Deny' button) s/he will be prompted again when the Extension runs the next time (and every time). The App that contains the Extension does not suffer the same problem. Its entry in Security & Privacy Preferences responds correctly to checking/unchecking the checkbox. Unfortunately, the permissions granted to the app do not apply to the Extension contained within. Querying the main TCC database (/Library/Application Support/com.apple.TCC/TCC.db) shows one kTCCServiceListenEvent entry for the app, identified by its BundleID (permissions granted). For the Extension there are two entries - one identified by the the BundleID (permissions granted) and the other identified by the path to the Extension (permissions not granted). kTCCServiceListenEvent|/Volumes/Common/Sandboxes/Monterey/AppExtPermissons/DerivedData/AppExtPermissons/Build/Products/Debug/AppExtPermissons.app/Contents/PlugIns/AppExtPermissons Extension.appex|1|0 kTCCServiceListenEvent|com.gemalto.AppExtPermissons|0|2 kTCCServiceListenEvent|com.gemalto.AppExtPermissons.Extension|0|2 The system logs show some tccd-related errors when trying to check the checkbox: Console logs when trying to grant permissions We suspect this might be the reason why the checkbox next to the Extension entry under Input Monitoring in Security & Privacy does not respond to clicks. The same problem applies to granting Screen Recording permissions to the Extension. I constructed a minimal example based on the default Safari App Extension project - basically only added code that would trigger the permission granting prompt in the App and the Extension. Can provide a link to a zip if deemed useful. Are we doing something wrong, maybe missing an ID or a plist string somewhere?
0
0
438
Jan ’24
Services Worker in WKWebView
Hi, we have a services worker configured in a web page to work offline. The page is loaded in the WKWebView component and we observe that the services worker is not registering correctly, is this component compatible with the API of the services worker? If so, how would be the correct implementation, if it is not compatible, what alternatives are there? thanks!
2
0
1.2k
Jan ’24
run Javascrip on Safari
Hello, I am experiencing an issue when running a script on Safari, specifically WebKit. Here is a sample HTML code: <!DOCTYPE html> <html lang="en"> <head> <script> function delayedFocus(e) { e.preventDefault(); setTimeout(function() { e.target.focus(); }, 1000); // Adjust the delay time as needed (in milliseconds) } </script> </head> <body> <ul> <li> <input type="text" id="testtext" onmousedown="delayedFocus(event)"> </li> </ul> </body> </html> The logic behind this script is to introduce a 1-second delay when the user clicks on the textbox. After 1 second, the keyboard should appear. Testing on Android mobile devices shows the expected behavior. However, on iPhones, the textbox receives focus, but the keyboard does not appear. This issue has been observed on various iOS versions, with the script working only on iOS 15. If you have any insights or solutions to address this compatibility issue, it would be greatly appreciated. Thank you.
0
0
575
Feb ’24
Using WKWebKit and Safari on visionOS
I have implemented a custom view that shows a page in WKWebKit: import SwiftUI import WebKit struct WebView: UIViewRepresentable { let urlString: String func makeUIView(context: Context) -> WKWebView { let webView = WKWebView() webView.navigationDelegate = context.coordinator return webView } func updateUIView(_ uiView: WKWebView, context: Context) { if let url = URL(string: urlString) { let request = URLRequest(url: url) uiView.load(request) } } func makeCoordinator() -> Coordinator { Coordinator(self) } class Coordinator: NSObject, WKNavigationDelegate { var parent: WebView init(_ parent: WebView) { self.parent = parent } } } It works, but it shows a grey button in the upper left with no icon. If I click on that button, nothing happens. But I can see this error message in the Xcode logs: Trying to convert coordinates between views that are in different UIWindows, which isn't supported. Use convertPoint:fromCoordinateSpace: instead. What is this button, and how can I get rid of it? As a second question: I also tried to spawn Safari in a separate window, using this view: import SafariServices import SwiftUI struct SafariView: UIViewControllerRepresentable { let url: URL func makeUIViewController(context: Context) -> SFSafariViewController { return SFSafariViewController(url: url) } func updateUIViewController(_ uiViewController: SFSafariViewController, context: Context) { // No update logic needed for a simple web view } } This works, but Safari shows up behind the view that is including the Safari view. Instead, I would want Safari to show up in front - or even better: next to my main view (either left or right). Is there a way to do this?
2
0
810
Feb ’24
Strange counting in Safari
First: don’t tell me about webkit-reporting. I just get a 502 from there! Ok, what’s the problem? I made an example telling it all: <html> <head> <style> .ext { display: none; color: cyan; } body { max-inline-size: calc(100vi - 12px); &:not(:has(:target)), &:has(p.dft:target) { #ext { display: none; } #dft { display: block; } } &:has(p.ext:target) { #ext { display: block; } #dft { display: none; } } &.ext li { display: none; } &:has(.ext:target) { & li.ext { display: revert; } } } header > p > a::before { color: orange; content: "click me >>> "; } ul { display: flex; } li { margin: 1ex; list-style-type: none; inline-size: max-content; } .yes li::before { font-size: 70%; color: yellow; background-color: blue; content: "(" counters(total, ":") ")"; } ul.nGrp { display: inline flex; counter-reset: nameIndex; & li::after { display: inline-block; counter-increment: nameIndex; font-size: 75%; color: red; vertical-align: sub; content: "(" counter(nameIndex) ")"; } } header { inline-size: 100%; font-size: 2rem; text-align: center; } article { counter-reset: total; padding: 1ex; margin: 1em; &::after { font-size: 3em; color: purple; content: "— [" counter(total) "] —"; } li { counter-increment: total; } outline: 1ex groove purple; } </style> <title>Strange Safari-Count</title> </head> <body lang="de"> <header> <hgroup><h1>Strange counting without <code>:before</code></h1><p>different from FireFox!</p></hgroup> <p id="dft" class="dft"><a href="#ext">More?</a></p> <p id="ext" class="ext"><a href="#dft">Less!</a></p> <p><code>:before</code> doesn’t inherit parent’s display:none? (same in FireFox)</p> </header> <article> <ul> <li class="dft"><p>A1</p></li> <li><ul class="nGrp"><li class="dft"><p>A1</p></li><li class="dft"><p>A1</p></li></ul></li> <li class="dft"><p>A3</p></li><li class="dft"><p>A4</p></li> <li><ul class="nGrp"><li class="dft"><p>A5</p></li><li class="ext"><p>A5</p></li></ul> </li> <li><ul class="nGrp"><li class="dft"><p>A6</p></li><li class="dft"><p>A6</p></li><li class="dft"><p>A6</p></li></ul></li> </ul> <ul> <li><ul class="nGrp"><li class="ext"><p>B1</p></li><li class="dft"><p>B1</p></li></ul></li> <li class="dft"><p>B2</p></li> <li><ul class="nGrp"><li class="dft"><p>B3</p></li><li class="ext"><p>B3</p></li></ul></li> </ul> </article> <article class="yes"> <ul> <li class="dft"><p>A1</p></li> <li><ul class="nGrp"><li class="dft"><p>A1</p></li><li class="dft"><p>A1</p></li></ul></li> <li class="dft"><p>A3</p></li><li class="dft"><p>A4</p></li> <li><ul class="nGrp"><li class="dft"><p>A5</p></li><li class="ext"><p>A5</p></li></ul> </li> <li><ul class="nGrp"><li class="dft"><p>A6</p></li><li class="dft"><p>A6</p></li><li class="dft"><p>A6</p></li></ul></li> </ul> <ul> <li><ul class="nGrp"><li class="ext"><p>B1</p></li><li class="dft"><p>B1</p></li></ul></li> <li class="dft"><p>B2</p></li> <li><ul class="nGrp"><li class="dft"><p>B3</p></li><li class="ext"><p>B3</p></li></ul></li> </ul> </article> </body> </html> At least have an eye on the total count at the end of the (identical) articles! Before and after clicking the teaser.
4
0
816
Feb ’24
Website Video Element Volume cannot be controlled on non default audio devices
Dear Apple: I have a Website with a HTML Video Element. It is a Videochat. I want to change the speaker device but this currently does not work. I've fixed it locally via .setSinkId(sinkId) already (can be simulated via audioff addon) but ran into a major problem on macOS. The user that changes the desired speaker cannot change the volume via volume keys on macOS. Problem: So I can fully mute my macbook and the website keeps screaming at me! Reason: Just the default device gets muted which is not necessarily what the user selected as Output device for the html video/audio element via .setSinkId(sinkId). Steps to reproduce: Use Firefox (Safari doesn't even support HTMLMediaElement API: setSinkId) Install and activate the addon audioff (you can setSinkId on a different audio output device per website, similar to how I would fix the bug) You need a element that plays sound. I use a hallosophia.com account and created a meeting link and join twice. You can use this Link where anyone can join: https://www.hallosophia.com/waiting-room/724c6fb2-7261-4133-a3e6-66dfd4a0263f/inkognito - speaker doesn't apply so set it to MacBook but will not apply and still be in your AirPod. Have one AirPod in the ear and go to the website with the sound playing element and right click on the page to "Audio output select" via audioff (which you could also do as the website itself via .setSinkId(sinkId)) and change the speaker from AirPod to MacBook. -> As expected you will have the sound on your MacBook speakers but you cannot change the volume via Volume keys. Even if your MacBook is muted the website can "scream at you" I can verify that macOS has the default behaviour of changing just the default speaker volume by installing the non verified app MultiSoundChanger. With this app installed everything works as expected and it changes all audio devices volume at the same time. But it is not even a verified app. So I would say what needs to change is the default behaviour in macOS that it changes the volume of all speakers and not just the default speaker. And that Safari starts to support .setSinkId(sinkId). I use a MacBook Air 2020 on Sonoma 14.2.1 with Firefox 122.0
0
0
316
Feb ’24