How to tell if a <video> element is currently playing?

html5-video, javascript

Solution

There is not a specific attribute that will reveal whether a `MediaElement` is currently playing. However, you can deduce this from the state of the other attributes. If:

- `currentTime` is greater than zero, and

- `paused` is false, and

- `ended` is false

then the element is currently playing.

You may also need to check `readyState` to see if the media stopped due to errors. Maybe something like that:

const isVideoPlaying = video => !!(video.currentTime > 0 && !video.paused && !video.ended && video.readyState > 2);

Problem

I see that the MediaElement interface exposes attributes like `paused`, `seeking`, and `ended`. Missing from the list, however, is `playing`. I know there are `playing` events that fire when an element starts playing, and `timeupdate` events events periodically while playing, but I'm looking for a way to determine whether a video is playing right now. Is there an easy way to determine this? The closest I've got is: ``` !(video.paused || video.ended || video.seeking || video.readyState < video.HAVE_FUTURE_DATA) ```

Original source

Related problems