fix: DRMed content goes black in IE/Edge when video element focused (#…

…6318)

Any programmatic call to focus when playing back DRMed content on IE/Edge causes the video element to turn black. Instead, don't call focus() in those cases.

Fixes #6270.

src/js/big-play-button.js

@@ -4,6 +4,7 @@
 import Button from './button.js';
 import Component from './component.js';
 import {isPromise, silencePromise} from './utils/promise';
+import * as browser from './utils/browser.js';
 
 /**
  * The initial play button that shows before the video has played. The hiding of the
@@ -46,8 +47,16 @@ class BigPlayButton extends Button {
 
     // exit early if clicked via the mouse
     if (this.mouseused_ && event.clientX && event.clientY) {
+      const sourceIsEncrypted = this.player_.usingPlugin('eme') &&
+                                this.player_.eme.sessions &&
+                                this.player_.eme.sessions.length > 0;
+
       silencePromise(playPromise);
-      if (this.player_.tech(true)) {
+      if (this.player_.tech(true) &&
+         // We've observed a bug in IE and Edge when playing back DRM content where
+         // calling .focus() on the video element causes the video to go black,
+         // so we avoid it in that specific case
+         !((browser.IE_VERSION || browser.IS_EDGE) && sourceIsEncrypted)) {
         this.player_.tech(true).focus();
       }
       return;