Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(7)

Side by Side Diff: third_party/WebKit/LayoutTests/media/track/track-css-matching.html

Issue 1875923002: Convert track tests from video-test.js to testharness.js based (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: address comments Created 4 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <title>Test that cues are being matched properly by various CSS Selectors.</titl e>
3 <head> 3 <script src="../media-file.js"></script>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 4 <script src="../media-controls.js"></script>
5 <script src="../../resources/testharness.js"></script>
6 <script src="../../resources/testharnessreport.js"></script>
7 <style>
8 video::cue(c) {color: purple}
9 video::cue(v) {color: yellow}
10 video::cue(v[voice="Mark"]) {color: red}
11 video::cue(v[voice="Nancy"]) {color: green}
12 video::cue(b) {color: lime}
13 video::cue(.red, .red2) { color:red }
14 video::cue(.green) { color:green }
15 video::cue(#testcue) {color: green}
16 video::cue(:future) {color: gray}
17 </style>
18 <video></video>
19 <script>
20 async_test(function(t) {
21 var seekTimeIndex = 0;
22 var seekTimes = [0.3, 0.5, 0.7, 0.9, 1.1, 1.3, 1.5];
5 23
6 <script src=../media-file.js></script> 24 var info = [["rgb(255, 0, 0)", "rgb(0, 128, 0)", "rgb(255, 0, 0)"],
7 <!-- TODO(philipj): Convert test to testharness.js. crbug.com/588956 25 ["rgb(128, 0, 128)", "rgb(128, 128, 128)", "rgb(128, 128, 128)"] ,
8 (Please avoid writing new tests using video-test.js) --> 26 ["rgb(128, 0, 128)", "rgb(128, 0, 128)", "rgb(128, 128, 128)"],
9 <script src=../video-test.js></script> 27 ["rgb(128, 0, 128)", "rgb(128, 0, 128)", "rgb(128, 0, 128)"],
10 <script src=../media-controls.js></script> 28 ["rgb(128, 0, 128)", "rgb(255, 255, 0)", "rgb(0, 255, 0)"],
29 ["rgb(0, 128, 0)", "rgb(0, 128, 0)", "rgb(0, 128, 0)"],
30 ["rgb(255, 255, 0)", "rgb(255, 0, 0)", "rgb(0, 128, 0)"]];
11 31
12 <style> 32 var video = document.querySelector("video");
13 video::cue(c) {color: purple} 33 video.src = findMediaFile("video", "../content/test");
14 video::cue(v) {color: yellow} 34
15 video::cue(v[voice="Mark"]) {color: red} 35 var track = document.createElement("track");
16 video::cue(v[voice="Nancy"]) {color: green} 36 track.src = "captions-webvtt/styling.vtt";
17 video::cue(b) {color: lime} 37 track.kind = "captions";
18 video::cue(.red, .red2) { color:red } 38 track.default = true;
19 #testvideo::cue(.green) { color:green } 39 video.appendChild(track);
20 video::cue(#testcue) {color: green}
21 video::cue(:future) {color: gray}
22 </style>
23 40
24 <script> 41 video.onseeked = t.step_func(function() {
42 assert_equals(video.currentTime, seekTimes[seekTimeIndex]);
43 var cueNode = textTrackDisplayElement(video, "cue").firstElementChild;
44 assert_equals(getComputedStyle(cueNode).color, info[seekTimeIndex][0]);
45 cueNode = cueNode.nextElementSibling;
46 assert_equals(getComputedStyle(cueNode).color, info[seekTimeIndex][1]);
47 cueNode = cueNode.nextElementSibling;
48 assert_equals(getComputedStyle(cueNode).color, info[seekTimeIndex][2]);
25 49
26 var cueNode; 50 if (++seekTimeIndex == info.length)
27 var seekedCount = 0; 51 t.done();
28 var seekTimes = [0.3, 0.5, 0.7, 0.9, 1.1, 1.3, 1.5]; 52 else
29 53 video.currentTime = seekTimes[seekTimeIndex];
30 var info = [["rgb(255, 0, 0)", "rgb(0, 128, 0)", "rgb(255, 0, 0)"], 54 });
31 ["rgb(128, 0, 128)", "rgb(128, 128, 128)", "rgb(128, 128, 12 8)"], 55
32 ["rgb(128, 0, 128)", "rgb(128, 0, 128)", "rgb(128, 128, 128) "], 56 video.currentTime = seekTimes[seekTimeIndex];
33 ["rgb(128, 0, 128)", "rgb(128, 0, 128)", "rgb(128, 0, 128)"] , 57 });
34 ["rgb(128, 0, 128)", "rgb(255, 255, 0)", "rgb(0, 255, 0)"], 58 </script>
35 ["rgb(0, 128, 0)", "rgb(0, 128, 0)", "rgb(0, 128, 0)"],
36 ["rgb(255, 255, 0)", "rgb(255, 0, 0)", "rgb(0, 128, 0)"]];
37
38 var description = ["1. Test that cues are being matched properly by the class name",
39 "2. Test that cues are being matched properly by the ':future' pseudo class.", "", "",
40 "3. Test that cues are being matched properly by tag. ",
41 "4. Test that cues are being matched properly by id." ,
42 "5. Test that cues are being matched properly by the voice attribute."];
43
44 function seeked()
45 {
46 if (testEnded)
47 return;
48
49 if (description[seekedCount] != "") {
50 consoleWrite("<br>");
51 consoleWrite(description[seekedCount]);
52 }
53
54 cueNode = textTrackDisplayElement(video, 'cue').firstElementChild;
55 testExpected("getComputedStyle(cueNode).color", info[seekedCount][0] );
56 cueNode = cueNode.nextElementSibling;
57 testExpected("getComputedStyle(cueNode).color", info[seekedCount][1] );
58 cueNode = cueNode.nextElementSibling;
59 testExpected("getComputedStyle(cueNode).color", info[seekedCount][2] );
60
61 if (++seekedCount == info.length)
62 endTest();
63 else {
64 consoleWrite("");
65 run("video.currentTime = " + seekTimes[seekedCount]);
66 }
67 }
68
69 function loaded()
70 {
71 findMediaElement();
72 video.src = findMediaFile('video', '../content/test');
73 video.id = "testvideo";
74 waitForEvent('seeked', seeked);
75 waitForEventOnce('canplaythrough', function() { video.currentTime = seekTimes[0]; });
76 }
77
78 </script>
79 </head>
80 <body onload="loaded()">
81 <video controls >
82 <track src="captions-webvtt/styling.vtt" kind="captions" default>
83 </video>
84 </body>
85 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698