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

[BUG Report - Smart Banner App] SAP shown only on several Pages (on Apps Installed), even though not configured
So we have an App (on Web & iOS environment), in which we still have not yet set up the Smart App Banner, but the Banner is shown on Safari on several pages. What we have on the project though is a list of Download pages to Play & Google Store in our About page which like the attachment below Here is the SAP being shown on only several pages: On Homepage it's not shown Upon clicking the profile picture and opening a Setting page, the SAP is shown On the Setting page, if we click Workspace, it still shows the SAP But when we are clicking the individual Workspace after that, the SAP is missing Because of this behavior, some of our page layouts are broken, thus we need to find a way to overcome this. To clarify this, we have 2 questions in mind, which is: On https://developer.apple.com/documentation/webkit/promoting_apps_with_smart_app_banners, it's shared that the SAP can only be set via a meta tag. As this bug is appearing on the Web environment, is there any other way to set the SAP rather than with meta, that might be the result of this bug? If we init the SAP via meta tag will it replace the existing SAP completely? If yes, then we can just use the configured meta to fix this. Nevertheless, the help and guidance on this are deeply appreciated. Thanks
0
0
367
Aug ’23
ipad/iphone 16.6 Safari - RTL text bolded when using "-apple-system" font family
I have a font-family set like this: font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Ubuntu, roboto, noto, arial, sans-serif; When checking a html page in Safari on ipad/iphone 16.6. that has a RTL language (e.g. ar-SA) text, it is displayed as bolded although no bolding was applied in the styling. Note: The issue is not present on Safari Mac. This wasn't an issue in 16.1. at least, I was able to reproduce it with ios simulator ipad/iphone 16.4. and a real device ipad/iphone 16.6. Looks like "-apple-system" is causing this, because if i remove it from the font-family then the font looks normal. Has anyone run into something similar?
3
0
307
Aug ’23
installer hangs on Preparing for Installations
Hi team, I am using macOS monterrey and I am having problems with the installation of packages via console, I am using "installer" If I just reboot the PC, I can install only one package and the rest hangs in Prepare for Installation.. After that, any package I try to install stays in the same state: Restarting the PC only allows me to install a single package and then the same problem happens. Any idea what the problem is and how I can fix it?
1
0
950
Aug ’23
Safari splits one Record
Hi, this is my first time to write in Forum. My Problem is that, when I have a video in Safari for Mac recorded, Safari is splitting my record into three blobs. For Example Chrome doesn't. There is one record, one blob. Safari Version: 16.6 (18615.3.12.11.2) Does anyone know why Safari splits one Record/blob into three blobs? Thank you and have a great day.
3
1
605
Aug ’23
Last ditch effort to use Safari
Safari and I have had ups and downs. More so downs anymore. I am currently running Sonoma, I KNOW! It's a beta. However, this has been going on for 3 or 4 years. Speedtest is 477Mbps Up/472Mbps Down with 2ms Ping, 0 Jitter, 0% loss What I have done already, is update DNS on my router and in system preferences. ~Erased Cache, Erased History ~Ran CleanMyMac X to even clean further ~Removed all extensions or Ad-Blockers ~Tried Terminal ⌘ - defaults write com.apple.Safari WebKitDNSPrefetchingEnabled -boolean false (comes back with Could not write domain or existing) *Found there are Safari folders in the Library/Containers folder The issue is that pages are sluggish sometimes the pages don't load. I have to quit and then restart Safari. The Simplest task requires a massive amount of work to get down due to the sluggishness. I would like to disable DNS Prefetching to science if this would help. But I am unsure of the location of this to write it in the terminal. I honestly stick with Safari due to having used it for years and all my passwords and security are run through it. I have Chrome and Firefox but I guess I need to learn how to move things over and leave Safari in the past I am not posting this in the normal forums or on Reddit cause I just don't feel like being trolled or given the answer of well stop using it. I am sure others have dealt with this and I tried googling but I have not found a really solid answer. unless my google search is crap. lol
0
0
269
Sep ’23
Use last used passkey as default
I have two logins for one website, so two different accounts with different email addresses. For both accounts I have stored a passkey for the login. If I now use the passkey for account 1 and login successfully, account 2 is selected for me the next time I would like to log in and I then have manually to select account 1 in order to log in with it again. To me it would make much more sense if the system would always use/suggest the last used account/passkey. My system: macOS Monterey Version 12.6.8 (21G725) Safari Version 16.6 (17615.3.12.11.3, 17615)
1
0
327
Sep ’23
Safari causes VideoJS ERROR MEDIA CODE:4
Hello, when I'm trying to record a video in Safari for Mac and the record ends, Safari doesn't load the video and I get this: ""VIDEOJS: ERROR: (CODE:4 MEDIA_ERR_SRC_NOT_SUPPORTED) No compatible source was found for this media"" I'm using VueJS in the Frontend and Django in the backend. And I can only record in Safari with video/mp4;codecs=avc1. Safari will not allow any other type for the record or the access to the camera or microphone. In Chrome or firefox it records with video/webm;codecs=vp8,opus and can find the source of it and the recorded video plays without issue. I'm using a MacBook Pro M1-Chip and the Safari Version is 16.6 on Mac. Thank you for your help and have a great day.
0
1
790
Sep ’23
How to hide the “Paste” menu on Safari browser when using navigator.clipboard.readText() in the button click handler?
I'm trying to read the clipboard data using the navigator.clipboard.readText() in the button click handler: <body> <h1>How to paste text</h1> <p><button type=button>Paste</button></p><textarea></textarea> <script> const pasteButton = document.querySelector("button"); pasteButton.addEventListener("click", (async () => { try { const e = await navigator.clipboard.readText(); document.querySelector("textarea").value += e; console.log("Text pasted.") } catch (e) { console.log("Failed to read clipboard. Using execCommand instead."); document.querySelector("textarea").focus(); const t = document.execCommand("paste"); console.log("document.execCommand result: ", t) } })); </script> </body> We can use the following link to check the demo page using the above code: https://web.dev/patterns/clipboard/paste-text/demo.html The demo page works fine when clicking the Paste button on the Chrome browser. But, it shows the Paste menu when clicking the Paste button on the Safari browser. Only when clicking the Paste menu on the Safari browser, the clipboard data is pasted into the text box. So, I'd like to know how to hide the "Paste" menu on Safari browser when using navigator.clipboard.readText() in the button click handler. Thanks.
0
0
595
Sep ’23
Safari abosulte position element rending issue on iOS 17 & macOS Sonoma
On Safari of iOS 17 and macOS Sonoma, I am encountering a layout problem where the .content element seems to be covering the .header element, resulting in unexpected rendering. This issue is not consistently reproducible across different devices or browsers. Here's the HTML and CSS structure: demo <html> <head> <meta name="viewport" content="initial-scale=1.0"> <style> .page { position: absolute; height: 100%; width: 100%; overflow: auto; } .container { height: 100%; width: 100%; overflow: auto; } .header { position: absolute; top: 0; background: lightblue; height: 50px; width: 100%; } .content { height: 2000px; background: lightcoral; box-sizing: border-box; } </style> </head> <body> <div class="page"> <div class="container"> <div class="header">header</div> <div class="content">content</div> </div> </div> </body> </html> If remove overflow in .page, or make .content not scrollable, .header shows correct that overlap .content
1
0
1.5k
Sep ’23
iPad Chrome has wrong height
iPad Pro(11-inch), iPadOS version: 16.6.1, Chrome version: 116.0.5845.177 I create a simple html and try to run on iPad. Although I set the height to 100vh, there is a vertical scrollbar on the right, and I could scroll down to a total empty page. It seems like the total height is more than 200vh. The web page works on Safari, but not work in iPad chrome. html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="styles.css"> </head> <body> <div style="background-color: green; height: 100%; width:100%;">This is a div</div> </body> </html> css: body { height: 100vh; min-height: -webkit-fill-available; } html { height: 100vh; height: -webkit-fill-available; }
0
0
650
Sep ’23
iOS 17.0 Webkit 'display:flex' issue
When rendering 2 'div' components with 'display:flex' placed on top of each other, the preceding one sometimes comes up. The 'position:absolute' has been set and the second 'div' component is being generated after the first one. However, when inspecting the iOS webview in Safari, I enable-disable the 'display:flex' property, everything starts working again. This is possibly a bug in the layout engine. I tried the same process in iOS 16.4 and there are no issues at all.
3
0
1.2k
Sep ’23
unlimitedStorage permission does not work for indexedDB for safari extension
I have a Safari extension needs to store more than 10GB data in indexedDB. I added unlimitedStorage permission to my extension, but there's still a limitation about 1.5GB, after write 1.5GB data in indexedDB, all put operation will failed with 'Failed to PutOrAdd in database because not enough space for domai' At this time, storage.local can still write. I'm not sure why, but Firefox and Chrome both can give unlimited storage for the indexedDB, so, please apply the permission also for indexedDB! It's hard to manage a big data by the raw storage.local API.
3
0
533
Sep ’23
Flashing Briefly Within an iframe
Hello! I am someone who creates websites. When I click a link within an iframe, the screen briefly turns white. (This link navigates within the iframe, and the parent frame does not navigate.) I haven't specified any background-color or styling within the iframe, including the body. However, it turns briefly white during the transition, probably due to a rendering issue. This issue doesn't occur on other devices (android). Can this be resolved with CSS, or is it a bug? PC MAC OS / 13.4 (22F66) Safari / 16.5 (18615.2.9.11.4) iPhone IOS / 16.1.1 Safari / unknown
0
0
513
Sep ’23
In <iframe src="***"></iframe>,all request "Referer" in the corresponding page only use the domain name and port number, without parameters
I need to access the corresponding page of. The interface in the page uses "Referer" authentication, but Safari browser seems to have some security policy that filters the parameters, causing our authentication to fail. We tried to modify the "Referrer Policy", but it was also useless. I'm not sure if any friends who have encountered similar problems can help~ Thank you to every passing friend.
0
0
248
Sep ’23
iOS 17(RC) ZWNJ parsing error
Is there anyone who has resolved this issue before? We are using a JavaScript-based chart library and receiving data from the chart as strings. Until iOS 16, the parsing was going smoothly, but it seems that the parsing of the \u{200c} unicode is behaving differently in iOS 17. The yellow boxes in the picture indicate \u{200c} as displayed in VSCode. While all were parsed correctly in iOS 16, allowing for the string to be segmented, it seems that the parsing is not fully functioning in iOS 17, preventing the string from being split.
0
0
243
Sep ’23
custom emoji font rendering error in safari browse and WKWebview iOS 17 RC 1
Hello. Our company's application is experiencing very weird error. We use custom emoji font in our app and web page. But in app browser(WKWebview) and even in Safari browser, custom emoji rendered as blank. I submitted feedback already(FB13089544), but we want to know whether others are experiencing this issue. You can reproduce bug our font test page. [https://toss.im/tossface] Though this page only supports Korean, you can test typing in the middle of page.
0
0
331
Sep ’23
Seeking Assistance with Retrieving Request Body in Safari Extension
Hello, I have developed a Safari extension that intercepts browser requests. I'm utilizing the chromeWebRequest API for this purpose. You can find more information about it here: https://developer.chrome.com/docs/extensions/reference/webRequest/ I have successfully retrieved all the headers for the request. However, I am facing an issue when trying to retrieve the request body, particularly when the content-type of the request is multipart/form-data. I would greatly appreciate any assistance with this matter. Thank you.
0
0
302
Sep ’23