Include viewport visibility checks for autoplay experiment.

third_party/WebKit/LayoutTests/media/video-autoplay-experiment-modes.html

Index: third_party/WebKit/LayoutTests/media/video-autoplay-experiment-modes.html
diff --git a/third_party/WebKit/LayoutTests/media/video-autoplay-experiment-modes.html b/third_party/WebKit/LayoutTests/media/video-autoplay-experiment-modes.html
index 04c704db8ca303cfb73658ac1f48d573b03baccf..8e0d6e006460877a045a57bfca4519e75d8c11a2 100644
--- a/third_party/WebKit/LayoutTests/media/video-autoplay-experiment-modes.html
+++ b/third_party/WebKit/LayoutTests/media/video-autoplay-experiment-modes.html
@@ -13,10 +13,12 @@
   Flags  - autoplay experiment setting being tested.

[ojan, 2015/10/01 06:14:26]

You might want to test viewport-based visibility for a video inside an iframe as
well (i.e. the video is visible inside the iframe, but the iframe itself is
offscreen). I'm pretty sure the current code gets that wrong.

The other case that I think the current code gets wrong is a video inside of a
position:absolute or transform:translate2d container where the top/left or the
transform puts it offscreen.

These are both things that should be fixed by my suggestions above.

[liberato (no reviews please), 2015/10/01 22:49:01]

i tried lots of iframes manually, and they work as expected.  i haven't managed
to produce a test for them yet.

                a      - "foraudio"
                v      - "forvideo"
+               V      - "ifviewport"
+               P      - "ifpagevisible"
                M      - "ifmuted"
                p      - "playmuted"
                m      - "ifmobile"
-               For example, EM means "enabled-ifmuted".
+               For example, vM means '-forvideo-ifmuted".
   Type   - audio or video element?
                audio  - <audio>
                video  - <video>
@@ -30,8 +32,16 @@
   Mobile - is page optimized for mobile?
                no   - page is not optimized for mobile.
                yes  - page is optimized for mobile.
+  View   - is media in viewport?
+               onscreen  - element starts out onscreen.
+               scroll    - element starts offscreen, scrolled into view once
+                           it is ready to play.
+               offscreen - element starts out offscreen and stays offscreen.
+               obscured  - onscreen but page is not visible.
 
   == Test Outputs ==
+  Early?  - did playback start before element was scrolled onscreen?  For
+            tests in which View!=scroll, this is reported as "-".
   Played? - did playback start by the conclusion of the test?
   Muted?  - was the media muted?  If the media didn't play, then this is
             reported as "-".
@@ -45,6 +55,8 @@
 <td>Play w/</td>
 <td>Mute</td>
 <td>Mobile</td>
+<td>View</td>
+<td>Early?</td>
 <td>Played?</td>
 <td>Muted?</td>
 </tr>
@@ -58,15 +70,19 @@ var configNumber = 0;
 
 var mediaFile = findMediaFile("video", "content/test");
 var onscreenParent = document.createElement("div");
+// The onscreen parent's height is also used to make sure that the off-screen
+// parent is, in fact, off-screen.
+onscreenParent.style.height = "1000px";
 document.body.insertBefore(onscreenParent, document.body.firstChild);
-// When we remove the meta tag from the document, we put it here.
+// Is the page optimized for mobile?  We can't un-optimize it.
 var isOptimizedForMobile = false;
+// Also create another root that's off the bottom of the window.
+var offscreenParent = document.createElement("div");
+document.body.appendChild(offscreenParent);
 
-function didPlaybackStart(video)
+function didPlaybackStart(element)
 {
-    // We say that the video started if it's not paused or if it played and
-    // already ended.
-    return !video.paused || video.ended;
+    return !element.paused || element.ended;
 }
 
 function becomeOptimizedForMobile(enable)
@@ -103,6 +119,8 @@ function addResultsRow(spec)
     var smallType = "";
     smallType += (type.indexOf("-forvideo")>-1)?"v":"";
     smallType += (type.indexOf("-foraudio")>-1)?"a":"";
+    smallType += (type.indexOf("-ifviewport")>-1)?"V":"";
+    smallType += (type.indexOf("-ifpagevisible")>-1)?"P":"";

[esprehn, 2015/10/01 07:04:13]

this test is huge and complicated, it should really be broken into multiple
tests

[liberato (no reviews please), 2015/10/01 22:49:01]

it's mostly setup code for the test cases.  i can split them up, but i don't
think it would be any simpler.

since we all agree that this shouldn't be a layout test anyway, it doesn't seem
like it would buy anything.

     smallType += (type.indexOf("-ifmuted")>-1)?"M":"";
     smallType += (type.indexOf("-playmuted")>-1)?"p":"";
     smallType += (type.indexOf("-ifmobile")>-1)?"m":"";
@@ -110,7 +128,7 @@ function addResultsRow(spec)
 
     // Add remaining fields.
     var fields = [ "elementType", "autoplayType", "mutedType", "mobileType",
-        "played", "muted"];
+        "visType", "playedEarly", "played", "muted"];
     for(idx in fields)
         row.insertCell().innerText = spec[fields[idx]].substring(0,7);
 }
@@ -137,6 +155,13 @@ function checkElementStatus(element)
     addResultsRow(element.spec);
     element.remove();
 
+    // Scroll back to the top, in case this was a scrolling test.
+    onscreenParent.scrollIntoView();
+
+    // Also make sure that the page is visible again.  Hidden pages cause the
+    // test to proceed very slowly.
+    testRunner.setPageVisibility("visible");
+
     queueNextExperiment();
 }
 
@@ -148,15 +173,26 @@ function runOneConfig(spec)
     var element = document.createElement(spec.elementType);
     element.controls = true;
 
