blob: 763c4da85ac00f5f10bcad217334465802192e28 [file] [log] [blame]
<html>
<head>
<script src="../resources/js-test.js"></script>
<script src="../resources/accessibility-helper.js"></script>
</head>
<body>
<select id="select" value="Select"></select>
<div id="slider" tabindex="0" role="slider" aria-valuenow="5">Slider</div>
<script>
description("This tests that a notification listener on an element only listens to that one element, and that a global notification listener listens to all notifications.");
if (window.accessibilityController) {
window.jsTestIsAsync = true;
setTimeout(async () => {
window.selectNotificationCount = 0;
window.sliderNotificationCount = 0;
window.globalNotificationCount = 0;
let select = await waitForElementById("select");
select.addNotificationListener((notification) => {
selectNotificationCount++;
debug(`SELECT ${notification}`);
});
let slider = accessibilityController.accessibleElementById("slider");
slider.addNotificationListener((notification) => {
sliderNotificationCount++;
debug(`SLIDER ${notification}`);
});
accessibilityController.addNotificationListener((element, notification) => {
if (element.isEqual(slider) || element.isEqual(select)) {
globalNotificationCount++;
debug(`GLOBAL ${notification} on element with role ${element.role}`);
}
});
// This should trigger a "invalid status changed" notification on the select.
document.getElementById("select").setAttribute("aria-invalid", "true");
await expectAsyncExpression("selectNotificationCount", 1);
// This should trigger a "value changed" notification on the slider.
document.getElementById("slider").setAttribute("aria-valuenow", "6");
await expectAsyncExpression("sliderNotificationCount", 1);
await expectAsyncExpression("globalNotificationCount", 2);
accessibilityController.removeNotificationListener();
select.removeNotificationListener();
slider.removeNotificationListener();
finishJSTest();
}, 0);
}
</script>
</body>
</html>