gecko-dev/dom/base/test/test_find.html

126 строки
3.7 KiB
HTML

<!doctype html>
<meta charset="utf-8">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<body>
<script>
const t = async_test("Test window.find / nsFind");
function testFindable(isFindable, textToFind, buildDoc, description) {
try{
const iframe = document.querySelector("iframe")
iframe.contentDocument.documentElement.innerHTML =
(typeof buildDoc == "string") ? buildDoc : "";
if (typeof buildDoc == "function")
buildDoc(iframe.contentDocument);
iframe.contentWindow.getSelection().removeAllRanges();
assert_equals(
isFindable,
iframe.contentWindow.find(textToFind),
"Should be " + (isFindable ? "" : "not ") + "findable: " + description + ", text: " + textToFind
);
} catch (ex) {
assert_unreached(ex);
}
}
const INLINE_LIKE_DISPLAY_VALUES = [
"inline",
"inline-grid",
"inline-block",
"inline-flex",
];
const BLOCK_LIKE_DISPLAY_VALUES = [
"block",
"table",
"list-item",
"grid",
"flex",
];
let runTests = t.step_func_done(function() {
testFindable(true, "me and me", `
me <div style="display: contents">and</div> me
`, "display: contents");
testFindable(true, "me me", `
me <div style="display: none">and</div> me
`, "display: none");
testFindable(false, "me and me", `
me <div style="display: none">and</div> me
`, "display: none");
for (const display of INLINE_LIKE_DISPLAY_VALUES) {
testFindable(true, "me and me", `
me <div style="display: ${display}">and</div> me
`, "div display: " + display);
testFindable(true, "me and me", `
me <span style="display: ${display}">and</span> me
`, "span display: " + display);
}
for (const display of BLOCK_LIKE_DISPLAY_VALUES) {
testFindable(false, "me and me", `
me <div style="display: ${display}">and</div> me
`, "div display: " + display);
testFindable(false, "me and me", `
me <span style="display: ${display}">and</span> me
`, "span display: " + display);
}
testFindable(false, "me and me", `
me <fieldset>and</fieldset> me
`);
testFindable(true, "This text should be visible", `
<div style="visibility: hidden">
<div style="visibility: visible">
This text should be visible
</div>
</div>
`);
testFindable(true, "Shadow text", function(document) {
let div = document.createElement("div");
div.attachShadow({ mode: "open" }).innerHTML = `
Wohoo, this is Shadow text, yay!
`;
document.documentElement.appendChild(div);
}, "In Shadow DOM");
testFindable(true, "Shadow text", function(document) {
let div = document.createElement("div");
div.appendChild(document.createTextNode(
"Wohoo, this is Shadow text, yay!"
));
div.attachShadow({ mode: "open" }).innerHTML = `<slot></slot>`;
document.documentElement.appendChild(div);
}, "Slotted content in Shadow DOM");
// TODO(emilio): Even though this works (as in, find(..) returns true), the
// selection here doesn't end up selecting the shadow content.
//
// This should work in an ideal world.
testFindable(true, "Shadow text", function(document) {
let div = document.createElement("div");
div.appendChild(document.createTextNode("text, yay!"));
div.attachShadow({ mode: "open" }).innerHTML = `This is Shadow <slot></slot>`;
document.documentElement.appendChild(div);
}, "Mixed shadow and non-shadow text");
});
SpecialPowers.pushPrefEnv(
{"set":[['dom.webcomponents.shadowdom.enabled', true]]},
t.step_func(function() {
let iframe = document.createElement("iframe");
iframe.onload = runTests;
iframe.srcdoc = "<!doctype html><html></html>";
document.body.appendChild(iframe);
}));
</script>
</body>