| <!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 captionsButtonElement; |
| var captionsButtonCoordinates; |
| 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 testClosedCaptionsButtonVisibility(expected) |
| { |
| try { |
| captionsButtonElement = mediaControlsElement(internals.shadowRoot(video).firstChild, "-webkit-media-controls-toggle-closed-captions-button"); |
| captionsButtonCoordinates = mediaControlsButtonCoordinates(video, "toggle-closed-captions-button"); |
| } catch (exception) { |
| consoleWrite("Failed to find a closed captions button or its coordinates: " + exception); |
| if (expected) |
| failTest(); |
| return; |
| } |
| |
| consoleWrite(""); |
| if (expected == true) { |
| consoleWrite("** Caption button should be visible and enabled because we have a captions track."); |
| testExpected("captionsButtonCoordinates[0]", 0, ">"); |
| testExpected("captionsButtonCoordinates[1]", 0, ">"); |
| testExpected("captionsButtonElement.disabled", false); |
| } else { |
| consoleWrite("** Caption button should not be visible as there are no caption tracks."); |
| testExpected("captionsButtonCoordinates[0]", 0, "<="); |
| testExpected("captionsButtonCoordinates[1]", 0, "<="); |
| } |
| } |
| |
| 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 **"); |
| clickCCButton(); |
| } |
| |
| function clickCCButton() |
| { |
| consoleWrite("*** Click the CC button."); |
| eventSender.mouseMoveTo(captionsButtonCoordinates[0], captionsButtonCoordinates[1]); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| } |
| |
| 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 trackLoaded() |
| { |
| 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(); |
| consoleWrite("Set the user language preference so that the track will be chosen when the CC button is clicked."); |
| run("internals.setUserPreferredLanguages(['en'])"); |
| |
| 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" srclang="en" onload="trackLoaded()"> |
| </video> |
| |
| </body> |
| </html> |