[WIP] Fix EME async errors

Author: Rob Walch

src/controller/eme-controller.ts

@@ -83,14 +83,16 @@ class EMEController extends EventHandler {
   private _widevineLicenseUrl?: string;
   private _licenseXhrSetup?: (xhr: XMLHttpRequest, url: string) => void;
   private _emeEnabled: boolean;
-  private _requestMediaKeySystemAccess: MediaKeyFunc | null
+  private _requestMediaKeySystemAccess: MediaKeyFunc | null;
 
   private _config: EMEControllerConfig;
   private _mediaKeysList: MediaKeysListItem[] = [];
   private _media: HTMLMediaElement | null = null;
   private _hasSetMediaKeys: boolean = false;
   private _requestLicenseFailureCount: number = 0;
 
+  private mediaKeysPromise: Promise<MediaKeys> | null = null;
+
   /**
      * @constructs
      * @param {Hls} hls Our Hls.js instance
@@ -143,13 +145,14 @@ class EMEController extends EventHandler {
     logger.log('Requesting encrypted media key-system access');
 
     // expecting interface like window.navigator.requestMediaKeySystemAccess
-    this.requestMediaKeySystemAccess(keySystem, mediaKeySystemConfigs)
-      .then((mediaKeySystemAccess) => {
-        this._onMediaKeySystemAccessObtained(keySystem, mediaKeySystemAccess);
-      })
-      .catch((err) => {
-        logger.error(`Failed to obtain key-system "${keySystem}" access:`, err);
-      });
+    const keySystemAccessPromise = this.requestMediaKeySystemAccess(keySystem, mediaKeySystemConfigs);
+
+    this.mediaKeysPromise = keySystemAccessPromise.then((mediaKeySystemAccess) =>
+      this._onMediaKeySystemAccessObtained(keySystem, mediaKeySystemAccess));
+
+    keySystemAccessPromise.catch((err) => {
+      logger.error(`Failed to obtain key-system "${keySystem}" access:`, err);
+    });
   }
 
   get requestMediaKeySystemAccess () {
@@ -166,7 +169,7 @@ class EMEController extends EventHandler {
      * @param {string} keySystem
      * @param {MediaKeySystemAccess} mediaKeySystemAccess https://developer.mozilla.org/en-US/docs/Web/API/MediaKeySystemAccess
      */
-  private _onMediaKeySystemAccessObtained (keySystem: KeySystems, mediaKeySystemAccess: MediaKeySystemAccess) {
+  private _onMediaKeySystemAccessObtained (keySystem: KeySystems, mediaKeySystemAccess: MediaKeySystemAccess): Promise<MediaKeys> {
     logger.log(`Access for key-system "${keySystem}" obtained`);
 
     const mediaKeysListItem: MediaKeysListItem = {
@@ -177,17 +180,22 @@ class EMEController extends EventHandler {
 
     this._mediaKeysList.push(mediaKeysListItem);
 
-    mediaKeySystemAccess.createMediaKeys()
+    const mediaKeysPromise = mediaKeySystemAccess.createMediaKeys()
       .then((mediaKeys) => {
         mediaKeysListItem.mediaKeys = mediaKeys;
 
         logger.log(`Media-keys created for key-system "${keySystem}"`);
 
         this._onMediaKeysCreated();
-      })
-      .catch((err) => {
-        logger.error('Failed to create media-keys:', err);
+
+        return mediaKeys;
       });
+
+    mediaKeysPromise.catch((err) => {
+      logger.error('Failed to create media-keys:', err);
+    });
+
+    return mediaKeysPromise;
   }
 
   /**
@@ -235,8 +243,7 @@ class EMEController extends EventHandler {
 
   /**
    * @private
-   * @param {string} initDataType
-   * @param {ArrayBuffer|null} initData
+   * @param e {MediaEncryptedEvent}
    */
   private _onMediaEncrypted = (e: MediaEncryptedEvent) => {
     logger.log(`Media is encrypted using "${e.initDataType}" init data type`);
@@ -254,10 +261,8 @@ class EMEController extends EventHandler {
     }
 
     if (!this._hasSetMediaKeys) {
-      // FIXME: see if we can/want/need-to really to deal with several potential key-sessions?
-      const keysListItem = this._mediaKeysList[0];
-      if (!keysListItem || !keysListItem.mediaKeys) {
-        logger.error('Fatal: Media is encrypted but no CDM access or no keys have been obtained yet');
+      if (!this.mediaKeysPromise) {
+        logger.error('Fatal: Media is encrypted but no CDM access or no keys have been requested');
         this.hls.trigger(Event.ERROR, {
           type: ErrorTypes.KEY_SYSTEM_ERROR,
           details: ErrorDetails.KEY_SYSTEM_NO_KEYS,
@@ -266,10 +271,35 @@ class EMEController extends EventHandler {
         return;
       }
 
-      logger.log('Setting keys for encrypted media');
-
-      this._media.setMediaKeys(keysListItem.mediaKeys);
-      this._hasSetMediaKeys = true;
+      // FIXME: see if we can/want/need-to really to deal with several potential key-sessions?
+      // const keysListItem = this._mediaKeysList[0];
+      // if (!keysListItem || !keysListItem.mediaKeys) {
+      //   logger.error('Fatal: Media is encrypted but no CDM access or no keys have been obtained yet' +
+      //     `(keysListItem: ${keysListItem}, mediaKeysList count (${this._mediaKeysList.length})`);
+      //   this.hls.trigger(Event.ERROR, {
+      //     type: ErrorTypes.KEY_SYSTEM_ERROR,
+      //     details: ErrorDetails.KEY_SYSTEM_NO_KEYS,
+      //     fatal: true
+      //   });
+      //   return;
+      // }
+
+      this.mediaKeysPromise.then((mediaKeys) => {
+        if (!this._media) {
+          return;
+        }
+        logger.log('Setting keys for encrypted media');
+        this._media.setMediaKeys(mediaKeys);
+        this._hasSetMediaKeys = true;
+      }).catch((error) => {
+        logger.error(`Fatal: Media is encrypted but CDM access failed with error ${error.message}`);
+        this.hls.trigger(Event.ERROR, {
+          type: ErrorTypes.KEY_SYSTEM_ERROR,
+          details: ErrorDetails.KEY_SYSTEM_NO_KEYS,
+          fatal: true,
+          error
+        });
+      });
     }
   }