HTML5 Video Playback: implementing Autoplay and Muted Attributes in Safari
I'm building a feature where I've encountered a strange issue with I'm working with an scenario with HTML5 video playback specifically in Safari where the video doesn't autoplay as expected... I've set the `autoplay` and `muted` attributes on my video element, but it still requires user interaction to start playing. Here's the code snippet I'm using: ```html <video id="myVideo" autoplay muted> <source src="video.mp4" type="video/mp4"> Your browser does not support the video tag. </video> ``` This seems to work fine in Chrome and Firefox, but on Safari (both desktop and mobile), the video does not start unless I click it first. I've double-checked that the video file is compatible and that I'm not running into any CSP issues since I'm serving it from a CDN. I also tried specifying `playsinline` and setting the `controls` attribute to see if that would help, but it didn't make a difference. According to the latest Safari development guidelines, autoplay should work if the video is muted, so I'm puzzled why this is happening. Is there something I might be missing or a known workaround for this behavior? Additionally, I'm testing this on Safari 15.0 and have verified that my HTML is valid with no errors in the console. Any insights would be appreciated! I'm coming from a different tech stack and learning Html. Any ideas what could be causing this? Any pointers in the right direction?