diff options
Diffstat (limited to '')
-rw-r--r-- | toolkit/content/tests/widgets/test_videocontrols_closed_caption_menu.html | 144 |
1 files changed, 144 insertions, 0 deletions
diff --git a/toolkit/content/tests/widgets/test_videocontrols_closed_caption_menu.html b/toolkit/content/tests/widgets/test_videocontrols_closed_caption_menu.html new file mode 100644 index 0000000000..39d6ff494f --- /dev/null +++ b/toolkit/content/tests/widgets/test_videocontrols_closed_caption_menu.html @@ -0,0 +1,144 @@ +<!DOCTYPE HTML> +<html> +<head> + <title>Video controls test - KeyHandler</title> + <script src="/tests/SimpleTest/SimpleTest.js"></script> + <script src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="head.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" /> +</head> +<body> +<p id="display"></p> + +<div id="content"> + <video id="video" controls preload="auto"> + <track + id="track1" + kind="subtitles" + label="[test] en" + srclang="en" + src="test-webvtt-1.vtt" + /> + <track + id="track2" + kind="subtitles" + label="[test] fr" + srclang="fr" + src="test-webvtt-2.vtt" + /> + </video> +</div> + +<pre id="test"> +<script class="testbody" type="application/javascript"> + SimpleTest.waitForExplicitFinish(); + const video = document.getElementById("video"); + const closedCaptionButton = getElementWithinVideo(video, "closedCaptionButton"); + const fullscreenButton = getElementWithinVideo(video, "fullscreenButton"); + const textTrackList = getElementWithinVideo(video, "textTrackList"); + const textTrackListContainer = getElementWithinVideo(video, "textTrackListContainer"); + + function isClosedCaptionVisible() { + return !textTrackListContainer.hidden; + } + + // Setup video + tests.push(done => { + SpecialPowers.pushPrefEnv({"set": [ + ["media.cache_size", 40000], + ["media.videocontrols.keyboard-tab-to-all-controls", true], + ]}, done); + }, done => { + video.src = "seek_with_sound.ogg"; + video.addEventListener("loadedmetadata", done); + }, cleanup); + + tests.push(done => { + info("Opening the CC menu should focus the first item in the menu"); + info("Focusing and clicking the closed caption button"); + closedCaptionButton.focus(); + synthesizeKey(" "); + ok(isClosedCaptionVisible(), "The CC menu is visible"); + ok(textTrackList.firstChild.matches(":focus"), "The first item in CC menu should be in focus"); + done(); + }); + + tests.push(done => { + info("aria-expanded should be reflected whether the CC menu is open or not"); + ok(closedCaptionButton.getAttribute("aria-expanded") === "false", "Closed CC menu has aria-expanded set to false"); + info("Focusing and clicking the closed caption button"); + closedCaptionButton.focus(); + synthesizeKey(" "); + ok(isClosedCaptionVisible(), "The CC menu is visible"); + ok(closedCaptionButton.getAttribute("aria-expanded") === "true", "Open CC menu has aria-expanded set to true"); + done(); + }); + + tests.push(done => { + info("If CC menu is open, then arrow keys should navigate menu"); + info("Opening the CC menu"); + closedCaptionButton.focus(); + synthesizeKey(" "); + ok(textTrackList.firstChild.matches(":focus"), "The first item in CC menu should be in focus first"); + info("Pressing down arrow"); + synthesizeKey("KEY_ArrowDown"); + ok(textTrackList.children[1].matches(":focus"), "The second item in CC menu should now be in focus"); + info("Pressing up arrow"); + synthesizeKey("KEY_ArrowUp"); + ok(textTrackList.firstChild.matches(":focus"), "The first item in CC menu should be back in focus again"); + done(); + }); + + tests.push(done => { + info("Escape should close the CC menu"); + info("Opening the CC menu"); + closedCaptionButton.focus(); + synthesizeKey(" "); + info("Pressing Escape key"); + synthesizeKey("KEY_Escape"); + ok(closedCaptionButton.matches(":focus"), "The CC button should be in focus"); + ok(!isClosedCaptionVisible(), "The CC menu should be closed"); + done(); + }); + + tests.push(done => { + info("Tabbing away should close the CC menu"); + info("Opening the CC menu"); + closedCaptionButton.focus(); + synthesizeKey(" "); + info("Pressing Tab key 3x"); + synthesizeKey("KEY_Tab"); + synthesizeKey("KEY_Tab"); + synthesizeKey("KEY_Tab"); + ok(fullscreenButton.matches(":focus"), "The fullscreen button should be in focus"); + ok(!isClosedCaptionVisible(), "The CC menu should be closed"); + done(); + }); + + tests.push(done => { + info("Shift + Tabbing away should close the CC menu"); + info("Opening the CC menu"); + closedCaptionButton.focus(); + synthesizeKey(" "); + info("Pressing Shift + Tab key"); + synthesizeKey("KEY_Tab", { shiftKey: true }); + ok(closedCaptionButton.matches(":focus"), "The CC button should be in focus"); + ok(!isClosedCaptionVisible(), "The CC menu should be closed"); + done(); + }); + + function cleanup(done) { + if (isClosedCaptionVisible()) { + closedCaptionButton.click(); + } + done(); + } + // add cleanup after every test + tests = tests.reduce((a, v) => a.concat([v, cleanup]), []); + + tests.push(SimpleTest.finish); + window.addEventListener("load", executeTests); +</script> +</pre> +</body> +</html> |