When trying to stream.play()
on Safari 13.0.5 on OSX (and safari on iOS as well) the video will not start playing. The UI switches from the central play triangle, to show the progress bar, but the video does not play.
The stream.play()
promise is throwing an error with an undefined value.
Here is the code to recreate. 3 seconds after page load, the video should start playing and the background will turn red. https://jsbin.com/nukozeriqe/edit?html,css,js,console,output
This works fine on Chrome.
<stream src="5d5bc37ffcf54c9b82e996823bffbb81" preload height="240px" width="480px" controls></stream>
<script data-cfasync="false" defer type="text/javascript" src="https://embed.cloudflarestream.com/embed/r4xu.fla9.latest.js?video=5d5bc37ffcf54c9b82e996823bffbb81"></script>
const stream = document.querySelector("stream")
setTimeout(() => {
document.querySelector("body").style.background = "red";
stream.play().catch(err => console.log(err))
}, 3000)