OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
5 <title>Test closed caption button toggling.</title> | 5 <title>Test closed caption button toggling.</title> |
6 <script src=media-file.js></script> | 6 <script src=media-file.js></script> |
7 <script src=media-controls.js></script> | 7 <script src=media-controls.js></script> |
8 <script src=video-test.js></script> | 8 <script src=video-test.js></script> |
9 <script> | 9 <script> |
10 var captionsButtonElement; | |
11 var captionsButtonCoordinates; | |
12 var track; | 10 var track; |
13 | 11 |
14 function addTextTrackThroughJS() | 12 function addTextTrackThroughJS() |
15 { | 13 { |
16 consoleWrite(""); | 14 consoleWrite(""); |
17 consoleWrite("** Add a text track through JS to the video element **
"); | 15 consoleWrite("** Add a text track through JS to the video element **
"); |
18 var t = video.addTextTrack('captions', 'English', 'en'); | 16 var t = video.addTextTrack('captions', 'English', 'en'); |
19 t.addCue(new TextTrackCue(0.0, 10.0, 'Some random caption text')); | 17 t.addCue(new TextTrackCue(0.0, 10.0, 'Some random caption text')); |
20 } | 18 } |
21 | 19 |
(...skipping 16 matching lines...) Expand all Loading... |
38 } | 36 } |
39 | 37 |
40 function removeHTMLTrackElement() | 38 function removeHTMLTrackElement() |
41 { | 39 { |
42 consoleWrite(""); | 40 consoleWrite(""); |
43 consoleWrite("** Remove DOM node representing the track element **")
; | 41 consoleWrite("** Remove DOM node representing the track element **")
; |
44 var htmlTrack = video.children[0]; | 42 var htmlTrack = video.children[0]; |
45 video.removeChild(htmlTrack); | 43 video.removeChild(htmlTrack); |
46 } | 44 } |
47 | 45 |
48 function testClosedCaptionsButtonVisibility(expected) | 46 function checkCaptionsDisplay() |
49 { | 47 { |
50 try { | 48 // When no tracks are loaded, this should report no text track conta
iner, |
51 captionsButtonElement = mediaControlsElement(internals.shadowRoo
t(video).firstChild, "-webkit-media-controls-toggle-closed-captions-button"); | 49 // when tracks are loaded but not visible, should report no cues vis
ible, |
52 captionsButtonCoordinates = mediaControlsButtonCoordinates(video
, "toggle-closed-captions-button"); | 50 // when tracks are loaded and visible, should properly check the tex
t. |
53 } catch (exception) { | 51 testExpected("textTrackDisplayElement(video, 'display').innerText",
"Lorem"); |
54 consoleWrite("Failed to find a closed captions button or its coo
rdinates: " + exception); | |
55 if (expected) | |
56 failTest(); | |
57 return; | |
58 } | |
59 | |
60 consoleWrite(""); | |
61 if (expected == true) { | |
62 consoleWrite("** Caption button should be visible and enabled be
cause we have a captions track."); | |
63 testExpected("captionsButtonCoordinates[0]", 0, ">"); | |
64 testExpected("captionsButtonCoordinates[1]", 0, ">"); | |
65 testExpected("captionsButtonElement.disabled", false); | |
66 } else { | |
67 consoleWrite("** Caption button should not be visible as there a
re no caption tracks."); | |
68 testExpected("captionsButtonCoordinates[0]", 0, "<="); | |
69 testExpected("captionsButtonCoordinates[1]", 0, "<="); | |
70 } | |
71 } | 52 } |
72 | 53 |
73 function startTest() | 54 function startTest() |
74 { | 55 { |
75 if (!window.eventSender) { | 56 if (!window.eventSender) { |
76 consoleWrite("No eventSender found."); | 57 consoleWrite("No eventSender found."); |
77 failTest(); | 58 failTest(); |
78 } | 59 } |
79 | 60 |
80 findMediaElement(); | 61 findMediaElement(); |
81 testClosedCaptionsButtonVisibility(true); | 62 testClosedCaptionsButtonVisibility(true); |
82 | 63 |
83 consoleWrite(""); | 64 consoleWrite(""); |
84 consoleWrite("** The captions track should be listed in textTracks,
but not yet loaded. **"); | 65 consoleWrite("** The captions track should be listed in textTracks,
but not yet loaded. **"); |
85 testExpected("video.textTracks.length", 1); | 66 testExpected("video.textTracks.length", 1); |
86 testExpected("video.textTracks[0].mode", "disabled"); | 67 testExpected("video.textTracks[0].mode", "disabled"); |
87 checkCaptionsDisplay(); | 68 checkCaptionsDisplay(); |
88 | 69 |
89 consoleWrite(""); | 70 consoleWrite(""); |
90 consoleWrite("** Captions track should load and captions should beco
me visible after button is clicked **"); | 71 consoleWrite("** Captions track should load and captions should beco
me visible after button is clicked **"); |
| 72 |
| 73 // Note: the test flow continues with "testCCButtonToggling" when th
e |
| 74 // "load" event of the single TextTrack fires up. While the test str
ucture |
| 75 // might seem weird, this avoids timeouts. |
91 clickCCButton(); | 76 clickCCButton(); |
92 } | 77 } |
93 | 78 |
94 function clickCCButton() | 79 function testCCButtonToggling() |
95 { | |
96 consoleWrite("*** Click the CC button."); | |
97 eventSender.mouseMoveTo(captionsButtonCoordinates[0], captionsButton
Coordinates[1]); | |
98 eventSender.mouseDown(); | |
99 eventSender.mouseUp(); | |
100 } | |
101 | |
102 function checkCaptionsDisplay() | |
103 { | |
104 // When no tracks are loaded, this should report no text track conta
iner, | |
105 // when tracks are loaded but not visible, should report no cues vis
ible, | |
106 // when tracks are loaded and visible, should properly check the tex
t. | |
107 testExpected("textTrackDisplayElement(video, 'display').innerText",
"Lorem"); | |
108 } | |
109 | |
110 function trackLoaded() | |
111 { | 80 { |
112 checkCaptionsDisplay(); | 81 checkCaptionsDisplay(); |
113 | 82 |
114 consoleWrite(""); | 83 consoleWrite(""); |
115 consoleWrite("** Captions should not be visible after button is clic
ked again **"); | 84 consoleWrite("** Captions should not be visible after button is clic
ked again **"); |
116 clickCCButton(); | 85 clickCCButton(); |
117 checkCaptionsDisplay(); | 86 checkCaptionsDisplay(); |
118 | 87 |
119 removeHTMLTrackElement(); | 88 removeHTMLTrackElement(); |
120 testClosedCaptionsButtonVisibility(false); | 89 testClosedCaptionsButtonVisibility(false); |
121 | 90 |
122 addUnloadableHTMLTrackElement(); | 91 addUnloadableHTMLTrackElement(); |
123 testClosedCaptionsButtonVisibility(true); | 92 testClosedCaptionsButtonVisibility(true); |
124 | 93 |
125 consoleWrite(""); | 94 consoleWrite(""); |
126 clickCCButton(); | 95 clickCCButton(); |
127 } | 96 } |
128 | 97 |
129 function trackError() | 98 function trackError() |
130 { | 99 { |
131 consoleWrite("** Track failed to load **"); | 100 consoleWrite("** Track failed to load **"); |
132 testClosedCaptionsButtonVisibility(false); | 101 testClosedCaptionsButtonVisibility(false); |
133 | 102 |
134 addTextTrackThroughJS(); | 103 addTextTrackThroughJS(); |
135 testClosedCaptionsButtonVisibility(true); | 104 testClosedCaptionsButtonVisibility(true); |
136 | 105 |
137 endTest(); | 106 endTest(); |
138 } | 107 } |
139 | 108 |
140 | |
141 function loaded() | 109 function loaded() |
142 { | 110 { |
143 findMediaElement(); | 111 findMediaElement(); |
144 consoleWrite("Set the user language preference so that the track wil
l be chosen when the CC button is clicked."); | |
145 run("internals.setUserPreferredLanguages(['en'])"); | |
146 | |
147 waitForEvent('canplaythrough', startTest); | 112 waitForEvent('canplaythrough', startTest); |
148 | 113 |
149 video.src = findMediaFile('video', 'content/counting'); | 114 video.src = findMediaFile('video', 'content/counting'); |
150 } | 115 } |
151 </script> | 116 </script> |
152 </head> | 117 </head> |
153 <body onload="loaded()"> | 118 <body onload="loaded()"> |
154 <p>Tests that the closed captions button, when toggled, updates the text tra
ck display area.</p> | 119 <p>Tests that the closed captions button, when toggled, updates the text tra
ck display area.</p> |
155 <video controls > | 120 <video controls> |
156 <track src="track/captions-webvtt/captions-fast.vtt" kind="captions" src
lang="en" onload="trackLoaded()"> | 121 <track src="track/captions-webvtt/captions-fast.vtt" kind="captions" onl
oad="testCCButtonToggling()"> |
157 </video> | 122 </video> |
158 | |
159 </body> | 123 </body> |
160 </html> | 124 </html> |
OLD | NEW |