<!DOCTYPE html>
<link rel=author href="mailto:[email protected]">
<link rel=help href="https://bugs.chromium.org/p/chromium/issues/detail?id=1295437">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
.displaynone {
display: none;
}
.cvauto {
content-visibility: auto;
}
.spacer {
height: 6000px;
}
</style>
<div id=spacer class="displaynone spacer">spacer</div>
<div id=displaynone class=displaynone>
<div id=cvauto class=cvauto>
<div id=target>hello world</div>
<div>
</div>
<script>
test(() => {
assert_equals(undefined, accessibilityController.accessibleElementById('target'), 'first check');
// Toggle display:none and make sure the results are still as expected.
displaynone.classList.remove('displaynone');
assert_false(accessibilityController.accessibleElementById('target').isIgnored, 'removed display:none');
displaynone.classList.add('displaynone');
assert_equals(undefined, accessibilityController.accessibleElementById('target'), 're-added display:none');
// Toggle content-visibility:auto and make sure the results are still as expected.
cvauto.classList.remove('cvauto');
assert_equals(undefined, accessibilityController.accessibleElementById('target'), 'removed content-visibility:auto');
cvauto.classList.add('cvauto');
assert_equals(undefined, accessibilityController.accessibleElementById('target'), 're-added content-visibility:auto');
// Scroll the content out of the viewport and make sure the results are still as expected.
spacer.classList.remove('displaynone');
assert_equals(undefined, accessibilityController.accessibleElementById('target'), 're-added content-visibility:auto');
}, `Verifies that display:none elements can't have children in the accessibility tree due to content-visibility:auto.`);
</script>