| Index: third_party/WebKit/LayoutTests/media/track/track-css-matching.html
 | 
| diff --git a/third_party/WebKit/LayoutTests/media/track/track-css-matching.html b/third_party/WebKit/LayoutTests/media/track/track-css-matching.html
 | 
| index eb942dff2249f78427d483167684c0d5b5fa9296..e217f8a53d14ed033e930f08e13d320961b0b25a 100644
 | 
| --- a/third_party/WebKit/LayoutTests/media/track/track-css-matching.html
 | 
| +++ b/third_party/WebKit/LayoutTests/media/track/track-css-matching.html
 | 
| @@ -1,85 +1,58 @@
 | 
|  <!DOCTYPE html>
 | 
| -<html>
 | 
| -    <head>
 | 
| -        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 | 
| -
 | 
| -        <script src=../media-file.js></script>
 | 
| -        <!-- TODO(philipj): Convert test to testharness.js. crbug.com/588956
 | 
| -             (Please avoid writing new tests using video-test.js) -->
 | 
| -        <script src=../video-test.js></script>
 | 
| -        <script src=../media-controls.js></script>
 | 
| -
 | 
| -        <style>
 | 
| -        video::cue(c) {color: purple}
 | 
| -        video::cue(v) {color: yellow}
 | 
| -        video::cue(v[voice="Mark"]) {color: red}
 | 
| -        video::cue(v[voice="Nancy"]) {color: green}
 | 
| -        video::cue(b) {color: lime}
 | 
| -        video::cue(.red, .red2) { color:red }
 | 
| -        #testvideo::cue(.green) { color:green }
 | 
