Reland: Fix Flaky EncryptedMediaTest

Original issue's description:
> Tests are flaky as setMediaKeys() was not completing before the
> "encrypted" event was generated. Change delays setting the video
> source until setMediaKeys() completes.

Original change fixed the issue reported in 444683 but exposed a
second. The new issue is that the changed tests were occasionally
calling play() on the video before the video source was set (due
to the asynchronous nature of the promises involved). As a result
the video would never play, resulting in the test timing out. The
additional changes return promises so that play() is not called
until the video source is set up.

BUG=444683,444827
TEST=Failing tests run fine locally

Review URL: https://codereview.chromium.org/827123003

Cr-Commit-Position: refs/heads/master@{#309846}

10 files changed, 71 insertions, 53 deletions

diff --git a/media/test/data/eme_player.html b/media/test/data/eme_player.html
index 65c120f..3b2457f 100644
--- a/media/test/data/eme_player.html
+++ b/media/test/data/eme_player.html
@@ -84,9 +84,7 @@
       video.removeEventListener('timeupdate', onTimeUpdate);
     }
 
-    function Play() {
-      // Update test configuration with UI elements values.
-      var video = emeApp.createPlayer().video;
+    function Play(video) {
       Utils.resetTitleChange();
       // Ended should not fire before onTimeUpdate.
       video.addEventListener('ended', Utils.failTest);
@@ -103,6 +101,9 @@
       else
         element.style['display'] = '';
     }
-    Play();
+
+    emeApp.createPlayer()
+        .then(function(player) { Play(player.video); })
+        .catch(function(error) { Utils.failTest('Unable to play video.'); });
   </script>
 </html>
diff --git a/media/test/data/eme_player_js/clearkey_player.js b/media/test/data/eme_player_js/clearkey_player.js
index fed25ad..6a7ca64 100644
--- a/media/test/data/eme_player_js/clearkey_player.js
+++ b/media/test/data/eme_player_js/clearkey_player.js
@@ -10,11 +10,13 @@ function ClearKeyPlayer(video, testConfig) {
 }
 
 ClearKeyPlayer.prototype.init = function() {
-  PlayerUtils.initEMEPlayer(this);
+  // Returns a promise.
+  return PlayerUtils.initEMEPlayer(this);
 };
 
 ClearKeyPlayer.prototype.registerEventListeners = function() {
-  PlayerUtils.registerEMEEventListeners(this);
+  // Returns a promise.
+  return PlayerUtils.registerEMEEventListeners(this);
 };
 
 ClearKeyPlayer.prototype.onMessage = function(message) {
diff --git a/media/test/data/eme_player_js/eme_app.js b/media/test/data/eme_player_js/eme_app.js
index 4c2ec0d..fed3919 100644
--- a/media/test/data/eme_player_js/eme_app.js
+++ b/media/test/data/eme_player_js/eme_app.js
@@ -40,8 +40,7 @@ EMEApp.prototype.createPlayer = function() {
   if (this.testConfig_.runFPS)
     FPSObserver.observe(this.video_);
 
-  videoPlayer.init();
-  return videoPlayer;
+  return videoPlayer.init().then(function(result) { return videoPlayer; });
 };
 
 EMEApp.prototype.updateDocument = function(testConfig) {
diff --git a/media/test/data/eme_player_js/file_io_test_player.js b/media/test/data/eme_player_js/file_io_test_player.js
index d259801..685ad5b 100644
--- a/media/test/data/eme_player_js/file_io_test_player.js
+++ b/media/test/data/eme_player_js/file_io_test_player.js
@@ -9,11 +9,13 @@ function FileIOTestPlayer(video, testConfig) {
 }
 
 FileIOTestPlayer.prototype.init = function() {
-  PlayerUtils.initPrefixedEMEPlayer(this);
+  // Returns a promise.
+  return PlayerUtils.initEMEPlayer(this);
 };
 
 FileIOTestPlayer.prototype.registerEventListeners = function() {
-  PlayerUtils.registerPrefixedEMEEventListeners(this);
+  // Returns a promise.
+  return PlayerUtils.registerPrefixedEMEEventListeners(this);
 };
 
 FileIOTestPlayer.prototype.onWebkitKeyMessage = function(message) {
diff --git a/media/test/data/eme_player_js/player_utils.js b/media/test/data/eme_player_js/player_utils.js
index 5dbe002..520c0dd 100644
--- a/media/test/data/eme_player_js/player_utils.js
+++ b/media/test/data/eme_player_js/player_utils.js
@@ -36,6 +36,8 @@ PlayerUtils.registerDefaultEventListeners = function(player) {
   }
 };
 
+// Register the necessary event handlers needed when playing encrypted content
+// using the unprefixed API. Returns a promise that resolves to the player.
 PlayerUtils.registerEMEEventListeners = function(player) {
   player.video.addEventListener('encrypted', function(message) {
 
@@ -67,9 +69,7 @@ PlayerUtils.registerEMEEventListeners = function(player) {
         var session = message.target.mediaKeys.createSession();
         addMediaKeySessionListeners(session);
         session.generateRequest(message.initDataType, message.initData)
-          .catch(function(error) {
-            Utils.failTest(error, KEY_ERROR);
-          });
+            .catch(function(error) { Utils.failTest(error, KEY_ERROR); });
       }
     } catch (e) {
       Utils.failTest(e);
@@ -77,25 +77,19 @@ PlayerUtils.registerEMEEventListeners = function(player) {
   });
 
   this.registerDefaultEventListeners(player);
-  try {
-    Utils.timeLog('Setting video media keys: ' + player.testConfig.keySystem);
-    if (typeof navigator.requestMediaKeySystemAccess == 'function') {
-      navigator.requestMediaKeySystemAccess(player.testConfig.keySystem)
-          .then(function(access) { return access.createMediaKeys(); })
-          .then(function(mediaKeys) { player.video.setMediaKeys(mediaKeys); })
-          .catch(function(error) { Utils.failTest(error, NOTSUPPORTEDERROR); });
-    } else {
-      // TODO(jrummell): Remove this once the blink change for
-      // requestMediaKeySystemAccess lands.
-      MediaKeys.create(player.testConfig.keySystem)
-          .then(function(mediaKeys) { player.video.setMediaKeys(mediaKeys); })
-          .catch(function(error) { Utils.failTest(error, NOTSUPPORTEDERROR); });
-    }
-  } catch (e) {
-    Utils.failTest(e);
-  }
+  Utils.timeLog('Setting video media keys: ' + player.testConfig.keySystem);
+  return navigator.requestMediaKeySystemAccess(player.testConfig.keySystem)
+      .then(function(access) { return access.createMediaKeys(); })
+      .then(function(mediaKeys) {
+        return player.video.setMediaKeys(mediaKeys);
+      })
+      .then(function(result) { return player; })
+      .catch(function(error) { Utils.failTest(error, NOTSUPPORTEDERROR); });
 };
 
+// Register the necessary event handlers needed when playing encrypted content
+// using the prefixed API. Even though the prefixed API is all synchronous,
+// returns a promise that resolves to the player.
 PlayerUtils.registerPrefixedEMEEventListeners = function(player) {
  player.video.addEventListener('webkitneedkey', function(message) {
     var initData = message.initData;
@@ -133,7 +127,12 @@ PlayerUtils.registerPrefixedEMEEventListeners = function(player) {
       message.target.receivedHeartbeat = true;
     }
   });
-  this.registerDefaultEventListeners(player);
+
+  // The prefixed API is all synchronous, so wrap the calls in a promise.
+  return new Promise(function(resolve, reject) {
+    PlayerUtils.registerDefaultEventListeners(player);
+    resolve(player);
+  });
 };
 
 PlayerUtils.setVideoSource = function(player) {
@@ -148,14 +147,13 @@ PlayerUtils.setVideoSource = function(player) {
   }
 };
 
+// Initialize the player to play encrypted content. Returns a promise that
+// resolves to the player.
 PlayerUtils.initEMEPlayer = function(player) {
-  this.registerEMEEventListeners(player);
-  this.setVideoSource(player);
-};
-
-PlayerUtils.initPrefixedEMEPlayer = function(player) {
-  this.registerPrefixedEMEEventListeners(player);
-  this.setVideoSource(player);
+  return player.registerEventListeners().then(function(result) {
+    PlayerUtils.setVideoSource(player);
+    return player;
+  });
 };
 
 // Return the appropriate player based on test configuration.
diff --git a/media/test/data/eme_player_js/prefixed_clearkey_player.js b/media/test/data/eme_player_js/prefixed_clearkey_player.js
index 910a126..f06a08e 100644
--- a/media/test/data/eme_player_js/prefixed_clearkey_player.js
+++ b/media/test/data/eme_player_js/prefixed_clearkey_player.js
@@ -10,11 +10,13 @@ function PrefixedClearKeyPlayer(video, testConfig) {
 }
 
 PrefixedClearKeyPlayer.prototype.init = function() {
-  PlayerUtils.initPrefixedEMEPlayer(this);
+  // Returns a promise.
+  return PlayerUtils.initEMEPlayer(this);
 };
 
 PrefixedClearKeyPlayer.prototype.registerEventListeners = function() {
-  PlayerUtils.registerPrefixedEMEEventListeners(this);
+  // Returns a promise.
+  return PlayerUtils.registerPrefixedEMEEventListeners(this);
 };
 
 PrefixedClearKeyPlayer.prototype.onWebkitKeyMessage = function(message) {
diff --git a/media/test/data/eme_player_js/prefixed_widevine_player.js b/media/test/data/eme_player_js/prefixed_widevine_player.js
index adfd570..f558f5f 100644
--- a/media/test/data/eme_player_js/prefixed_widevine_player.js
+++ b/media/test/data/eme_player_js/prefixed_widevine_player.js
@@ -10,11 +10,13 @@ function PrefixedWidevinePlayer(video, testConfig) {
 }
 
 PrefixedWidevinePlayer.prototype.init = function() {
-  PlayerUtils.initPrefixedEMEPlayer(this);
+  // Returns a promise.
+  return PlayerUtils.initEMEPlayer(this);
 };
 
 PrefixedWidevinePlayer.prototype.registerEventListeners = function() {
-  PlayerUtils.registerPrefixedEMEEventListeners(this);
+  // Returns a promise.
+  return PlayerUtils.registerPrefixedEMEEventListeners(this);
 };
 
 PrefixedWidevinePlayer.prototype.onWebkitKeyMessage = function(message) {
diff --git a/media/test/data/eme_player_js/widevine_player.js b/media/test/data/eme_player_js/widevine_player.js
index c6de516..3d73393 100644
--- a/media/test/data/eme_player_js/widevine_player.js
+++ b/media/test/data/eme_player_js/widevine_player.js
@@ -10,11 +10,13 @@ function WidevinePlayer(video, testConfig) {
 }
 
 WidevinePlayer.prototype.init = function() {
-  PlayerUtils.initEMEPlayer(this);
+  // Returns a promise.
+  return PlayerUtils.initEMEPlayer(this);
 };
 
 WidevinePlayer.prototype.registerEventListeners = function() {
-  PlayerUtils.registerEMEEventListeners(this);
+  // Returns a promise.
+  return PlayerUtils.registerEMEEventListeners(this);
 };
 
 WidevinePlayer.prototype.onMessage = function(message) {
diff --git a/media/test/data/encrypted_frame_size_change.html b/media/test/data/encrypted_frame_size_change.html
index 5a90990..9b0f60f 100644
--- a/media/test/data/encrypted_frame_size_change.html
+++ b/media/test/data/encrypted_frame_size_change.html
@@ -14,13 +14,12 @@
       testConfig.loadQueryParams();
 
       function load() {
-        loadVideo(video_fixed_size);
-        loadVideo(video);
+        loadVideo(video_fixed_size).then(function() {
+          loadVideo(video);
+        });
       }
 
       function loadVideo(video) {
-        var videoPlayer = PlayerUtils.createPlayer(video, testConfig);
-        videoPlayer.init();
         video.addEventListener('playing', function() {
           // Make sure the video plays for a bit.
           video.addEventListener('timeupdate', function() {
@@ -43,7 +42,11 @@
         });
 
         video.addEventListener('canplay', oncanplay);
-        video.play();
+
+        var videoPlayer = PlayerUtils.createPlayer(video, testConfig);
+        return videoPlayer.init()
+            .then(function() { video.play(); })
+            .catch(function() { Utils.failTest('Unable to play video.'); });
       }
     </script>
   </body>
diff --git a/media/test/data/mse_config_change.html b/media/test/data/mse_config_change.html
index f536ece..d78cc9e 100644
--- a/media/test/data/mse_config_change.html
+++ b/media/test/data/mse_config_change.html
@@ -121,13 +121,20 @@
         testConfig.mediaType = mediaType;
         video.addEventListener('timeupdate', onTimeUpdate);
         video.addEventListener('ended', Utils.failTest);
+        var mediaSource = MediaSourceUtils.loadMediaSource(
+            MEDIA_1, mediaType, appendNextSource);
         if (runEncrypted) {
           var emePlayer = PlayerUtils.createPlayer(video, testConfig);
-          emePlayer.registerEventListeners();
+          emePlayer.registerEventListeners()
+              .then(function(player) {
+                video.src = window.URL.createObjectURL(mediaSource);
+              })
+              .catch(function(error) {
+                Utils.failTest('Unable to register event listeners.');
+              });
+        } else {
+          video.src = window.URL.createObjectURL(mediaSource);
         }
-        var mediaSource = MediaSourceUtils.loadMediaSource(
-            MEDIA_1, mediaType, appendNextSource);
-        video.src = window.URL.createObjectURL(mediaSource);
       }
       </script>
   </body>