forked from mirrors/gecko-dev
fa6bbac3f5
Files containing theora have been modified to use VP9 in WebM, which is equivalent for those tests, that only require a video with or without sound. Differential Revision: https://phabricator.services.mozilla.com/D204642
144 lines
4.7 KiB
HTML
144 lines
4.7 KiB
HTML
<!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.webm";
|
|
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>
|