Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-11-24 13:21:05 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1765615 - Improve browser_treeupdate_csscontentvisibility.js. r=Jamie

Browse Source 
Extend a bit the test for dynamic changes to content-visibility, adding
the following checks:

* If there are text descendants in the content-visibility subtree,
  make sure they are created when switching to auto ; and removed
  when switching back to hidden.
* If there is a content-visibility: hidden or a visibility: hidden
  descendant, make sure pruning still applies when switching to
  auto.
* If there is a shadow host in the  content-visibility subtree,
  make sure that shadow subtree is properly updated when
  content-visibility changes.

Differential Revision: https://phabricator.services.mozilla.com/D196964
This commit is contained in:
Frédéric Wang 2024-01-10 09:26:17 +00:00
parent 9576894912
commit 01d8813ff7
1 changed files with 45 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
accessible/tests/browser/e10s/browser_treeupdate_csscontentvisibility.js
View File

@ -31,11 +31,22 @@ const snippet = `
.auto { .auto {
content-visibility: auto; content-visibility: auto;
} }
#hidden-subtree-2 {
visibility: hidden;
}
</style> </style>
<div class="hidden" id="target"> <div class="hidden" id="target">
<div id="child"></div> <div id="child">A</div>
<div id="content-child"></div> <div id="content-child">B</div>
<div id="hidden-subtree-1" class="hidden">C</div>
<div id="hidden-subtree-2">D</div>
<div id="shadow-host"></div>
</div> </div>
<script>
const host = document.querySelector("#shadow-host");
const shadowRoot = host.attachShadow({ mode: "open" });
shadowRoot.innerHTML = "<div id='shadowDiv'>E</div>";
</script>
`; `;
add_setup(async function () { add_setup(async function () {
@ -44,28 +55,50 @@ add_setup(async function () {
}); });
}); });
async function setContentVisibility(browser, id, value) { async function setContentVisibility(browser, value) {
let onReorder = waitForEvent(EVENT_REORDER, id); let mutationPromise = (() => {
switch (value) {
case "hidden":
return waitForEvent(EVENT_REORDER, "target");
case "auto":
return waitForEvents({
expected: [
[EVENT_REORDER, "child"],
[EVENT_REORDER, "content-child"],
[EVENT_REORDER, "shadowDiv"],
[EVENT_REORDER, "target"],
],
});
default:
throw new Error(`unexpected content-visibility: ${value}`);
}
})();
// Change the value of `content-visibility` property for the target // Change the value of `content-visibility` property for the target
info(`Setting content-visibility: ${value} on ${id}`); info(`Setting content-visibility: ${value}`);
await invokeSetAttribute(browser, id, "class", value); await invokeSetAttribute(browser, "target", "class", value);
await onReorder; await mutationPromise;
} }
addAccessibleTask( addAccessibleTask(
snippet, snippet,
async function (browser, accDoc) { async function (browser, accDoc) {
const targetId = "target"; const target = findAccessibleChildByID(accDoc, "target");
const target = findAccessibleChildByID(accDoc, targetId);
info("Initial Accessibility Structure Test"); info("Initial Accessibility Structure Test");
testAccessibleTree(target, { SECTION: [] }); testAccessibleTree(target, { SECTION: [] });
await setContentVisibility(browser, targetId, "auto"); await setContentVisibility(browser, "auto");
testAccessibleTree(target, { SECTION: [{ SECTION: [] }, { SECTION: [] }] }); testAccessibleTree(target, {
SECTION: [
{ SECTION: [{ TEXT_LEAF: [] }] } /* child */,
{ SECTION: [{ TEXT_LEAF: [] }] } /* content-child */,
{ SECTION: [] } /* hidden-subtree-1 */,
{ SECTION: [{ SECTION: [{ TEXT_LEAF: [] }] }] } /* shadow-host */,
],
});
await setContentVisibility(browser, targetId, "hidden"); await setContentVisibility(browser, "hidden");
testAccessibleTree(target, { SECTION: [] }); testAccessibleTree(target, { SECTION: [] });
}, },
{ iframe: true, remoteIframe: true, chrome: true } { iframe: true, remoteIframe: true, chrome: true }