When a video in Safari is played in fullscreen mode and the user pauses it, an overlay (such as a play button or other controls) appears. This affects the user experience, as we want to avoid showing the overlay during fullscreen viewing after the video is paused.
Expected Behavior:
The overlay should not appear after the video is paused in fullscreen mode.
Steps to Reproduce:
Open a webpage https://slides-dev.pitchavatar.com/rtxuf in Safari.
Start playing the video.
Enter fullscreen mode.
Pause the video.
The overlay appears after the video is paused.
Screenshot:
Additional Information:
Safari version: Safari 18.0.1 (20619.1.26.31.7)
Environment: macOS Sequoia 15.0.1 (24A348)
We would like to know if there is there any way to prevent the overlay from appearing in Safari when the video is paused in fullscreen mode.
Selecting any option will automatically load the page
Post
Replies
Boosts
Views
Activity
The specification states that the timestamp property is a DOMHighResTimeStamp which always represents a value in milliseconds. However, in my testing (on iOS as I don't have a mac) the timestamp is given as seconds. This could break compatibility if an app/library is not tested in Safari.
Worse is that the deviation seems to be undocumented as every compatibility chart states full compatibility and defines the property as milliseconds.
Any workaround would also be up to one frame incorrect. So a stutter can affect input accuracy.
I know this might seem small but it could mean that an app or game is unplayable in Safari if it relies on this for input.
Starting Safari 18, Declarative Net Request redirections are no longer working (it used to be working on Safari 17). It seems to be related to the regex validation that is not working as expected.
Here is an example of our DNR rule:
{
priority: 1,
action: {
type: 'redirect',
redirect: {
regexSubstitution: `${scheme}//${extensionHost}/index.html\\1#/\\2`,
},
},
condition: {
// app.dashlane.com, *.app.dashlane.com
regexFilter: '^https?://w*\\.?app\\.dashlane\\.com(\\??[^/#]*)[^#]*#?/?(.*)$',
resourceTypes: [
'main_frame'
],
},
}
Is it a known issue ?
Also, it seems to be related to this existing issue:
https://forums.developer.apple.com/forums/thread/763505
Hi,
iOS 18.1 Safari 18 does not play HLS/.m3u8 audio tracks (while all previous iOS Safari still do).
If I turn on the Web Inspector toggle and put it on, restart Safari/ refresh the page, the player works.
Before filing a bug, are you already aware of such behavior or some way to deal with it?
When I want legend inside the filedset, not on the border as default browsers design, I set float: left to the legend. It works in every modern browser - Safari too. The problem is when the filedset itself is set to display: flex. Float propertie of the legend is ignored. In other browsers this approach works fine and the float stays and the legend is inside of the fieldset as we expect.
I have the following setup:
Managed domain (pdfforge.org)
Managed app (Dropbox) with Files app integration.
This can also occur with the following setup:
A custom browser is installed as managed (ex Firefox)
No managed domains
Managed app (Dropbox) with Files app integration.
Trying to upload a file from Dropbox in this managed domain by clicking on the Dropbox folder causes the folder to disappear and instead I am rerouted to the On My Phone directory.
On subsequent tries, sometimes the folder opens and I can see the files, but while scrolling the files disappear.
This makes it unable to upload any files from Dropbox to this managed domain.
If both the managed app and domains are not set up, then everything works normally.
Is this happening to everyone else? I also tried with Nextcloud and Google Drive.
Hello there I have a nested USDZ file I had created a long time ago with some make-up products.
Its behaviour was always the same in the past: nested usdz files allow you to control each object "nested" separately. So I used this as a way to allow people to play around with a "set of objects".
Today I went to try it and since I'm on ios 18 it shows an "assets tab" on the bottom that allows me to see all the assets inside the tab but doesn't allow me to see or anchor them at all!
What changes do I need to do in order for this to work and where can I check documentation on these new behaviours for USDZ files? And what will this allow for in the future?
Thank you in advance
I'm using navigator.geolocation.getCurrentPosition to retrieve the users coordinates in a PWA built with Nextjs. getCurrentPosition is called by clicking on a button. If getCurrentPosition is called afterwards, the cached value is returned. On Safari, If I refresh the page, or logout, login and call getCurrentPosition again, the getCurrentPosition error callback is called with an error code 2 - POSITION_UNAVAILABLE. After around five minutes, getCurrentPosition can be called again.
Is there some kind of throttling restriction on Safari navigator.geolocation.getCurrentPosition?
I have an endpoint that generates a .ics file. From my mobile app, I open the browser (Safari) and retrieve the .ics file. In Safari, the events are displayed as expected, and I can use the "Add All" button to add them to the calendar. After clicking "Add All," I can select the desired calendar, and the events are successfully added (see screenshots 1 and 2 below).
Here’s the initial .ics file response:
BEGIN:VCALENDAR
VERSION:2.0
CALSCALE:GREGORIAN
PRODID:NAME
BEGIN:VEVENT
DTSTAMP:20250101T195917Z
DTSTART:20250102T131600
DTEND:20250102T142500
SUMMARY:My Event 1
UID:unique-uid1
LAST-MODIFIED:20250101T155715Z
DESCRIPTION:Description
SEQUENCE:1
END:VEVENT
BEGIN:VEVENT
DTSTAMP:20250101T195917Z
DTSTART:20250103T131600
DTEND:20250103T135600
SUMMARY:My Event 2
UID:unique-uid2
LAST-MODIFIED:20250101T155715Z
DESCRIPTION:Description
SEQUENCE:1
END:VEVENT
END:VCALENDAR
Later, I updated the .ics file with new event details:
BEGIN:VCALENDAR
VERSION:2.0
CALSCALE:GREGORIAN
PRODID:NAME
BEGIN:VEVENT
DTSTAMP:20250102T195917Z
DTSTART:20250104T131600
DTEND:20250104T142500
SUMMARY:My Event 1 Update
UID:unique-uid1
LAST-MODIFIED:20250104T155715Z
DESCRIPTION:Description
SEQUENCE:2
END:VEVENT
BEGIN:VEVENT
DTSTAMP:20250102T195917Z
DTSTART:20250105T131600
DTEND:20250105T142500
SUMMARY:My Event 2 Update
UID:unique-uid2
LAST-MODIFIED:20250102T155715Z
DESCRIPTION:Description
SEQUENCE:2
END:VEVENT
END:VCALENDAR
I updated everything according to the iCalendar documentation:
UID remained unchanged
SEQUENCE has been updated
DTSTAMP has been updated
LAST-MODIFIED has been updated
However it seems like that Safari can't handle updates on events.
In the preview we can see the changes, but when I click on "Add All" button, nothing happens.
The same behavior is working with other calendars like Outlook (web view) or Google Calendar.
My Questions:
Is there a property missing from my .ics file that is necessary for iOS Safari to handle updates?
Is Safari not designed to handle event updates in this way?
Should I consider moving to a subscription-based solution to manage updates more reliably?
Any insights or suggestions would be greatly appreciated!
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")
Is it a specification that the Service Worker doesn’t work in an internal iframe only when the parent page in a WebView is file://? It works in Mobile Safari under the same conditions, and we couldn’t find any specification that says Service Worker-like behavior doesn’t work with this combination.
Step to reproduce:
We use Vite to develop the application.
For the iframe in Webview,
Install vite-plugin-pwa with version ^0.20.5
Add VitePWA({...}) to plugins[] array in vite.config.ts
Build and preview the app: npm run build && npm run preview.
We open a Webview with file:// and then open the iframe with the URL to which we preview the app (We use ngrok to create the URL).
Then we open Safari and inspect the Webview but inside the Developer > Service workers tab doesn’t have a registered service worker.
For safari, we do the same step 1-3,
We open Safari browser with the URL that we have deployed the app (The same URL we used in the iframe in Webview).
We go inside the Developer > Service workers tab and it has a registered service worker.
Environment:
Simulator: IOS 18.2
Safari: MacOS 15.2
Expectation: Safari and the iframe in Webview should have a registered service worker inside the Developer > Service workers.
Hi there,
I have a problem that , after I add website at dock but unable to turn on the website from dock & pop up message also mention that app was damaged. This problem appears after I factory reset my iMac. Please kindly advise. Thank guys.
Topic:
Safari & Web
SubTopic:
General
Tags:
Safari Developer Tools
Safari Services
Safari
Safari and Web
PWA works perfectly fine in safari browsers in mac but in mobile devices it
is not working it just shows, There is no internet connection. found a fix from ios release - https://developer.apple.com/documentation/safari-release-notes/safari-17_2-release-notes
but actually it is not solving the issue. in my case even it is not throwing the issue -
fix is - Fixed a cache miss bug in DOMCache that triggered service worker fetch errors. (115740959) (FB13188943)
Safari throw a ViewTransition error, called ' Unhandled Promise Rejection: AbortError: Old view transition aborted by new view transition.' however, i don't find how to catch it.
i used 'try..catch' or Promise.catch, or catch it in finished/ready/updateCallbackDone Promise. These all don't work.
When a tab goes to sleep, all its resources gets killed. When the user has any interaction it gets active again. However, if there is an audio in the tab, it does not play again even after user interaction. One has to reload/reopen the tab.
Is this how it should work?
Is there a fix for this?
Hi there,
I use the Clipboard API to create formatted project links with a "copy link" button. This has been really versatile for end users. When they paste into their email, they get a hyperlinked project name that leads to the project, and when they paste into the URL bar, they just get the project URL.
It used to be that pasting into Messages on Mac would yield the same behavior as pasting into the URL bar. But recently, Messages started only pasting the inner text of the HTML clipboard, so no URL, just the project name, which isn’t very useful for a copy link function.
Is there any way to ensure that Messages pastes the URL while maintaining my formatting options on other surfaces?
Hi all,
Chrome has it already - animation-timeline aka scroll-animations.
I can nowhere find any informations on what's the status in Safari/Webkit.
Seems like they do not have it on the agenda at all?
Does anyone know anything - I wanted to push a feature request for that - but also seem there is no feature request list anymore for webkit.
See: https://www.w3.org/TR/scroll-animations/
Cheers and kind regards!
Hi all,
I need to detect if my web application (pure HTML / Javascript) is opened from:
Safari from a Mac
Safari from an iPad but by asking for the desktop version
I tried to check for many properties (including the navigator.useragent) but no difference were visible. Anyone could help me?
Thank you
Hi. I'm a developer of Tab Finder (https://apps.apple.com/us/app/tab-finder/id6741719894)
My problem is that every time i switch from my first window to a second window, the tabs in the validateToolbarItem() are INcorrect on a first call, but when I switch back from the second window to my main window, the tabs are CORRECT even on a first call.
To demonstrate it, i recorded a video: https://youtu.be/RwskzrSJ8u0
To run the same sample extension from the video, you can get the code from this GitHub repo: https://github.com/kopyl/test-tabs-change
Its only purpose is to log URLs of an active page of all tabs.
The SafariExtensionHandler's code of the sample app is very simple:
import SafariServices
func printOpenTabsHost(in window: SFSafariWindow) async {
let tabs = await window.allTabs()
log("Logging tabs for a new window: \(window.hashValue)")
for tab in tabs {
let page = await tab.activePage()
let properties = await page?.properties()
let url = properties?.url
log(url?.absoluteString ?? "No URL")
}
}
class SafariExtensionViewController: SFSafariExtensionViewController {
static let shared = SafariExtensionViewController()
}
class SafariExtensionHandler: SFSafariExtensionHandler {
override func validateToolbarItem(in window: SFSafariWindow, validationHandler: @escaping ((Bool, String) -> Void)) {
Task {
await printOpenTabsHost(in: window)
}
validationHandler(true, "")
}
override func popoverViewController() -> SFSafariExtensionViewController {
return SafariExtensionViewController.shared
}
}
Could you please tell if i'm missing something and how to see the actual tabs inside the overridden validateToolbarItem call of the SafariExtensionHandler (or in any other way, I'm okay with any implementation as long as it works).
Topic:
Safari & Web
SubTopic:
General
Tags:
Extensions
Safari Services
Safari and Web
Safari Extensions
Hi all!
I have been working on a web speech recognition service using the Web Speech API. This service is intended to work on smartphones, primarily Chrome on Android and Safari (or WebKit WebView) on iOS.
In my specific use case, I need to set the properties continuous = true and interimResults = true. However, I have noticed that interimResults = true does not always work as expected in WebKit.
I understand that this setting should provide fast, native, on-device speech recognition with isFinal = false. However, at times, the recognition becomes throttled and slow, yielding isFinal = true and switching to cloud-based recognition.
To confirm whether the recognition is cloud-based, I tested it by disabling the internet connection before starting speech recognition. In some cases, recognition fails entirely, which suggests that requiresOnDeviceRecognition = false is being applied. (Reference: SFSpeechRecognitionRequest.requiresOnDeviceRecognition)
I believe this is not the expected behavior when setting interimResults = true. I have researched the native services used by the Web Speech API on iOS devices, and the following links seem relevant:
• SFSpeechRecognizer
• SFSpeechRecognitionRequest.shouldReportPartialResults
• SFSpeechRecognizer.supportsOnDeviceRecognition
• Recognizing speech in live audio
• Apple Developer Forums Discussion
I found that setRequiresOnDeviceRecognition and setShouldReportPartialResults appear to be set correctly, but apparently, they do not work as expected:
WebKit Source Code