react-player
react-player copied to clipboard
Safari progress onProgress non-linear glitch at beginning of clip in autoplay
Current Behavior
When autoplaying on Safari (initializing playing as true), the video glitches a bit at the beginning and the played progress will sometimes go backwards a split second before progressing again. I do not experience this in Chrome.
Tried on both my Mac and iPad. Sometimes there is no issue. My guess is that it's something related to the way Safari loads/buffers the video? I've been able to trigger it from a pause state (initializing playing as false, but it is far less likely)
Expected Behavior
played progress is always linear and increasing
Steps to Reproduce
Likely reproducible in Safari only
- See Codesandbox: https://codesandbox.io/s/react-player-safari-autoplay-glitch-2dknbt
- Observe progress bar - it may jump around a bit at beginning
- Observe console output - it's set to output the
playedprogress in theonProgresscallback. You may see that the numbers do not consistently increase, but rather jump back to a lower number before progressing again.
Environment
- URL attempting to play: https://storage.googleapis.com/gtv-videos-bucket/sample/ForBiggerMeltdowns.mp4
- Browser: Safari 16.3 on macOS, Safari on iPadOS
- Operating system: macOS 11.6,, iPadOS 15.4
- Codesandbox
react-player2.12.0
We are seeing this in chrome also when we try and immediately request to play the video after onReady has fired for the first time.