I am using react-player (I don't think the issue is with the player). I have an application where I play videos in loop (without any sound) and sometimes the video just pauses. It is definitely not the buffer issue, since I am looping like 30 seconds long videos and they have loaded a long time ago by then.The one weird thing is that it only happens with Chrome (tested with Firefox and had no issues).
import ReactPlayer from 'react-player';
<ReactPlayer
onClick={handleTogglePlay}
className="react-player"
loop={true}
url={playerSrc}
playing={isPlaying}
controls={false}
muted={true}
width="100%"
height="100%"
onError={handleError}
/>
I can't post playerSrc here, It is a simple 11 seconds long .mp4 video though. It maybe plays for 20 seconds then pauses. Doesn't throw any errors, just stops. Definitely not like RAM/GPU usage too, checked the stats.
Also, I thought maybe there is issue with just my Chrome browser so I tried these things:
- Reset flags chrome://flags/
- Cleared browser cache
- Tried incognito without any browser extensions
- Tried video.js instead of react-player.
It is absolutely imperative for my application that the videos play and don't just randomly stop. Anyone has any ideas?
Sorry for posting this as an answer but I don't have enough reps to comment. Would this be helpful to you ? https://github.com/cookpete/react-player/issues/1711 This issue has been opened with a workaround suggested.