Video controls visible in iOS low power mode

Safari's video controls could previously be hidden using CSS pseudo-elements like ::-webkit-media-controls-panel and ::-webkit-media-controls-play-button. However, with the introduction of Shadow DOM-based controls implementation, these CSS approaches no longer work due to the isolation created by the shadow DOM, particularly when iOS Low Power Mode is enabled.

Safari/WebKit intentionally shows controls in iOS Low Power Mode to conserve battery: autoplay is disabled and a play button is always shown for videos with the autoplay attribute so users can manually start them. The related bug report (WebKit Bug #219889) was marked as "Won't Fix" as this behavior is by design.

WebKit's implementation uses a User Agent Shadow Root which is closed and inaccessible to JavaScript (videoElement.shadowRoot returns null).

Currently, no reliable workarounds exist to hide these controls, especially when iOS Low Power Mode is enabled. We are actively monitoring this issue and exploring alternative solutions as Safari's implementation evolves.