Tim Nguyen
8fcc3336fa
Automatic update from web-platform-tests Fix typo in css/cssom/CSSStyleSheet-template-adoption.html (#60800) Fixes #60772 -- wpt-commits: 37291d274f2573af7f8b699df87c9ed77d1909e2 wpt-pr: 60800
62 lines
2.5 KiB
HTML
62 lines
2.5 KiB
HTML
<!doctype html>
|
|
<title>adoptedStyleSheets should stay when adopting to/from template document</title>
|
|
<link rel="author" title="Rakina Zata Amni" href="mailto:rakina@chromium.org">
|
|
<link rel="help" href="https://wicg.github.io/construct-stylesheets/">
|
|
<script src = '/resources/testharness.js'></script>
|
|
<script src = '/resources/testharnessreport.js'></script>
|
|
<body>
|
|
<div id="host"></div>
|
|
<template id='template'>
|
|
<template id='nested_template'></template>
|
|
</template>
|
|
</body>
|
|
<script>
|
|
test(function() {
|
|
let sheet = new CSSStyleSheet();
|
|
sheet.replaceSync("div { color: blue }");
|
|
|
|
let host = document.getElementById("host");
|
|
let root = host.attachShadow({ mode: "open" });
|
|
root.innerHTML = `<div></div>`;
|
|
root.adoptedStyleSheets = [sheet];
|
|
let adoptedStyleSheets = root.adoptedStyleSheets;
|
|
|
|
function assertAdoptedStyleSheet() {
|
|
assert_equals(host.ownerDocument, root.firstChild.ownerDocument, "Shadow root was not adopted?");
|
|
assert_equals(root.adoptedStyleSheets.length, 1);
|
|
assert_equals(root.adoptedStyleSheets[0], sheet);
|
|
if (root.ownerDocument == document) {
|
|
assert_equals(getComputedStyle(root.firstChild).color, "rgb(0, 0, 255)", "Sheet should apply");
|
|
}
|
|
assert_equals(adoptedStyleSheets, root.adoptedStyleSheets, "adoptedStyleSheets should be the same array");
|
|
}
|
|
|
|
assertAdoptedStyleSheet();
|
|
|
|
// adoptedStyleSheets is not cleared when adopted into a <template>.
|
|
const template = document.getElementById("template");
|
|
template.content.appendChild(host);
|
|
|
|
assert_not_equals(host.ownerDocument, document, "Should've been adopted");
|
|
assertAdoptedStyleSheet();
|
|
|
|
// adoptedStyleSheets is not cleared when adopted back in the main document.
|
|
document.body.appendChild(host);
|
|
assert_equals(host.ownerDocument, document, "Should've been re-adopted");
|
|
assertAdoptedStyleSheet();
|
|
|
|
// adoptedStyleSheets is not cleared when adopted into a nested <template>.
|
|
const nested_template = template.content.firstElementChild;
|
|
nested_template.content.appendChild(host);
|
|
assert_not_equals(host.ownerDocument, document, "Should've been adopted");
|
|
assertAdoptedStyleSheet();
|
|
|
|
// adoptedStyleSheets is cleared when adopted into an <iframe>.
|
|
const iframe = document.createElement("iframe");
|
|
document.body.appendChild(iframe);
|
|
iframe.contentDocument.body.appendChild(host);
|
|
assert_equals(root.adoptedStyleSheets.length, 0);
|
|
assert_equals(adoptedStyleSheets, root.adoptedStyleSheets, "adoptedStyleSheets should be the same array");
|
|
}, "adoptedStyleSheets won't be cleared when adopting into/from <template>s");
|
|
</script>
|