Video.js: Autoplay (muted or unmuted) doesn't work in Chrome with latest video.js

[WillMuijrers]

Description

Using the CDN of the latest video.js version the autoplay doesn't seem do to anything in Chrome. I'm well aware of the limitations of Chrome. Even applying muted does nothing.
When using an old version of video.js (i used 6.4.0) the autplay and muted work as aspected.

Steps to reproduce

// version 7.0.4 -> doesn't work 
// version 6.4.0 -> works fine
<video muted class="video-js" id="player"> 
     <source src=http://techslides.com/demos/sample-videos/small.mp4 type=video/mp4>
</video>

var player = videojs("player");

player.ready(function() {
      player.play();
  });

Error output

When muted is not applied, one would expect a console error from Chrome. This also does not seem to happen.

[gkatsev]

I'm able to autoplay using your example above http://jsbin.com/najayuqoze/edit?html,output
Would you be able to make a reduced test case? Also, what version of chrome? I tested on 66 and currently running 67.0.3396.62

[dszewczyk1]

I also have a problem with autoplay, in a bit different code, as it should start playing just by adding "autoplay" attribute, not by running it manually.

<script src="https://vjs.zencdn.net/7.0.4/video.js"></script> // worksw with 6.7.1 <video class="video-js" data-setup='{ "controls": true, "preload": "auto", "loop": true, "autoplay": true, "muted": true}'> <source src="http://techslides.com/demos/sample-videos/small.mp4" type=video/mp4> </video>

It seems to work in Chrome in 6.7.1 for example, but not with any newer version
http://jsbin.com/ribacaxezu/1/edit?html,output

[Sizzahandz]

Someone have a fix for this?

[gkatsev]

We just merged #5209 which gives a few more tools to get autoplay working. I am able to get autoplay working with latest Video.js but I can also confirm seeing autoplay not working properly in the example that @dszewczyk1 posted.

[richardlnnr]

You can use oncanplay="this.muted=true" on your video tag

<video  muted loop autoplay oncanplay="this.muted=true">
    <source src="your src" type="video/mp4">
    Your browser does not support HTML5 video.
</video>

[mysuf]

I can confirm that too. I can also say that it happend somewhere between v6.7.4(works) and v6.10.0(doesnt work) and probably will be somehow related to cloning video tag and its attributes..

When original video tag has muted attribute its also ommited in new one, except explicit setting in videojs options like {muted: true}. Anyway, it does not autoplay.

Chrome 68 (Ubuntu)

Maybe this commit?

[ksperling]

I'm running into the same issue (Chrome 67.0.3396.99).

I've created a small JSFiddle reproducing the problem: https://jsfiddle.net/karstenlh/96hrzp5w/

manualAutoplay_ seems to be called twice. The first time around tech isn't ready, so it does nothing. The second time it calls play, however changingSrc_ == true so play just sets up the playOnLoadstart_ callback, and doesn't even return a promise. However that callback never gets called as loadstart has already happened.

I'm not really familiar enough with videojs internals to diagnose this further.

[gkatsev]

Anyone able to check latest chrome? I'm no longer able to reproduce this. Seems like this was a browser bug all along.

[gkatsev]

We reverted #4804 because we noticed that it was no longer needed in newer version of chrome and so it was reverted in #5009. We could potentially bring that piece of code back in, though, I'd prefer to leave it out if we can. Also, if it's still an issue with chrome 71, we should probably open a bug with chrome.

[gkatsev]

@afridley made a nice example for us to try out https://jsfiddle.net/afridley/dvLgr1cb/. For me, on macos and chrome 71, all players on that example autoplay properly.

[dszewczyk1]

@gkatsev yes, it seems to work now in Chrome, so this looks like their issue after all...

[mysuf]

yup, its working also in Windows Chrome 71

[gkatsev]

Thanks for confirming!

[gkatsev]

Let us know if you find it broken again, I'll open an issue with chrome if it happens again.

[wobsoriano]

Autoplay sometimes work, mostly not.

Also used this fiddle https://jsfiddle.net/afridley/dvLgr1cb/ and got the same results.

Chrome Version 81.0.4044.138 (Official Build) (64-bit)