OLD | NEW |
---|---|
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <title>Test that TextTrack's cues are rendered correctly when the snap to lines flag is not set.</title> |
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 <video> | |
8 <track src="captions-webvtt/captions-snap-to-lines-not-set.vtt" kind="captio ns" default> | |
9 </video> | |
10 <script> | |
11 async_test(function(t) { | |
12 var video = document.querySelector("video"); | |
13 var testTrack = document.querySelector("track"); | |
14 video.src = findMediaFile("video", "../content/test"); | |
5 | 15 |
6 <script src=../media-file.js></script> | 16 // In Chromium it is the enclosure element, which provides the controls heig ht, otherwise the panel; |
7 <!-- TODO(philipj): Convert test to testharness.js. crbug.com/588956 | 17 // both are the second child in the shadow DOM. |
8 (Please avoid writing new tests using video-test.js) --> | 18 var controlsPanelElement = internals.shadowRoot(video).firstChild.firstChild ; |
9 <script src=../video-test.js></script> | |
10 <script src=../media-controls.js></script> | |
11 | 19 |
12 <script> | 20 var cueDisplayContainer; |
21 video.oncanplaythrough = t.step_func(function() { | |
22 cueDisplayContainer = textTrackDisplayElement(video); | |
23 runNextTestCase(); | |
24 }); | |
13 | 25 |
14 var testTrack; | 26 var seekTimeIndex = 0; |
15 var cueDisplayElement; | 27 var testCaseSeekTime = [ |
16 var cueDisplayContainer; | 28 0.10, |
17 var controlsPanelElement; | 29 0.60, |
18 var seekedCount = 0; | 30 1.10, |
31 1.60, | |
32 2.10, | |
33 2.60, | |
34 3.10, | |
35 4.10 | |
36 ]; | |
37 var cueRenderingPosition = [ | |
Srirama
2016/04/25 11:13:23
Right now these cue rendering position values are
| |
38 // Number of active cues 1. | |
39 [[0 ,100, "middle"]], | |
40 [[0, 50, "middle"]], | |
41 [[0, 0, "start"]], | |
42 [[0, 0, "end"]], | |
43 [[0, 100, "right"]], | |
44 [[0, 100, "left"]], | |
45 [[0, 50, "middle"]], | |
46 [ //Number of active cues 7. | |
47 [0, 50, "middle"], | |
48 [0, 0, "start"], | |
49 [0, 0, "end"], | |
50 [0, 100, "middle"], | |
51 [0, 25, "end"], | |
52 [44, 33, "start"], | |
53 [23, 55, "start"] | |
54 ] | |
55 ]; | |
56 function runNextTestCase() { | |
57 if (seekTimeIndex == testCaseSeekTime.length) | |
58 t.done(); | |
19 | 59 |
20 var testCaseDescription = [ | 60 video.currentTime = testCaseSeekTime[seekTimeIndex]; |
21 "Default", | 61 video.onseeked = t.step_func(seeked); |
22 "Center", | 62 } |
23 "Top left", | |
24 "Top right", | |
25 "Bottom right", | |
26 "Bottom left", | |
27 "Bottom center", | |
28 "Multiple cues" | |
29 ]; | |
30 | 63 |
31 var testCaseSeekTime = [ | 64 function seeked() { |
32 0.10, | 65 var cuePosition = cueRenderingPosition[seekTimeIndex]; |
33 0.60, | 66 for (var i = 0; i < testTrack.track.activeCues.length; ++i) { |
34 1.10, | 67 cueDisplayElement = textTrackDisplayElement(video, "display", i); |
35 1.60, | |
36 2.10, | |
37 2.60, | |
38 3.10, | |
39 4.10 | |
40 ]; | |
41 | 68 |
42 var currentTestCase = 0; | 69 assert_equals(cueDisplayElement.innerText, testTrack.track.activeCue s[i].text); |
70 assert_equals(testTrack.track.activeCues[i].align, cuePosition[i][2] ); | |
43 | 71 |
44 function seeked() | 72 assert_equals(Math.round(cueDisplayElement.offsetLeft / cueDisplayCo ntainer.offsetWidth * 100), cuePosition[i][0]); |
45 { | 73 assert_equals(Math.round(cueDisplayElement.offsetTop / cueDisplayCon tainer.offsetHeight * 100), cuePosition[i][1]); |
46 consoleWrite("Active cues: " + testTrack.track.activeCues.length); | |
47 for (var i = 0; i < testTrack.track.activeCues.length; ++i) { | |
48 cueDisplayElement = textTrackDisplayElement(video, 'display', i) ; | |
49 | |
50 consoleWrite(""); | |
51 consoleWrite("* Cue " + i + " *"); | |
52 testExpected("cueDisplayElement.innerText", testTrack.track.acti veCues[i].text); | |
53 consoleWrite("Cue alignment (default or as specified): " + testT rack.track.activeCues[i].align); | |
54 | |
55 consoleWrite("Cue left position (percentage): " + Math.round(cue DisplayElement.offsetLeft / cueDisplayContainer.offsetWidth * 100)); | |
56 consoleWrite("Cue top position (percentage): " + Math.round(cueD isplayElement.offsetTop / cueDisplayContainer.offsetHeight * 100)); | |
57 } | |
58 | |
59 runNextTestCase(); | |
60 }; | |
61 | |
62 function runNextTestCase() | |
63 { | |
64 if (currentTestCase == testCaseDescription.length) { | |
65 endTest(); | |
66 return; | |
67 } | |
68 | |
69 consoleWrite(""); | |
70 consoleWrite("** " + testCaseDescription[currentTestCase] + " **"); | |
71 | |
72 video.currentTime = testCaseSeekTime[currentTestCase]; | |
73 waitForEvent('seeked', seeked, false, true); | |
74 | |
75 currentTestCase++; | |
76 } | 74 } |
77 | 75 |
78 function loaded() | 76 seekTimeIndex++; |
79 { | 77 runNextTestCase(); |
80 consoleWrite("Test that TextTrack's cues are rendered correctly when the snap to lines flag is not set."); | 78 } |
81 | 79 }); |
82 findMediaElement(); | 80 </script> |
83 testTrack = document.querySelector('track'); | |
84 video.src = findMediaFile('video', '../content/test'); | |
85 | |
86 // In Chromium it is the enclosure element, which provides the contr ols height, otherwise the panel; | |
87 // both are the second child in the shadow DOM. | |
88 controlsPanelElement = internals.shadowRoot(video).firstChild.firstC hild; | |
89 | |
90 waitForEventOnce('canplaythrough', function() { | |
91 cueDisplayContainer = textTrackDisplayElement(video); | |
92 runNextTestCase(); | |
93 }); | |
94 } | |
95 | |
96 </script> | |
97 </head> | |
98 <body onload="loaded()"> | |
99 <video controls> | |
100 <track src="captions-webvtt/captions-snap-to-lines-not-set.vtt" kind ="captions" default> | |
101 </video> | |
102 </body> | |
103 </html> | |
OLD | NEW |