gecko-dev/toolkit/content/tests/chrome/test_popup_keys.xhtml

145 строки
4.3 KiB
HTML

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
<?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css" type="text/css"?>
<window title="Menu ignorekeys Test"
onkeydown="keyDown()" onkeypress="gKeyPressCount++; event.stopPropagation(); event.preventDefault();"
onload="runTests();"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
<script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
<!--
This test checks that the ignorekeys attribute can be used on a menu to
disable key navigation. The test is performed twice by opening the menu,
simulating a cursor down key, and closing the popup. When keys are enabled,
the first item on the menu should be highlighted, otherwise the first item
should not be highlighted.
-->
<menupopup id="popup">
<menuitem id="i1" label="One" onDOMAttrModified="attrModified(event)"/>
<menuitem id="i2" label="Two"/>
<menuitem id="i3" label="Three"/>
<menuitem id="i4" label="Four"/>
</menupopup>
<script class="testbody" type="application/javascript">
<![CDATA[
SimpleTest.waitForExplicitFinish();
var gIgnoreKeys = false;
var gIgnoreAttrChange = false;
var gKeyPressCount = 0;
function waitForEvent(target, eventName) {
return new Promise(resolve => {
target.addEventListener(eventName, function eventOccurred(event) {
target.removeEventListener(eventName, eventOccurred, false);
resolve();
}, false);
});
}
function runTests()
{
(async function() {
var popup = $("popup");
is(popup.hasAttribute("ignorekeys"), false, "keys enabled");
let popupShownPromise = waitForEvent(popup, "popupshown");
popup.openPopup(null, "after_start");
await popupShownPromise;
let popupHiddenPromise = waitForEvent(popup, "popuphidden");
synthesizeKey("KEY_ArrowDown");
await popupHiddenPromise;
is(gKeyPressCount, 0, "keypresses with ignorekeys='false'");
gIgnoreKeys = true;
popup.setAttribute("ignorekeys", "true");
// clear this first to avoid confusion
gIgnoreAttrChange = true;
$("i1").removeAttribute("_moz-menuactive")
gIgnoreAttrChange = false;
popupShownPromise = waitForEvent(popup, "popupshown");
popup.openPopup(null, "after_start");
await popupShownPromise;
synthesizeKey("KEY_ArrowDown");
await new Promise(resolve => setTimeout(() => resolve(), 1000));
popupHiddenPromise = waitForEvent(popup, "popuphidden");
popup.hidePopup();
await popupHiddenPromise;
is(gKeyPressCount, 1, "keypresses with ignorekeys='true'");
popup.setAttribute("ignorekeys", "shortcuts");
// clear this first to avoid confusion
gIgnoreAttrChange = true;
$("i1").removeAttribute("_moz-menuactive")
gIgnoreAttrChange = false;
popupShownPromise = waitForEvent(popup, "popupshown");
popup.openPopup(null, "after_start");
await popupShownPromise;
// When ignorekeys="shortcuts", T should be handled but accel+T should propagate.
sendString("t");
is(gKeyPressCount, 1, "keypresses after t pressed with ignorekeys='shortcuts'");
synthesizeKey("t", { accelKey: true });
is(gKeyPressCount, 2, "keypresses after accel+t pressed with ignorekeys='shortcuts'");
popupHiddenPromise = waitForEvent(popup, "popuphidden");
popup.hidePopup();
await popupHiddenPromise;
SimpleTest.finish();
})();
}
function attrModified(event)
{
if (gIgnoreAttrChange || event.attrName != "_moz-menuactive")
return;
// the attribute should not be changed when ignorekeys is enabled
if (gIgnoreKeys) {
ok(false, "move key with keys disabled");
}
else {
is($("i1").getAttribute("_moz-menuactive"), "true", "move key with keys enabled");
$("popup").hidePopup();
}
}
function keyDown()
{
// when keys are enabled, the menu should have stopped propagation of the
// event, so a bubbling listener for a keydown event should only occur
// when keys are disabled.
ok(gIgnoreKeys, "key listener fired with keys " +
(gIgnoreKeys ? "disabled" : "enabled"));
}
]]>
</script>
<body xmlns="http://www.w3.org/1999/xhtml">
<p id="display">
</p>
<div id="content" style="display: none">
</div>
<pre id="test">
</pre>
</body>
</window>