I'm using `@cloudflare/stream-react 1.9.
I'm using
@cloudflare/stream-react 1.9.1 with my own custom controls. I noticed that in Mobile Safari, autoplay is disabled under some circumstances. When I set autoplay={true}, the stream ref starts out with ref.paused === false whereas the video element has video.paused === true. Any ideas how I can tell if the video is actually paused since the paused property is incorrect? Maybe an event can tell me, but it's not clear to me.1 Reply
To close the loop, I ended up listening for the play and pause events to track the expected value of video.paused in my own variable.
When a video loads, it will fire a play event if autoplay succeeded. It will not fire a pause event unless the video has been played before, so it won't fire on load if autoplay is blocked by Safari. So I load the UI with my own variable
isPlaying set to false, then set it to true any time the play event fires. It appears to be reliable to infer video.paused this way.