Bug 1530579 - Wait that video element becomes visible before loading the test video r=jya

Append a video element to document with loading the test video triggered 'mozentervideosuspend' event. It caused the test failure.

Differential Revision: https://phabricator.services.mozilla.com/D21499

--HG--
extra : moz-landing-system : lando

dom/media/test/background_video.js

@@ -48,6 +48,26 @@ function appendVideoToDoc(url, token, width, height) {
   return v;
 }
 
+function appendVideoToDocWithoutLoad(token, width, height) {
+  // Default size of (160, 120) is used by other media tests.
+  if (width === undefined) { width = 160; }
+  if (height === undefined) { height = 3*width/4; }
+
+  let v = document.createElement('video');
+  v.token = token;
+  document.body.appendChild(v);
+  v.width = width;
+  v.height = height;
+  return v;
+}
+
+function loadAndWaitUntilLoadedmetadata(video, url, preloadType = "metadata") {
+  return new Promise((resolve, reject) => {
+    video.preload = preloadType;
+    video.addEventListener("loadedmetadata", () => { resolve(); }, true);
+    video.src = url;
+  });
+}
 
 /**
  * @param {HTMLMediaElement} video Video element with under test.

dom/media/test/test_background_video_resume_after_end_show_last_frame.html

@@ -89,27 +89,6 @@ function waitUntilSeekToLastFrame(video) {
   });
 }
 
-function appendVideoToDocWithoutLoad(token, width, height) {
-  // Default size of (160, 120) is used by other media tests.
-  if (width === undefined) { width = 160; }
-  if (height === undefined) { height = 3*width/4; }
-
-  let v = document.createElement('video');
-  v.token = token;
-  document.body.appendChild(v);
-  v.width = width;
-  v.height = height;
-  return v;
-}
-
-function loadAndWaitUntilLoadedmetadata(video, url, preloadType = "metadata") {
-  return new Promise((resolve, reject) => {
-    video.preload = preloadType;
-    video.addEventListener("loadedmetadata", () => { resolve(); }, true);
-    video.src = url;
-  });
-}
-
 startTest({
   desc: "Test resume an ended video shows the last frame.",
   prefs: [

dom/media/test/test_background_video_suspend.html

@@ -19,10 +19,10 @@
   }
 
   async function runTest(test, token) {
-    let video = appendVideoToDoc(test.name, token);
+    let video = appendVideoToDocWithoutLoad(token);
     manager.started(token);
 
-    let visible = waitUntilVisible(video)
+    let visible = waitUntilVisible(video);
     let ended = nextVideoEnded(video);
     let playing = nextVideoPlaying(video);
     let resumes = nextVideoResumes(video);
@@ -31,6 +31,9 @@
     Log(token, "Waiting until video becomes visible");
     await visible;
 
+    Log(token, "Waiting for metadata loaded");
+    await loadAndWaitUntilLoadedmetadata(video, test.name);
+
     Log(token, "Start playing");
     video.play();