| -        video::cue(#testcue) {color: green}
 | 
| -        video::cue(:future) {color: gray}
 | 
| -        </style>
 | 
| -
 | 
| -        <script>
 | 
| -
 | 
| -        var cueNode;
 | 
| -        var seekedCount = 0;
 | 
| -        var seekTimes = [0.3, 0.5, 0.7, 0.9, 1.1, 1.3, 1.5];
 | 
| -
 | 
| -        var info = [["rgb(255, 0, 0)", "rgb(0, 128, 0)", "rgb(255, 0, 0)"],
 | 
| -                    ["rgb(128, 0, 128)", "rgb(128, 128, 128)", "rgb(128, 128, 128)"],
 | 
| -                    ["rgb(128, 0, 128)", "rgb(128, 0, 128)", "rgb(128, 128, 128)"],
 | 
| -                    ["rgb(128, 0, 128)", "rgb(128, 0, 128)", "rgb(128, 0, 128)"],
 | 
| -                    ["rgb(128, 0, 128)", "rgb(255, 255, 0)", "rgb(0, 255, 0)"],
 | 
| -                    ["rgb(0, 128, 0)", "rgb(0, 128, 0)", "rgb(0, 128, 0)"],
 | 
| -                    ["rgb(255, 255, 0)", "rgb(255, 0, 0)", "rgb(0, 128, 0)"]];
 | 
| -
 | 
| -        var description = ["1. Test that cues are being matched properly by the class name",
 | 
| -                           "2. Test that cues are being matched properly by the ':future' pseudo class.", "", "",
 | 
| -                           "3. Test that cues are being matched properly by tag.",
 | 
| -                           "4. Test that cues are being matched properly by id.",
 | 
| -                           "5. Test that cues are being matched properly by the voice attribute."];
 | 
| -
 | 
| -        function seeked()
 | 
| -        {
 | 
| -            if (testEnded)
 | 
| -                return;
 | 
| -
 | 
| -            if (description[seekedCount] != "") {
 | 
| -                consoleWrite("<br>");
 | 
| -                consoleWrite(description[seekedCount]);
 | 
| -            }
 | 
| -
 | 
| -            cueNode = textTrackDisplayElement(video, 'cue').firstElementChild;
 | 
| -            testExpected("getComputedStyle(cueNode).color", info[seekedCount][0]);
 | 
| -            cueNode = cueNode.nextElementSibling;
 | 
| -            testExpected("getComputedStyle(cueNode).color", info[seekedCount][1]);
 | 
| -            cueNode = cueNode.nextElementSibling;
 | 
| -            testExpected("getComputedStyle(cueNode).color", info[seekedCount][2]);
 | 
| -
 | 
| -            if (++seekedCount == info.length)
 | 
| -                endTest();
 | 
| -            else {
 | 
| -                consoleWrite("");
 | 
| -                run("video.currentTime = " + seekTimes[seekedCount]);
 | 
| -            }
 | 
| -        }
 | 
| -
 | 
| -        function loaded()
 | 
| -        {
 | 
| -            findMediaElement();
 | 
| -            video.src = findMediaFile('video', '../content/test');
 | 
| -            video.id = "testvideo";
 | 
| -            waitForEvent('seeked', seeked);
 | 
| -            waitForEventOnce('canplaythrough', function() { video.currentTime = seekTimes[0]; });
 | 
| -        }
 | 
| -
 | 
| -        </script>
 | 
| -    </head>
 | 
| -    <body onload="loaded()">
 | 
| -        <video controls >
 | 
| -            <track src="captions-webvtt/styling.vtt" kind="captions" default>
 | 
| -        </video>
 | 
| -    </body>
 | 
| -</html>
 | 
| +<title>Test that cues are being matched properly by various CSS Selectors.</title>
 | 
| +<script src="../media-file.js"></script>
 | 
| +<script src="../media-controls.js"></script>
 | 
| +<script src="../../resources/testharness.js"></script>
 | 
| +<script src="../../resources/testharnessreport.js"></script>
 | 
| +<style>
 | 
| +video::cue(c) {color: purple}
 | 
| +video::cue(v) {color: yellow}
 | 
| +video::cue(v[voice="Mark"]) {color: red}
 | 
| +video::cue(v[voice="Nancy"]) {color: green}
 | 
| +video::cue(b) {color: lime}
 | 
| +video::cue(.red, .red2) { color:red }
 | 
| +video::cue(.green) { color:green }
 | 
| +video::cue(#testcue) {color: green}
 | 
| +video::cue(:future) {color: gray}
 | 
| +</style>
 | 
| +<video></video>
 | 
| +<script>
 | 
| +async_test(function(t) {
 | 
| +    var seekTimeIndex = 0;
 | 
| +    var seekTimes = [0.3, 0.5, 0.7, 0.9, 1.1, 1.3, 1.5];
 | 
| +
 | 
| +    var info = [["rgb(255, 0, 0)", "rgb(0, 128, 0)", "rgb(255, 0, 0)"],
 | 
| +                ["rgb(128, 0, 128)", "rgb(128, 128, 128)", "rgb(128, 128, 128)"],
 | 
| +                ["rgb(128, 0, 128)", "rgb(128, 0, 128)", "rgb(128, 128, 128)"],
 | 
| +                ["rgb(128, 0, 128)", "rgb(128, 0, 128)", "rgb(128, 0, 128)"],
 | 
| +                ["rgb(128, 0, 128)", "rgb(255, 255, 0)", "rgb(0, 255, 0)"],
 | 
| +                ["rgb(0, 128, 0)", "rgb(0, 128, 0)", "rgb(0, 128, 0)"],
 | 
| +                ["rgb(255, 255, 0)", "rgb(255, 0, 0)", "rgb(0, 128, 0)"]];
 | 
| +
 | 
| +    var video = document.querySelector("video");
 | 
| +    video.src = findMediaFile("video", "../content/test");
 | 
| +    
 | 
| +    var track = document.createElement("track");
 | 
| +    track.src = "captions-webvtt/styling.vtt";
 | 
| +    track.kind = "captions";
 | 
| +    track.default = true;
 | 
| +    video.appendChild(track);
 | 
| +
 | 
| +    video.onseeked = t.step_func(function() {
 | 
| +        assert_equals(video.currentTime, seekTimes[seekTimeIndex]);
 | 
| +        var cueNode = textTrackDisplayElement(video, "cue").firstElementChild;
 | 
| +        assert_equals(getComputedStyle(cueNode).color, info[seekTimeIndex][0]);
 | 
| +        cueNode = cueNode.nextElementSibling;
 | 
| +        assert_equals(getComputedStyle(cueNode).color, info[seekTimeIndex][1]);
 | 
| +        cueNode = cueNode.nextElementSibling;
 | 
| +        assert_equals(getComputedStyle(cueNode).color, info[seekTimeIndex][2]);
 | 
| +
 | 
| +        if (++seekTimeIndex == info.length)
 | 
| +            t.done();
 | 
| +        else
 | 
| +            video.currentTime = seekTimes[seekTimeIndex];
 | 
| +    });
 | 
| +    
 | 
| +    video.currentTime = seekTimes[seekTimeIndex];
 | 
| +});
 | 
| +</script>
 | 
| 
 |