blob: 52baabface7f07333aba814db872748c72e2cdef [file] [log] [blame]
<!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>