| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
| <title>Test closed caption button toggling.</title> |
| <script src=media-file.js></script> |
| <script src=media-controls.js></script> |
| <script src=video-test.js></script> |
| <script> |
| var track; |
| |
| function addTextTrackThroughJS() |
| { |
| consoleWrite(""); |
| consoleWrite("** Add a text track through JS to the video element **"); |
| var t = video.addTextTrack('captions', 'English', 'en'); |
| t.addCue(new VTTCue(0.0, 10.0, 'Some random caption text')); |
| } |
| |
| function addUnloadableHTMLTrackElement() |
| { |
| consoleWrite(""); |
| consoleWrite("** Add non-default text track through HTML with unloadable URI **"); |
| |
| track = document.createElement("track"); |
| track.setAttribute("kind", "captions"); |
| track.setAttribute("srclang", "en"); |
| track.setAttribute("src", "invalid.vtt"); |
| |
| track.addEventListener("error", trackError); |
| |
| video.appendChild(track); |
| testExpected("track.readyState", HTMLTrackElement.NONE); |
| testExpected("track.track.mode", "disabled"); |
| testExpected("video.textTracks.length", 1); |
| } |
| |
| function removeHTMLTrackElement() |
| { |
| consoleWrite(""); |
| consoleWrite("** Remove DOM node representing the track element **"); |
| var htmlTrack = video.children[0]; |
| video.removeChild(htmlTrack); |
| } |
| |
| function checkCaptionsDisplay() |
| { |
| // When no tracks are loaded, this should report no text track container, |
| // when tracks are loaded but not visible, should report no cues visible, |
| // when tracks are loaded and visible, should properly check the text. |
| testExpected("textTrackDisplayElement(video, 'display').innerText", "Lorem"); |
| } |
| |
| function startTest() |
| { |
| if (!window.eventSender) { |
| consoleWrite("No eventSender found."); |
| failTest(); |
| } |
| |
| findMediaElement(); |
| testClosedCaptionsButtonVisibility(true); |
| |
| consoleWrite(""); |
| consoleWrite("** The captions track should be listed in textTracks, but not yet loaded. **"); |
| testExpected("video.textTracks.length", 1); |
| testExpected("video.textTracks[0].mode", "disabled"); |
| checkCaptionsDisplay(); |
| |
| consoleWrite(""); |
| consoleWrite("** Captions track should load and captions should become visible after button is clicked **"); |
| |
| // Note: the test flow continues with "testCCButtonToggling" when the |
| // "load" event of the single TextTrack fires up. While the test structure |
| // might seem weird, this avoids timeouts. |
| clickCCButton(); |
| } |
| |
| function testCCButtonToggling() |
| { |
| checkCaptionsDisplay(); |
| |
| consoleWrite(""); |
| consoleWrite("** Captions should not be visible after button is clicked again **"); |
| clickCCButton(); |
| checkCaptionsDisplay(); |
| |
| removeHTMLTrackElement(); |
| testClosedCaptionsButtonVisibility(false); |
| |
| addUnloadableHTMLTrackElement(); |
| testClosedCaptionsButtonVisibility(true); |
| |
| consoleWrite(""); |
| clickCCButton(); |
| } |
| |
| function trackError() |
| { |
| consoleWrite("** Track failed to load **"); |
| testClosedCaptionsButtonVisibility(false); |
| |
| addTextTrackThroughJS(); |
| testClosedCaptionsButtonVisibility(true); |
| |
| endTest(); |
| } |
| |
| function loaded() |
| { |
| findMediaElement(); |
| waitForEvent('canplaythrough', startTest); |
| |
| video.src = findMediaFile('video', 'content/counting'); |
| } |
| </script> |
| </head> |
| <body onload="loaded()"> |
| <p>Tests that the closed captions button, when toggled, updates the text track display area.</p> |
| <video controls> |
| <track src="track/captions-webvtt/captions-fast.vtt" kind="captions" onload="testCCButtonToggling()"> |
| </video> |
| </body> |
| </html> |