Refactor WebRTC getUserMedia tests to be more explicit and clear.

content/test/data/media/getusermedia.html

Index: content/test/data/media/getusermedia.html
diff --git a/content/test/data/media/getusermedia.html b/content/test/data/media/getusermedia.html
index 4ef41543ad42091a75ad644dec5ce4d2c53b87e3..efab6c0523e349f228e76d944ac072ca5af374fa 100644
--- a/content/test/data/media/getusermedia.html
+++ b/content/test/data/media/getusermedia.html
@@ -6,10 +6,7 @@
     return document.getElementById(id);
   };
 
-  var gLocalStream = null;
-
   setAllEventsOccuredHandler(function() {
-    gLocalStream.stop();
     reportTestSuccess();
   });
 
@@ -26,7 +23,12 @@
     console.log('Calling getUserMediaAndStop.');
     navigator.webkitGetUserMedia(
         constraints,
-        function(stream) { displayAndDetectVideo(stream, stopVideoTrack); },
+        function(stream) {
+          detectVideoInLocalView1(stream, function() {
+            stream.getVideoTracks()[0].stop();
+            waitForVideoToStop('local-view-1');
+          });
+        },
         failedCallback);
   }
 
@@ -45,13 +47,13 @@
     navigator.webkitGetUserMedia(
         constraints,
         function(stream) {
-          var s = stream.clone();
+          var duplicate = stream.clone();
           assertEquals(stream.getVideoTracks().length, 1);
-          assertEquals(s.getVideoTracks().length, 1);
+          assertEquals(duplicate.getVideoTracks().length, 1);
           assertNotEquals(stream.getVideoTracks()[0].id,
-                          s.getVideoTracks()[0].id);
-          displayAndDetectVideo(
-            s,
+                          duplicate.getVideoTracks()[0].id);
+          detectVideoInLocalView1(
+            stream,
             function() {
               reportTestSuccess();
             });
@@ -64,13 +66,13 @@
     navigator.webkitGetUserMedia(
         constraints,
         function(stream) {
-          s = new webkitMediaStream(stream);
+          var duplicate = new webkitMediaStream(stream);
           assertEquals(stream.getVideoTracks().length, 1);
-          assertEquals(s.getVideoTracks().length, 1);
+          assertEquals(duplicate.getVideoTracks().length, 1);
           assertEquals(stream.getVideoTracks()[0].id,
-                       s.getVideoTracks()[0].id);
-          displayAndDetectVideo(
-            s,
+                       duplicate.getVideoTracks()[0].id);
+          detectVideoInLocalView1(
+            duplicate,
             function() {
               reportTestSuccess();
             });
@@ -83,13 +85,14 @@
     navigator.webkitGetUserMedia(
         constraints,
         function(stream) {
-          s = new webkitMediaStream();
-          s.addTrack(stream.getVideoTracks()[0]);
-          assertEquals(s.getVideoTracks().length, 1);
-          assertEquals(s.getVideoTracks().length, 1);
-          assertEquals(stream.getVideoTracks()[0].id, s.getVideoTracks()[0].id);
-          displayAndDetectVideo(
-            s,
+          var duplicate = new webkitMediaStream();
+          duplicate.addTrack(stream.getVideoTracks()[0]);
+          assertEquals(duplicate.getVideoTracks().length, 1);
+          assertEquals(duplicate.getVideoTracks().length, 1);
+          assertEquals(stream.getVideoTracks()[0].id,
+                       duplicate.getVideoTracks()[0].id);
+          detectVideoInLocalView1(
+            duplicate,
             function() {
               reportTestSuccess();
             });
@@ -102,14 +105,14 @@
     navigator.webkitGetUserMedia(
         constraints,
         function(stream) {
-          s = new webkitMediaStream();
-          s.addTrack(stream.getVideoTracks()[0].clone());
-          assertEquals(s.getVideoTracks().length, 1);
-          assertEquals(s.getVideoTracks().length, 1);
+          var duplicate = new webkitMediaStream();
+          duplicate.addTrack(stream.getVideoTracks()[0].clone());
+          assertEquals(duplicate.getVideoTracks().length, 1);
+          assertEquals(duplicate.getVideoTracks().length, 1);
           assertNotEquals(stream.getVideoTracks()[0].id,
-                          s.getVideoTracks()[0].id)
-          displayAndDetectVideo(
-            s,
+                          duplicate.getVideoTracks()[0].id)
+          detectVideoInLocalView1(
+            duplicate,
             function() {
               reportTestSuccess();
             });
@@ -118,13 +121,15 @@
   }
 
   // Creates a MediaStream and renders it locally. When the video is detected to
-  // be rolling we return ok-stream-running through the automation controller.
-  function getUserMediaAndGetStreamUp(constraints, waitTimeInSeconds) {
+  // be rolling we report success. The acquired stream is stored in window
+  // under the name |streamName|.
+  function getUserMediaAndGetStreamUp(constraints, streamName) {
     console.log('Calling getUserMediaAndGetStreamUp.');
     navigator.webkitGetUserMedia(
         constraints,
         function(stream) {
-          displayAndDetectVideo(
+          window[streamName] = stream;
+          detectVideoInLocalView1(
             stream,
             function() {
               reportTestSuccess();
@@ -160,37 +165,44 @@
   // streams are detected to be rolling, we stop the local video tracks one at
   // the time.
   function twoGetUserMediaAndStop(constraints) {
-    console.log('Calling Two GetUserMedia');
+    // TODO(phoglund): make gUM requests in parallel; this test is too slow

[perkj_chrome, 2014/10/07 13:07:23]

its not the actual request that is slow right? It must be rendering in two
players and detecting video?

[phoglund_chromium, 2014/10/07 13:57:53]

No, I mean that the cycle of detect - gum - detect - gum - stop - detect - stop
- detect contains too many detection phases. On bots with GPU emulation this
looks to be really slow, so I was thinking we could at least get video up for
both streams simultaneously and thereby run the first two detects in parallel. I
can reword the TODO to be more clear.

+    // and flakes on slow bots (http://crbug.com/417756).
+    var stream1 = null;
+    var stream2 = null;
     navigator.webkitGetUserMedia(
         constraints,
         function(stream) {
-          displayAndDetectVideo(stream, requestSecondGetUserMedia);
+          stream1 = stream;
+          detectVideoInLocalView1(stream, requestSecondGetUserMedia);
         },
         failedCallback);
     var requestSecondGetUserMedia = function() {
       navigator.webkitGetUserMedia(
           constraints,
           function(stream) {
-            displayIntoVideoElement(stream,
-                                    function() {
-                                      stopBothVideoTracksAndVerify(stream);
-                                    },
-                                    'local-view-2');
+            stream2 = stream;
+            attachMediaStream(stream, 'local-view-2');
+            detectVideoPlaying('local-view-2', stopBothVideoTracksAndVerify);
           },
           failedCallback);
     };
 
-    var stopBothVideoTracksAndVerify = function(streamPlayingInLocalView2) {
-      streamPlayingInLocalView2.getVideoTracks()[0].stop();
+    var stopBothVideoTracksAndVerify = function() {
+      // Stop track 2, ensure that stops track 2 but not track 1, then stop
+      // track 1.
+      stream2.getVideoTracks()[0].stop();
+      waitForVideoToStop('local-view-1');
       waitForVideoToStop('local-view-2');
-      // Make sure the video track in gLocalStream is still playing in
-      // 'local-view1' and then stop it.
-      displayAndDetectVideo(gLocalStream, stopVideoTrack);
+      detectVideoInLocalView1(stream1, function() {
+        stream1.getVideoTracks()[0].stop();
+      });
     };
   }
 
   function twoGetUserMedia(constraints1,
                            constraints2) {
+    // TODO(phoglund): make gUM requests in parallel; this test is too slow
+    // and flakes on slow bots (http://crbug.com/417756).
     var result="";
     navigator.webkitGetUserMedia(
         constraints1,
@@ -201,7 +213,7 @@
                 result = aspectRatio;
                 requestSecondGetUserMedia();
                },
-              'local-view');
+              'local-view-1');
         },
         failedCallback);
     var requestSecondGetUserMedia = function() {
@@ -226,6 +238,8 @@
                                              constraints2,
                                              expected_frame_rate1,
                                              expected_frame_rate2) {
+    // TODO(phoglund): make gUM requests in parallell; this test is too slow
+    // and flakes on slow bots (http://crbug.com/417756).
     addExpectedEvent();
     addExpectedEvent();
     var validateFrameRateCallback = function (success) {
@@ -238,10 +252,10 @@
         constraints1,
         function(stream) {
           requestSecondGetUserMedia();
-          plugStreamIntoVideoElement(stream, 'local-view');
-          detectVideoPlaying('local-view',
+          attachMediaStream(stream, 'local-view-1');
+          detectVideoPlaying('local-view-1',
               function() {
-                validateFrameRate('local-view', expected_frame_rate1,
+                validateFrameRate('local-view-1', expected_frame_rate1,
                     validateFrameRateCallback);
               });
         },
@@ -250,7 +264,7 @@
       navigator.webkitGetUserMedia(
           constraints2,
           function(stream) {
-            plugStreamIntoVideoElement(stream, 'local-view-2');
+            attachMediaStream(stream, 'local-view-2');
             detectVideoPlaying('local-view-2',
                 function() {
                   validateFrameRate('local-view-2', expected_frame_rate2,
@@ -265,19 +279,14 @@
     failTest('GetUserMedia call failed with code ' + error.code);
   }
 
-  function plugStreamIntoVideoElement(stream, videoElement) {
-    gLocalStream = stream;
+  function attachMediaStream(stream, videoElement) {
     var localStreamUrl = URL.createObjectURL(stream);
     $(videoElement).src = localStreamUrl;
   }
 
-  function displayIntoVideoElement(stream, callback, videoElement) {
-    plugStreamIntoVideoElement(stream, videoElement);
-    detectVideoPlaying(videoElement, callback);
-  }
-
-  function displayAndDetectVideo(stream, callback) {
-    displayIntoVideoElement(stream, callback, 'local-view');
+  function detectVideoInLocalView1(stream, callback) {
+    attachMediaStream(stream, 'local-view-1');
+    detectVideoPlaying('local-view-1', callback);
   }
 
   function displayDetectAndAnalyzeVideo(stream) {
@@ -285,41 +294,37 @@
         function(aspectRatio) {
           sendValueToTest(aspectRatio);
         },
-        'local-view');
+        'local-view-1');
   }
 
   function displayDetectAndAnalyzeVideoInElement(
       stream, callback, videoElement) {
-    plugStreamIntoVideoElement(stream, videoElement);
+    attachMediaStream(stream, videoElement);
     detectAspectRatio(callback, videoElement);
   }
 
   function createAndRenderClone(stream) {
-    gLocalStream = stream;
     // TODO(perkj):  --use-fake-device-for-media-stream do not currently
     // work with audio devices and not all bots has a microphone.
-    new_stream = new webkitMediaStream();
-    new_stream.addTrack(stream.getVideoTracks()[0]);
-    assertEquals(new_stream.getVideoTracks().length, 1);
+    newStream = new webkitMediaStream();
+    newStream.addTrack(stream.getVideoTracks()[0]);
+    assertEquals(newStream.getVideoTracks().length, 1);
     if (stream.getAudioTracks().length > 0) {
-      new_stream.addTrack(stream.getAudioTracks()[0]);
-      assertEquals(new_stream.getAudioTracks().length, 1);
-      new_stream.removeTrack(new_stream.getAudioTracks()[0]);
-      assertEquals(new_stream.getAudioTracks().length, 0);
+      newStream.addTrack(stream.getAudioTracks()[0]);
+      assertEquals(newStream.getAudioTracks().length, 1);
+      newStream.removeTrack(newStream.getAudioTracks()[0]);
+      assertEquals(newStream.getAudioTracks().length, 0);
     }
 
-    var newStreamUrl = URL.createObjectURL(new_stream);
-    $('local-view').src = newStreamUrl;
-    waitForVideo('local-view');
-  }
-
-  function stopVideoTrack() {
-    gLocalStream.getVideoTracks()[0].stop();
-    waitForVideoToStop('local-view');
+    detectVideoInLocalView1(newStream, reportTestSuccess);
   }
 
-  function waitAndStopVideoTrack(waitTimeInSeconds) {
-    setTimeout(stopVideoTrack, waitTimeInSeconds * 1000);
+  // Calls stop on |stream|'s video track after a delay and reports success.
+  function waitAndStopVideoTrack(stream, waitTimeInSeconds) {
+    setTimeout(function() {
+      stream.getVideoTracks()[0].stop();
+      reportTestSuccess();
+    }, waitTimeInSeconds * 1000);
   }
 
   // This test make sure multiple video renderers can be created for the same
@@ -448,17 +453,17 @@
 </head>
 <body>
   <table border="0">
+    <!-- Canvases are named after their corresponding video elements. -->
     <tr>
-      <td><video width="320" height="240" id="local-view"
-          autoplay="autoplay" style="display:none"></video></td>
-      <td><canvas id="local-view-canvas"
+      <td><video id="local-view-1" width="320" height="240" autoplay
+          style="display:none"></video></td>
+      <td><canvas id="local-view-1-canvas" width="320" height="240"
           style="display:none"></canvas></td>
     </tr>
     <tr>
-      <td><video width="320" height="240" id="local-view-2"
-          autoplay style="display:none"></video></td>
-      <!-- Canvases are named after their corresponding video elements. -->
-      <td><canvas width="320" height="240" id="local-view-2-canvas"
+      <td><video id="local-view-2" width="320" height="240" autoplay
+          style="display:none"></video></td>
+      <td><canvas id="local-view-2-canvas" width="320" height="240"
           style="display:none"></canvas></td>
     </tr>
   </table>