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

All subtopics

Post

Replies

Boosts

Views

Activity

Mobile safari uri scheme not working intermittently
I am working Web to App flow for my product. Tolink to my app from web service, I define uri scheme from app and use it from my web site. But, when I try to use this scheme from mobile safari web, It sometimes failed with message that uri is invalid. That is weird It failed SOMETIMES not always Even I tried with same url. In my device, there is current version app. Why this happen? How can I resolve this issue?
0
1
179
Oct ’24
applePayCapabilities showing same result with/without apple Pay wallet and card
Hi, I was implementing Apple pay button by checking active wallet and at least one cards active. I am using applePayCapabilities as per DOCS but i am still getting the same type of response with apple pay wallet enabled and without apple pay wallet enabled on different devices as Loading the Apple Pay SDK: script.src = "https://applepay.cdn-apple.com/jsapi/1.latest/apple-pay-sdk.js"; script.crossOrigin = "anonymous"; document.head.appendChild(script); script.onload = function() { console.log("Apple Pay SDK loaded successfully"); // Initialize Apple Pay or perform actions that require the SDK here }; script.onerror = function() { console.error("Error loading Apple Pay SDK"); }; Calling applePayCapabilities method: window.ApplePaySession.applePayCapabilities("merchant.com.example").then(r => console.log(r)) Output: {paymentCredentialStatus: "paymentCredentialsAvailable"} Image attachments of applePayCapabilities: Devices Config Used:- Chip - Apple M3 Pro macOs - Sequoia 15.0.1 memory - 36 GB Safari Version - 18.0.1
0
0
197
Oct ’24
WKWebView JavaScript "goes to sleep" when application is in the background
We have an ObjC-based Mac App utility. A fair fraction of the functionality is built in JavaScript and resides in a couple of WKWebViews so that we can more easily share code with other platforms. Because it is a utility, usually the application will be hidden or at least not the frontmost application. But if the user hits a hotkey or provides certain other inputs, the app should respond immediately with a series of actions. In the Obj-C part of the code, we can do this to alert the system that our non-visible, non-active, application is doing something in response to the user input: [[NSProcessInfo processInfo] beginActivityWithOptions: NSActivityUserInitiatedAllowingIdleSystemSleep reason: @"Do the Thing"] To get the JavaScript to do the work needed, we call evaluateJavaScript:completionHandler: on one of the WKWebViews. The JavaScript performs a series of computations, then uses window.webkit.messageHandlers.xxxx.postMessage to return results to the ObjectiveC code, which then takes action based on various SDKs, and the user sees the result. The problem we are encountering is relatively infrequent, but it appears that macOS puts the 'Web Content' process (which every WKWebView has) to sleep, and sometimes delays of many seconds (sometimes over 15 seconds) occur between the evaluateJavaScript:completionHandler: call and the postMessage response. These observed delays are not related to complexity of the JavaScript computations or the amount of data being processed. Using the Console, we can see that evaluateJavaScript:completionHandler: seems to result in this message: 0x104682280 - [PID=0, throttler=0x1046e8498] ProcessThrottler::Activity::Activity: Starting background activity / 'WebPageProxy::runJavaScriptInMainFrameScriptWorld' Then shortly afterward: 0x104682280 - [PID=0, throttler=0x1046e8498] ProcessThrottler::Activity::invalidate: Ending background activity / 'WebPageProxy::runJavaScriptInMainFrameScriptWorld' So it seems that evaluateJavaScript:completionHandler: "wakes up" the WKWebView similar to the beginActivityWithOptions:. But many parts of our computation do some work, then expect the next "tick" in JavaScript to continue using the partial result to produce more work. I suspect that the delays are related to the WKWebView being put "back to sleep" before all the "next tick" code executes. Because these actions are taken in response to user invocation, delays of more than a fraction of a second are instantly noticeable and result in user dismay. Are there any configuration settings that can prevent the 'Web Content' process from going to sleep? Or (better) techniques or mechanisms that would force the process to "stay awake longer"? (Keeping in mind that the WKWebView is likely not visible, and/or the containing window may be hidden.)
1
1
1.3k
Jan ’21
Inquiry regarding /Library/Preferences/com.apple.networkd.plist
I have a question. In the file located at /Library/Preferences/com.apple.networkd.plist, if the dict entry for enable_unified_http is set to true or if the value is missing, there is an issue where the video player does not run on MacOS Sequoia Safari 18.0. I found that setting it to false allows it to function properly. Could you explain what this setting does and whether it is possible to change this setting to false within the app?
0
0
155
Oct ’24
applePayCapabilities undefined on `window.ApplePaySession`
Good day, I'm attempting to check whether Apple Pay is available using the ApplePay JS API. Prior to upgrading to Safari 18.0+, I was using window.ApplePaySession.canMakePayments to show/hide the Apple Pay option. I've noticed with the new Safari version, the preferred method of checking the availability of Apple Pay is by using the applePayCapabilities method. When logging and inspecting the window object in Safari 18.0.1, this method seems to be missing from the ApplePaySession object. Additionally, my conditional code which is dependent on applePayCapabilities does not execute: if (typeof window !== 'undefined' && window.ApplePaySession) { // Safari version 17 and lower if (window.ApplePaySession.canMakePayments) { // set Apple Pay available } /** * On Safari version 18 and higher, we must check whether a user has a card saved in their wallet. * If this is the case, Apple Pay must be presented as the primary payment method. In our case, * this means selecting Apple Pay as the default payment method. */ if (window.ApplePaySession.applePayCapabilities) { const merchantIdentifier = '***'; const promise = window.ApplePaySession.applePayCapabilities( merchantIdentifier ); promise.then(capabilities => { switch (capabilities.paymentCredentialStatus) { case ApplePayCapabilities.CREDENTIALS_AVAILABLE: // set Apple Pay as available and default break; case ApplePayCapabilities.UNSUPPORTED: // not available break; default: // set Apple Pay as available only } }); } } I feel I'm missing something very simple here, help would be greatly appreciated!
2
1
302
Oct ’24
Text-shadow + column-count adds unexpected whitespace at beginning of second column
Howdy! On Safari, when using the column-count CSS property to split text into multiple columns, I've noticed that when applying a text-shadow, there is an unexpected whitespace created above all subsequent columns. I've put together a codepen demonstrating the issue and its reproducibility on Safari (using latest as of this posting: Version 17.6 (19618.3.11.11.5)) Codepen: https://codepen.io/cubepresser/pen/ExqvzjL Expected behavior: Actual: I tested this on the latest versions of Chrome, Firefox and Edge. This bug does not occur. Expected behavior is that there should not be an extra line added to the beginning of the second column, third column, etc. Here's some code if that codepen link doesn't work: HTML: <p id="example">0000000000111111111122222222223333333333</p> CSS: #example { font-family: monospace; max-width: 20ch; column-count: 2; column-gap: 0; word-break: break-all; line-break: anywhere; text-shadow: 0 0 4px black; }
1
0
254
Oct ’24
Safari extension - badgeText and title set for a tab
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" ] }
3
0
289
Sep ’24
Issues with Displaying Language Tags Compliant with RFC 5646
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,
5
0
656
Aug ’24
Links in web apps in Safari 18.0 always open in the web app itself
This is problematic when opening links to other websites that require separate authentication. A typical example would be a Gmail web app, and then trying to open a link to a GitHub PR. In the 18.0 release notes, this is mentioned as Added support for opening links directly in web apps on macOS. (113034778 It'd be great if this could be customizable so that one could choose the old behavior.
0
1
218
Oct ’24
WKWebView: Fullscreen API very unreliable on iPadOS 18.x
Since iPadOS 18.x WKWebView seems to have a bug within its Fullscreen API (which can be enabled via WKPreferences.isElementFullscreenEnabled). This bug has the effect that websites trying to make an element (for example a video player) fullscreen fail to do so. This does not always happen, most of the time the fullscreen mode does work fine, but sometimes (far too often to be ignored) it does not. If an instance of WKWebView shows this issue, it can not be "fixed" by reloading the page or loading other pages, this issue exists in this instance forever. My App is a web browser App so I can create and remove WKWebView instance easily (by opening or closing Tabs). And there are times where I never see this bug, and times where ever other tab shows this bug. It's totally unreliable. The App does not show any issues at all when running under iPadOS 17 or older. The issue is only present under iPadOS 18.x. After some testing I've found out that when the bug has affected an instance of WKWebView, the JavaScript call element.requestFullscreen() will work if the element is a video element, but does no longer work if it is another element (like a DIV). If an instance of WKWebView is not affected by this bug, element.requestFullscreen() will work for all HTML elements. Does anyone has experienced this bug as well? And maybe found a workaround? Or maybe found a pattern which helps to find out what exactly is triggering this bug?
1
0
239
Oct ’24
Determining If a User's Device is capable of supporting an Apple Wallet Pass
We are developing an Add To Wallet flow on our website where we add the "Add To Wallet" button to a user portal for them to be able to add a loyalty card pass to their Apple Wallet. In other projects with Apple Pay, we can check whether or not the browser supports the JS library by checking if it exists on the global window property (if (window.ApplePaySession) { //do stuff } Is there an equivalent to determine if the user's device is capable of accepting a Wallet pass?
0
0
154
Oct ’24
The behavior has changed when specifying an xlsx file in the src of iframe in my PWA app.
The behavior has changed when specifying an xlsx file in the src of iframe in my PWA app. On iPadOS 17.3:Content of xlsx file shown in iframe On iPadOS 17.5.1:A screen appears on top of the original screen to select an app to open the xlsx file. I would like to restore the original behavior, but how can I do that? In addition, if i open and operate the same URL as the one opened in the PWA app in Safari on iPadOS 17.5.1, "download test.xlsx dialog" is open and the dialog has view or download buttons. If the behavior has changed to same to safari on iPadOS17.5.1, it is good for me.
0
0
153
Oct ’24
Safari Deceptive Warning on My Simple HTML Website
When I access my website through Safari, I see Deceptive Warning. My website has only html with no styles, just text and my contacts leading to github-like services. I also have an SSL certificate. At the same time, going through online ios emulators, there is no warning, I checked through different versions of ios. I sent many requests to websitereview, but personally I get such a warning.
0
0
142
Oct ’24
WKWebView process did become unresponsive in iOS 17
Recently, we ran into a bit of a problem when using WKWebView. Sometimes, problems with all pages blank occur which use WKWebView. I implemented WKNavigationDelegate and found that it stops at - (void)webView:(WKWebView *)theWebView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler and it won't call below func forever - (void)webView:(WKWebView*)theWebView didStartProvisionalNavigation:(WKNavigation*)navigation I suspected that the render process is terminated and it won't restart. Then i try to resolve this problem by call reload func [self.webView reload]; But it didn't work. In The Meanwhile, i got some error message in console I have tested it in iOS 16 and 17. only iOS 17 got the issue. Pray for some help. Thanks a lot.
1
0
312
Oct ’24
Safari Content Blocker - cannot set bundle name in Safari Extensions list
Hello, I can't figure out how to set the name of a Content Blocker in the Safari extensions list. So far, the Content Blocker name in this list is the Contaning application name. I tried to set the bundle name in Info.plist and tried to locate Info.plist, without success... Since I also bundle a Safari ("chrome") extension, I have two extensions in the list, and it would be fine to display a specific name for each to make it clear for the user.
3
0
276
Oct ’24
Splitscreen bug with MacOS Sequoia (updated to 15.0.1)
I've been having this problem ever since updating my Mac (2024 M3 Macbook Air) to Sequoia where splitscreen basically doesn't work. By "splitscreen," I'm referring to when I hover over the green button in the top left of my browser, go to "full screen", and choose two browsers to see simultaneously. What's happening is that the screens will split, then whichever browser's green button I used will have the tabs stuck in full screen formation. Say I have 5 tabs open on a Chrome browser and I split the screen with finder using the green button on the Chrome browser. The 2 right-most tabs on Chrome will be cut off into oblivion, and only the first 3 will be visible, but if I try to click them, they don't go to the right place. Clicking in the general location of where the 5 tabs SHOULD be in the minimized screen does yield the change of tab, but I can't actually SEE the tabs in their minimized form. I've attached a screenshot because I know it's probably hard to understand what I'm saying. This also doesn't occur 100% of the time, only like 95% of the time. Lol.
8
7
437
Oct ’24
Apple Pay ios 18 Scannable Code returns Service Unavailable
I have a working Apple Pay transaction page that works on Safari. But with the new ios 18 update and Apple Pay JS library. I see that a pop up sheet with the scannable code is shown on chrome browser. I tried that. Upon scanning the code with iPhone 15 pro max. The apple pay payment sheet is shown on the phone but with an error Service Unavailable. What do I have to do to make it work? What went wrong? I checked the logs and have no clue of what is failing.
2
3
508
Sep ’24
Device orientation / motion permission activation
We have a web-based viewer which makes use of device orientation. The permission box only appears on a “touch” and not on a swipe or pinch. Is this normal? We’ve already tried different listeners: start, end etc but it’s still only initiated the permission request upon a physical touch / tap on screen. Any ideas / suggestions would be gratefully received. Many thanks in advance.
0
0
220
Oct ’24
webp images cause Safari to not work properly
Hello, during the development of my website, I discovered that when there are numerous or large WebP images on the screen, the screen keeps flickering, accompanied by the phenomenon of mobile phone heating. The page returns to normal after converting to PNG. It seems that the issue is caused by the update of IOS 18. Could you please assist me in taking a look? PNG (it works) https://static.xdbbtswu.com/bbt_of/assets/test/good/#/ WebP (it doesn't work) https://static.xdbbtswu.com/bbt_of/assets/test/nogood/#/
0
0
190
Oct ’24
Apple Psy Button
I have enabled apple pay in my website.. After paying it collect my card details in popup and not showing to proceed the payment.. ![] [Image Edited by Moderator to Remove Personal Information]
0
0
122
Oct ’24