Safari is the web browser developed by Apple and built into all Apple devices.

Safari Documentation

Posts under Safari tag

397 Posts
Sort by:
Post not yet marked as solved
3 Replies
115 Views
When sending HTTP requests to API's, the header is now capitalized Old (iOS 17.4 and before): "headers": { "origin": "https://example.com" } New (iOS 17.5): "headers": { "Origin": "https://example.com" } Is this a bug or intentional? I couldn't find this change anywhere.
Posted Last updated
.
Post not yet marked as solved
1 Replies
134 Views
Since updating to iOS v17.4.1 our safari extension no longer functions as it used to We are experiencing issues where our content script is not getting initialized, On devices running iOS 17.4.1, the content script included in our extension does not appear to run. There are no logs from the content script in the console, whereas on other versions and devices, it operates as expected. Our Extension relies con communication between the background and content scripts in order for us to render various popups to our users, based on our logs as of iOS 17.4.1 this communication is not successful, we can see messages being sent from the background script but as mentioned above nothing on the content script side. This behavior happens majority of the time and on random sites, sometimes opening the same site in a new tab would work but not always. There are also times where we would only receive our popups after opening the safari menu and interacting with our extension via this menu. Please assist with a way forward
Posted Last updated
.
Post not yet marked as solved
0 Replies
255 Views
While setting up our premium video-on-demand workflow in AWS, using AWS MediaConvert and MediaPackager and licence delivery from drmToday we encountered an issue with HLS+FairPlay playback (only) in Safari on macOS. The issue is that sometimes (more than 50% on the same video) the videoplayer initialization fails (with simple event of type=”error” in onerror callback). We are using Shaka player in our web application, so we first assumed that this (random) issue could be due to Shaka. However, we also tested with direct playback via the player and we observed the same issue, with same frequency. Since we have some content for which this problem does not occur and other content when the problem occurs very frequently, we tried to understand what could explain this difference. We noticed that for assets where the problem never occurs the order of the video submanifest was increasing, whereas for assets where the problem occurs frequently the order is decreasing. To isolate the issue we created a standalone page for a 2-minute asset and we are able to demonstrate that on this asset, when the bitrates are in decreasing order the playback with Safari on macOS fails more than 50% of the time. Test page using tag: KO: https://ntg-test-public-scr.s3.eu-west-1.amazonaws.com/aws-video.html OK: https://ntg-test-public-scr.s3.eu-west-1.amazonaws.com/aws-video.html?ok=1 Test page using Shaka: KO: https://ntg-test-public-scr.s3.eu-west-1.amazonaws.com/aws-shaka.html OK: https://ntg-test-public-scr.s3.eu-west-1.amazonaws.com/aws-shaka.html?ok=1 Notes: the issue is only reproducible with Safari on macOS (not with Safari on iOS) same HLS content + FairPlay plays OK 100% on tvOS the issue is only reproducible for HLS content with FairPlay (OK if no DRM)
Posted
by patatrouf.
Last updated
.
Post not yet marked as solved
0 Replies
98 Views
I'm not sure if I just missed a recent breaking change, but we are having an issue with the camera in our single page app on iOS 17.4.1 in Safari. We can open the camera and display it to the user using getUserMedia. However, if the path of the site changes at all (for example, the user clicks a button to opens a sidepanel which results in the path in the browser changing) the camera goes black, even if the video element is still being displayed. I can see in the browser that the camera has stopped, and the user has to re-enable it manually by tapping "Start Using Camera". Any idea's what could be going on here?
Posted
by jungles13.
Last updated
.
Post not yet marked as solved
0 Replies
97 Views
At my work we are making a React App with Tailwind CSS. ever since the new update, safari has been going dark seemingly randomly across the interface. Has anyone else experienced this or found out what may be causing safari to do this?
Posted Last updated
.
Post not yet marked as solved
2 Replies
180 Views
Hi, I am creating a native application for the Vision Pro. I am looking to integrate a window with WebXR content that can open an immersive space. I am able to do this from Safari and using a SFSafariViewController, however, I would like to use WKWebView inside my native application to do something similar (as this does not open an additional Safari window before allowing WebXR content). It seems in this current version, the WKWebView does not support WebXR? Is this true or is there any additional preferences that I need to add to enable this in this component.
Posted Last updated
.
Post not yet marked as solved
0 Replies
84 Views
How can I download safari-technology-preview-171? This would be the one compatible with machines running MacOS Monterey. If anyone has the dmg for this release it would be greatly appreciated.
Posted
by ElliottQ.
Last updated
.
Post not yet marked as solved
10 Replies
243 Views
In iOS version 17.4 and above, we have observed that the following code works fine upon the initial opening. However, after minimizing the page and reopening it, there is a chance of encountering issues with abnormal lines. Please note the reproduction conditions: try minimizing the page, opening other apps, and then reopening it multiple times. The code is in the comments section. first time: After minimizing and reopening...
Posted
by meloseven.
Last updated
.
Post not yet marked as solved
0 Replies
132 Views
My Safari Web Extension app for iOS sometimes exhibits an issue where the request to SafariWebExtensionHandler sometimes doesn't return. This never happens on the simulator, and never happens when I'm actively debugging the SafariWebExtensionHandler process. It only happens on a physical device, and it only happens about 5% of the time. Note that the request happens RIGHT when the page loads (document_start), so I wonder if there's some kind of race condition happening, or a bug in iOS. No errors are thrown, and I've pared back the logic to be extremely simple, and I still see the issue persist. I'm PRETTY sure it's the SafariWebExtensionHandler because I've tested bypassing it completely (returning a dummy response from background.js), and when I do, the issue never happens. I've seen this issue posted before:, but without a resolution. SafariWebExtensionHandler.m?: - (void)beginRequestWithExtensionContext:(NSExtensionContext *)context { NSExtensionItem *response = [[NSExtensionItem alloc] init]; response.userInfo = @{ SFExtensionMessageKey: @{ @"op2": @(YES), @"op3": @(YES), @"op4": @(YES), @"op5": @(YES), @"op6":@(YES), @"op1": @(NO) } }; [context completeRequestReturningItems:@[ response ] completionHandler:nil]; } background.js (removed proprietary logic so excuse syntax errors): browser.runtime.onMessage.addListener((request, sender, sendResponse) => { console.log("Received request: ", request); if (request.action === "getUserSettings") { var payload = JSON.stringify({cmd: "getUserSettings"}); sendMessageToNative(payload, async function(response) { sendResponse(response); }); return true; } return true; }); content.js browser.runtime.sendMessage({ action: "getUserSettings" }).then((response) => { ... }); I've worked around this by waiting for a few seconds and then resending the request if I never got a response (and this workaround works!), but this results in a bad UX. So, does anyone have any tips, pointers, etc?
Posted Last updated
.
Post not yet marked as solved
2 Replies
283 Views
I am developing a web application that works on webview. From iOS 13, users could set a specific language for each individual app, and every webview-based application knew the application language through navigator.language. However, in iOS 17.4, this API returns the system language instead of the individual app's language in web applications. Is this an official change in iOS 17.4 or a bug?
Posted
by Hyuncheol.
Last updated
.
Post not yet marked as solved
0 Replies
143 Views
Hello, While developing an extension for Safari using Manifest V3, I encountered an issue where my service worker stops functioning; it simply disappears, and I'm unable to revive it in any way. I've attempted to send messages from popup.js and content.js, and even tried setting an alarm with a 20-second interval. However, the worker remains unresponsive until the browser or the extension is reloaded. The logic of my extension operates through background.js (worker). What steps should I take to restore the functionality of the worker? Thank you for your assistance.
Posted
by Andry-001.
Last updated
.
Post not yet marked as solved
0 Replies
174 Views
Good evening, I am having problems with my WebRTC application when an iPhone or Macbook is connected. This only happens when an iPhone or Macbook is connected, as tests with Windows or Android devices have shown no issues. As can be seen in the screenshot below, it appears that the datachannel is not initialised correctly. In fact, the webcam and microphone do not work even if permissions are given by the user, and messages and the remote webcam are not sent/shown. If I open chrome console on Windows, this is the error I get in the console Could you please help me investigate this problem. If you want, you can have full access to my application at https://www.fourmeet.it. I attach the functions that seem to be responsible for the problems: const configuration = { iceServers: [...turnServers, { urls: 'stun:stun.1und1.de:3478'}], iceTransportPolicy: 'relay' }; peerConection = new RTCPeerConnection(configuration); dataChannel = peerConection.createDataChannel("chat"); peerConection.ondatachannel = (event) => { const dataChannel = event.channel; dataChannel.onopen = () => { console.log("peer connection is ready to receive data channel messages"); }; dataChannel.onmessage = (event) => { console.log("message came from data channel"); const message = JSON.parse(event.data); ui.appendMessage(message); }; }; peerConection.onicecandidate = (event) => { console.log("geeting ice candidates from stun server"); if (event.candidate) { // send our ice candidates to other peer wss.sendDataUsingWebRTCSignaling({ connectedUserSocketId: connectedUserDetails.socketId, type: constants.webRTCSignaling.ICE_CANDIDATE, candidate: event.candidate, }); } }; peerConection.onconnectionstatechange = (event) => { if (peerConection.connectionState === "connected") { console.log("succesfully connected with other peer"); } }; const stringifiedMessage = JSON.stringify(message); if (dataChannel && dataChannel.readyState === 'open') { dataChannel.send(stringifiedMessage); } else { console.log('canale non aperto'); } };
Posted Last updated
.
Post not yet marked as solved
0 Replies
133 Views
Hello, I am currently developing an Angular application. In the application, there are labels containing "Name" above some input fields. If these inputs contain a "Name" label; (I should mention here that this problem is observed not only in the label tag, but also in the span and p tags) I think it suggests the names of the people in the contacts in the input field. If you open up that link in Safari, you can try that behavior. https://stackblitz.com/edit/stackblitz-starters-lvykt2?file=index.html
Posted
by wS2Zth.
Last updated
.
Post not yet marked as solved
0 Replies
134 Views
I have a web site that uses CSS linear-gradient with color-mix for a background of a division. It shows up just fine in Safari on iOS and iPadOS 17.4.1. When do a screenshot, and select "Full Page", the background-image becomes all black and the text in the division is unreadable. Here is an example of what I am doing. div.ugly { background-image: linear-gradient(to right, yellow, color-mix(in srgb, red, blue)); } Any ideas how to get this to not turn black? I've tried using a print media query but the "Full Page" screenshot does not use that. It looks like it might be a bug in iOS/iPadOS. Thanks, Mike
Posted
by MikeyMc.
Last updated
.
Post not yet marked as solved
0 Replies
117 Views
Hi! I've faced with a problem while using input navigation arrows. When I focus the last field and then click on the down arrow - it takes me to the first field in the beginning of the screen
Posted
by babidze.
Last updated
.
Post not yet marked as solved
1 Replies
211 Views
Safari is allowing users to create multiple passkeys despite setting the excludeCredentials in PublicKeyCredentialCreationOptions (https://developer.mozilla.org/en-US/docs/Web/API/CredentialsContainer/create#excludecredentials). I also included appidExclude(https://developer.mozilla.org/en-US/docs/Web/API/Web_Authentication_API/WebAuthn_extensions#appidexclude) but it was still allowing me to create multiple passkeys on the same iCloud account. This does not happen in other browsers. Can anyone point me to any documentation regarding this? Much appreciated https://developer.mozilla.org/en-US/docs/Web/API/Web_Authentication_API/WebAuthn_extensions#appidexclude https://developer.mozilla.org/en-US/docs/Web/API/CredentialsContainer/create#excludecredentials
Posted
by ebdev2024.
Last updated
.
Post not yet marked as solved
0 Replies
161 Views
I have a page that needs to display a large PNG image (1024 x 100247 ) Everything works fine in Chrome and Edge, but failed in safari. this is test image : https://storage-staging.passton.jp/images/2024/03/11/E0R6G8FKd3B3iLPO.png is there any limit in safari ?
Posted Last updated
.
Post not yet marked as solved
0 Replies
197 Views
<div class="container" style="background-size: contain; user-select: none; pointer-events: none; height: 787.5px; width: 1400px;"> <div class="container__header">header</div> <span> <div class="video-container" style="inset: 17.853% 68% 11.747% 1%; z-index: 2; opacity: 1;"> <div class="video-container__placeholder-image">image</div> <div class="video-container__content"> <div class="some-info"></div> <div class="video-canvas"></div> <div class="other-info"></div> </div> </div> <div class="video-container" style="inset: 17.853% 1% 11.747% 33%; z-index: 1; opacity: 1;"> <div class="video-container__placeholder-image">image</div> <div class="video-container__content"> <div class="video-canvas"> <div class="player" style="width: 100%; height: 100%; position: relative; overflow: hidden; background-color: black;"> <video playsinline="" muted="" style="object-fit: cover; width: 100%; height: 100%; position: absolute; left: 0px; top: 0px;"></video> </div> </div> </div> </div> </span> </div> The page looks like Then, the html changed as follows, <div class="container" style="background-size: contain; user-select: none; pointer-events: none; height: 787.5px; width: 1400px;"> <div class="container__header">header</div> <span> <div class="video-container" style="inset: 100% 100% 0% 0%; z-index: 2; opacity: 0;"> <div class="video-container__placeholder-image">image</div> <div class="video-container__content"> <div class="some-info"></div> <div class="video-canvas"></div> <div class="other-info"></div> </div> </div> <div class="video-container" style="style="inset: 6.106% 5.98719% 0%; z-index: 3; opacity: 1;""> <div class="video-container__placeholder-image">image</div> <div class="video-container__content"> <div class="video-canvas"> <div class="player" style="width: 100%; height: 100%; position: relative; overflow: hidden; background-color: black;"> <video playsinline="" muted="" style="object-fit: cover; width: 100%; height: 100%; position: absolute; left: 0px; top: 0px;"></video> </div> </div> </div> </div> </span> </div> From the mac developer tools, the width of the video is 1400px, but it render like the size is same as before in iOS17+(iOS17.1 and iOS17.3.1). The expected results looks like the actual results are looks like I tried the same operators in iOS 14.6 and 16.4 and it worked as expected, this problem likes only exists in iOS17+. Please help me to resolve this problom. Thanks.
Posted
by zcl.
Last updated
.