-    onscreenParent.appendChild(element);
+    // Hide or show the page.
+    if (spec.visType == "obscured")
+        testRunner.setPageVisibility("hidden");
+
+    // Pick whether the element will be visible when canPlayThrough.
+    if (spec.visType == "offscreen" || spec.visType == "scroll")
+        offscreenParent.appendChild(element);
+    else
+        onscreenParent.appendChild(element);
 
     // Set any attributes before canPlayThrough.
     if (spec.mutedType == "yes")
         element.muted = true;
     if (spec.autoplayType == "attr")
         element.autoplay = true;
+
     becomeOptimizedForMobile(spec.mobileType == "yes");
 
+    spec.playedEarly = "-";
+
     // Record the spec in the element, so that we can display the
     // results later.
     element.spec = spec;
@@ -168,8 +204,22 @@ function runOneConfig(spec)
         // Now that we can play, if we're supposed to play / mute via js do so.
         configureElementViaScript(element, spec);
 
-        // Record the results.
-        checkElementStatus(element);
+        // If we're supposed to scroll the item onscreen after it is ready to
+        // play, then do so now.
+        if(spec.visType == "scroll") {
+            // Record the play state here, too, before we scroll.
+            spec.playedEarly = didPlaybackStart(element) ? "yes" : "no";
+
+            // We are supposed to scroll the player into view.
+            element.scrollIntoView(true);
+            window.internals.triggerAutoplayViewportCheck(element);
+            // Once these two methods return, changes to the element state due
+            // to the autoplay experiment should be observable synchronously.
+            checkElementStatus(element, spec);
+        } else {
+            // Record the results immediately.
+            checkElementStatus(element, spec);
+        }
     });
 
     // Set the source, which will eventually lead to canPlayThrough.
@@ -179,14 +229,18 @@ function runOneConfig(spec)
 var experimentTypes = [
     "none",
     "enabled-forvideo",
-    "enabled-forvideo-ifmuted",
-    "enabled-forvideo-playmuted",
+    "enabled-forvideo-ifpagevisible",
+    "enabled-forvideo-ifviewport",
+    "enabled-forvideo-ifviewport-ifmuted",
+    "enabled-forvideo-ifviewport-playmuted",
     "enabled-foraudio",
     "enabled-forvideo-ifmobile",
+    "enabled-foraudio-ifviewport",
 ];
 var elementTypes = ["video", "audio"];
 var autoplayTypes = ["none", "attr", "play()"];
 var mutedTypes = ["no", "yes"];
+var visTypes = ["onscreen", "scroll", "offscreen", "obscured"];
 // mobileTypes must always start with no, since we cannot un-optimize the page.
 var mobileTypes = ["no", "yes"];
 
@@ -205,6 +259,8 @@ function runNextConfig()
     exp = Math.floor(exp / autoplayTypes.length);
     spec.mutedType = mutedTypes[exp % mutedTypes.length];
     exp = Math.floor(exp / mutedTypes.length);
+    spec.visType = visTypes[exp % visTypes.length];
+    exp = Math.floor(exp / visTypes.length);
     // Mobile must always change last, so that all the "no" cases precede
     // all the "yes" cases, since we can't switch the doc back to "not
     // optimized for mobile".
@@ -230,10 +286,43 @@ function runNextConfig()
     if ((spec.mobileType == "yes" || spec.experimentType.indexOf("-ifmobile")>0)
         && (spec.elementType != "video" || spec.autoplayType != "attr"
             || spec.mutedType != "no"
+            || spec.visType != "onscreen"
             || (spec.experimentType != "enabled-forvideo"
                 && spec.experimentType != "enabled-forvideo-ifmobile")))
         skip = true;
 
+    var mismatched =(spec.elementType == "video"
+        && spec.experimentType.indexOf("-foraudio") > -1)

[esprehn, 2015/10/01 07:04:13]

string.includes is what you want.

spec.experimentType.includes("-foraudio")

[liberato (no reviews please), 2015/10/01 22:49:01]

Done.

+        || (spec.elementType == "audio"
+        && spec.experimentType.indexOf("-forvideo") > -1);
+
+    if (spec.autoplayType == "none" && spec.visType != 'onscreen')
+        skip = true;
+    else if (spec.experimentType.indexOf("-ifmuted") > -1

[esprehn, 2015/10/01 07:04:13]

ditto for all of these

[liberato (no reviews please), 2015/10/01 22:49:01]

Done.

+        && spec.visType != "onscreen")
+        skip = true;
+    else if (spec.visType == "offscreen"
+        && spec.autoplayType != "attr")
+        skip = true;
+    else if (spec.experimentType.indexOf("-ifmuted") == -1
+        && spec.mutedType == "yes")
+        skip = true;
+    else if (spec.elementType == "audio" && spec.mutedType == "yes")
+        skip = true;
+    else if (spec.elementType == "audio" && spec.visType != "scroll")
+        skip = true;
+    else if (mismatched && spec.visType !="onscreen")
+        skip = true;
+    else if (mismatched && spec.autoplayType != "attr")
+        skip = true;
+    else if (spec.visType == "obscured"
+        && spec.experimentType.indexOf("-ifpagevisible") <= -1)

[esprehn, 2015/10/01 07:04:13]

!string.includes(...)

[liberato (no reviews please), 2015/10/01 22:49:01]

Done.

+        skip = true;
+    else if ((spec.visType == "offscreen" || spec.visType == "scroll"
+        || spec.autoplayType != "attr" || spec.elementType != "video")
+        && spec.experimentType.indexOf("-ifpagevisible") > -1)
+        skip = true;
+
     if (skip)
         queueNextExperiment();
     else