react-player
react-player copied to clipboard
Fire an error when a media that is ready is not playing after X seconds
About medias that cannot be played (because they have a wrong video ID, or are geoblocked, ...),
Current Behavior
It seems that some players do fire an error when they cannot play the media (eg. Soundcloud) while others don't (eg. Youtube, as already mentionned here) : so ReactPlayer is not consistent about this; and that makes it difficult to use is some circumstances.
Expected Behavior
- If ReactPlayer is
playing={true}
; - a timeout should be set when the media is ready;
- and cleared when the media starts (or the URL changes)
- If the timeout ends, it would fire an error.
Would this be possible please ? Thanks for the amazing work !
I would like to help but I only learned React using hooks. Any advises to start this out ?
Maybe some recent contributors could help ? @imjihun @romain-daversa @korywka @komachi @Yasamato ?
Hello @cookpete, is it possible to get some help / tips to make this happen ? Thanks !
@gordielachance This should start you off:
https://codesandbox.io/s/lucid-currying-cf80ee?file=/src/App.js
I'm not even sure this needs to be added to ReactPlayer considering how simple it is just to implement it in the same place you are using ReactPlayer
.
Thanks, I will test that !
I'm not even sure this needs to be added to ReactPlayer considering how simple it is just to implement it in the same place you are using ReactPlayer.
I think it should. A player that does not play should fire an error. Since it does not play :)
If you use ReactPlayer to play a single URLs, that is maybe not a problem.
But if, for me, you use it for playlists, it makes things very complicated.
I think it should. A player that does not play should fire an error. Since it does not play :)
Keep in mind that onError
is literally just a proxy for the error callback of whatever library is being used to play the url
. If we added it as a native ReactPlayer error we open doors such as:
- How do we distinguish between a native ReactPlayer error and an error from a library?
- Who decides what the timeout is? What if it’s too long/short?
- Should the error still fire if the video isn’t played because of browser autoplay restrictions? How can we know that?
- etc
But if, for me, you use it for playlists, it makes things very complicated.
Maybe a good feature to add to react-playlister
then? 😉
Hi @cookpete, thanks for your reply! I understand this is an "editorial" decision to take, and that you might decide not to implement it.
I'll try to make some tests based on the code you linked, but last time I made an attempt, I faced problems due to player events not firing in the same order.
Who decides what the timeout is? What if it’s too long/short?
Developer decides. Maybe the feature would be disabled (by default); if a timeout delay is not set.
Should the error still fire if the video isn’t played because of browser autoplay restrictions? How can we know that?
No: in that case, the media is playable - it's just blocked "locally" by the browser. Also, there is a library available here to detect browser autoplay restrictions.