Chrome 64 update - muted tag no longer works in <video>

Question

https://jsfiddle.net/kaldenfi/rpmk93wm/3/

<div ng-app="myApp" ng-controller="testCtrl"> <section ng-if="url"> <video id="player1" playsinline autoplay loop muted volume="0.0"> <source ng-src="{{url | trusturl}}" type="video/mp4"> Your browser does not support the video tag. </video> </section> </div> 

After upgrading to chrome 64, this no longer disables my video. If I take video outside of ng-if and hardcode, it works as it should

Any solutions?

Answer 1

I found a temporary solution well, if I moved tg-if to the source tag, it will automatically disable it.

Chrome 64 has to do something when the page first loads it, looking for any video tags, so if your video tag is missing at startup, it will not start the disabled tag

Answer 2

I had the same problem in the Ember application I'm working on.

Two solutions that I had:

• move the <video> tags to index.html, just like you,
• create a function that can be called on the init hook or window.onload mutePlayer1VideoHack() { const player1Video = document.getElementById('player1'); player1Video.setAttribute('muted', true); } mutePlayer1VideoHack() { const player1Video = document.getElementById('player1'); player1Video.setAttribute('muted', true); }

I added the function name in # 2 with Hack in case this is a true Chrome 64 error that will be fixed. I'm going with solution # 1 for my case