feat: added API to set media keys directly

README.md

@@ -23,6 +23,7 @@ Maintenance Status: Stable
   - [Source Options](#source-options)
   - [Plugin Options](#plugin-options)
   - [emeOptions](#emeoptions)
+  - [initializeMediaKeys](#initializemediakeys)
   - [Passing methods seems complicated](#passing-methods-seems-complicated)
   - [Special Events](#special-events)
 - [Getting Started](#getting-started)
@@ -328,6 +329,22 @@ player.src({
 });
 ```
 
+### initializeMediaKeys
+Type: `function`
+
+`player.eme.initializeMediaKeys()` sets up MediaKeys immediately on demand. This is useful for setting up the video element for DRM before loading any content. Otherwise the video element is set up for DRM on `encrypted` events. This is not supported in Safari.
+
+```javascript
+// additional plugin options
+var emeOptions = {
+  keySystems: {
+    'org.w3.clearkey': {...}
+  }
+};
+
+player.eme.initializeMediaKeys(emeOptions);
+```
+
 ### Passing methods seems complicated
 
 While simple URLs are supported for many EME implementations, we wanted to provide as much

src/plugin.js

@@ -222,6 +222,36 @@ const onPlayerReady = (player) => {
   });
 };
 
+/**
+ * Sets up MediaKeys on demand
+ * Works around https://bugs.chromium.org/p/chromium/issues/detail?id=895449
+ *
+ * @function initializeMediaKeys
+ * @param    {Object} [player]
+ *           A player object.
+ * @param    {Object} [emeOptions={}]
+ *           An object of eme plugin options.
+ */
+const initializeMediaKeys = (player, emeOptions = {}) => {
+  // TODO: this should be refactored and renamed to be less tied
+  // to encrypted events
+
+  // fake an encrypted event for handleEncryptedEvent
+  const mockEncryptedEvent = {
+    initDataType: 'cenc',
+    initData: null,
+    target: player.tech_.el_
+  };
+
+  setupSessions(player);
+
+  if (player.tech_.el_.setMediaKeys) {
+    return handleEncryptedEvent(mockEncryptedEvent, emeOptions, player.eme.sessions, player.tech_);
+  } else if (player.tech_.el_.msSetMediaKeys) {
+    handleMsNeedKeyEvent(mockEncryptedEvent, emeOptions, player.eme.sessions, player.tech_);
+  }
+};
+
 /**
  * A video.js plugin.
  *
@@ -231,18 +261,33 @@ const onPlayerReady = (player) => {
  * to you; if not, remove the wait for "ready"!
  *
  * @function eme
+ * @param    {Object} [player]
+ *           A player object.
  * @param    {Object} [options={}]
  *           An object of options left to the plugin author to define.
  */
-const eme = function(options = {}) {
-  this.eme.options = options;
-
-  this.ready(() => onPlayerReady(this));
+const eme = function(player, options = {}) {
+  player.ready(() => onPlayerReady(player));
+
+  player.eme = {
+    initializeMediaKeys(emeOptions = {}) {
+      const mergedEmeOptions = videojs.mergeOptions(
+        player.currentSource(),
+        options,
+        emeOptions
+      );
+
+      return initializeMediaKeys(player, mergedEmeOptions);
+    },
+    options
+  };
 };
 
 // Register the plugin with video.js.
 const registerPlugin = videojs.registerPlugin || videojs.plugin;
 
-registerPlugin('eme', eme);
+registerPlugin('eme', function(options) {
+  eme(this, options);
+});
 
 export default eme;

test/plugin.test.js

@@ -37,9 +37,23 @@ QUnit.module('videojs-contrib-eme', {
     this.video = document.createElement('video');
     this.fixture.appendChild(this.video);
     this.player = videojs(this.video);
+
+    this.origRequestMediaKeySystemAccess = window.navigator.requestMediaKeySystemAccess;
+
+    window.navigator.requestMediaKeySystemAccess = (keySystem, options) => {
+      return Promise.resolve({
+        keySystem: 'org.w3.clearkey',
+        createMediaKeys: () => {
+          return {
+            createSession: () => new videojs.EventTarget()
+          };
+        }
+      });
+    };
   },
 
   afterEach() {
+    window.navigator.requestMediaKeySystemAccess = this.origRequestMediaKeySystemAccess;
     this.player.dispose();
     this.clock.restore();
   }
@@ -82,6 +96,56 @@ QUnit.test('exposes options', function(assert) {
     'exposes publisherId');
 });
 
+QUnit.test('initializeMediaKeys standard', function(assert) {
+  const done = assert.async();
+  const initData = new Uint8Array([1, 2, 3]).buffer;
+
+  this.player.eme();
+
+  // testing the rejection path because this isn't a real session
+  this.player.eme.initializeMediaKeys({
+    keySystems: {
+      'org.w3.clearkey': {
+        pssh: initData
+      }
+    }
+  }).catch(() => {
+    const sessions = this.player.eme.sessions;
+
+    assert.equal(sessions.length, 1, 'created a session when keySystems in options');
+    assert.deepEqual(sessions[0].initData, initData, 'captured initData in the session');
+    done();
+  });
+});
+
+QUnit.test('initializeMediaKeys ms-prefix', function(assert) {
+  // stub setMediaKeys
+  const setMediaKeys = this.player.tech_.el_.setMediaKeys;
+
+  this.player.tech_.el_.setMediaKeys = null;
+  this.player.tech_.el_.msSetMediaKeys = () => {};
+
+  const initData = new Uint8Array([1, 2, 3]).buffer;
+
+  this.player.eme();
+
+  this.player.eme.initializeMediaKeys({
+    keySystems: {
+      'com.microsoft.playready': {
+        pssh: initData
+      }
+    }
+  });
+
+  const sessions = this.player.eme.sessions;
+
+  assert.equal(sessions.length, 1, 'created a session when keySystems in options');
+  assert.deepEqual(sessions[0].initData, initData, 'captured initData in the session');
+
+  this.player.tech_.el_.msSetMediaKeys = null;
+  this.player.tech_.el_.setMediaKeys = setMediaKeys;
+});
+
 QUnit.module('plugin guard functions', {
   beforeEach() {
     this.options = {