mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-27 14:52:16 +00:00
128 lines
3.8 KiB
HTML
128 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<!--
|
|
https://bugzilla.mozilla.org/show_bug.cgi?id=483573
|
|
-->
|
|
<head>
|
|
<title>HTML5 audio/video tests</title>
|
|
<link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
|
|
|
|
<script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
|
|
|
|
<script type="application/javascript"
|
|
src="../common.js"></script>
|
|
<script type="application/javascript"
|
|
src="../role.js"></script>
|
|
<script type="application/javascript"
|
|
src="../states.js"></script>
|
|
<script type="application/javascript"
|
|
src="../promisified-events.js"></script>
|
|
|
|
<script type="application/javascript">
|
|
|
|
async function loadAudioSource() {
|
|
/**
|
|
* Setting the source dynamically and wait for it to load,
|
|
* so we can test the accessibility tree of the control in its ready and
|
|
* stable state.
|
|
*
|
|
* See bug 1484048 comment 25 for discussion on how it switches UI when
|
|
* loading a statically declared source.
|
|
*/
|
|
const bufferA11yShown = waitForEvent(
|
|
EVENT_SHOW,
|
|
evt => evt.accessible.role == ROLE_TEXT_LEAF &&
|
|
evt.accessible.indexInParent == 2 &&
|
|
evt.accessible.parent.role == ROLE_STATUSBAR
|
|
);
|
|
await new Promise(resolve => {
|
|
let el = document.getElementById("audio");
|
|
el.addEventListener("canplaythrough", resolve, {once: true});
|
|
el.src = "../bug461281.ogg";
|
|
});
|
|
// Wait for this to be reflected in the a11y tree.
|
|
await bufferA11yShown;
|
|
|
|
// Give Fluent time to update the value of the scrubber asynchronously.
|
|
let scrubber = document.getElementById("audio")
|
|
.openOrClosedShadowRoot.getElementById("scrubber");
|
|
await SimpleTest.promiseWaitForCondition(() =>
|
|
scrubber.getAttribute("aria-valuetext") == "0:00 / 0:02");
|
|
|
|
doTest();
|
|
}
|
|
|
|
function doTest() {
|
|
// ////////////////////////////////////////////////////////////////////////
|
|
// test the accessible tree
|
|
|
|
var accTree = {
|
|
role: ROLE_GROUPING,
|
|
children: [
|
|
{ // start/stop button
|
|
role: ROLE_PUSHBUTTON,
|
|
name: "Play",
|
|
children: [],
|
|
},
|
|
{ // buffer bar
|
|
role: ROLE_STATUSBAR,
|
|
children: [
|
|
{
|
|
role: ROLE_TEXT_LEAF,
|
|
name: "Loading:",
|
|
},
|
|
{
|
|
role: ROLE_TEXT_LEAF,
|
|
name: " ",
|
|
},
|
|
{
|
|
role: ROLE_TEXT_LEAF,
|
|
// The name is the percentage buffered; e.g. "0%", "100%".
|
|
// We can't check it here because it might be different
|
|
// depending on browser caching.
|
|
},
|
|
],
|
|
},
|
|
{ // slider of progress bar
|
|
role: ROLE_SLIDER,
|
|
name: "Position",
|
|
value: "0:00 / 0:02",
|
|
children: [],
|
|
},
|
|
{ // mute button
|
|
role: ROLE_PUSHBUTTON,
|
|
name: "Mute",
|
|
children: [],
|
|
},
|
|
{ // slider of volume bar
|
|
role: ROLE_SLIDER,
|
|
children: [],
|
|
name: "Volume",
|
|
},
|
|
],
|
|
};
|
|
testAccessibleTree("audio", accTree);
|
|
|
|
SimpleTest.finish();
|
|
}
|
|
|
|
SimpleTest.waitForExplicitFinish();
|
|
addA11yLoadEvent(loadAudioSource);
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<a target="_blank"
|
|
title="Expose HTML5 video and audio elements' embedded controls through accessibility APIs"
|
|
href="https://bugzilla.mozilla.org/show_bug.cgi?id=483573">Mozilla Bug 483573</a>
|
|
<p id="display"></p>
|
|
<div id="content" style="display: none"></div>
|
|
<pre id="test">
|
|
</pre>
|
|
|
|
<audio id="audio" controls="true"></audio>
|
|
|
|
<div id="eventDump"></div>
|
|
</body>
|
|
</html>
|