Why don't Chrome and Firefox fire events when a video begins buffering?

Question

The MediaElement.js library for HTML5 video is the most complete option that I have found, and also the only one I can use on this project.

The problem is that when the videos load poorly over a slow connection, neither the video element or the MediaElement library dispatch an event when the video stops playing and begins to buffer. This is only happening in Chrome and Firefox.

I have added event listeners to the stalled, waiting, and suspended events, and none of them are fired when the video pauses to buffer in Chrome or Firefox.

Any ideas? Any help is greatly appreciated.

Thanks!

Answer 1

If you look at the code for MediaElement.js, you'll notice the stalled and suspended are not set for MediaElement object. Waiting wouldn't work because it's called when the playback is waiting on another operation (e.g. seek)

waiting: Sent when the requested operation (such as playback) is delayed pending the completion of another operation (such as a seek). https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events

This is not tested, but you can try the following

• Set a playing event that will create an interval to check the current time of the video. If the video current time didn't change from last interval, than most likely the video is buffering or not loading.
• Set a pause event to clear the interval.
• You might need to set other events to make sure the event is not triggered by user actions.

Hope this helps.