48 lines
2.2 KiB
HTML
48 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<title>CSSStyleDeclaration setter works when a node changes document</title>
|
|
<link rel="author" title="Raphael Kubo da Costa" href="raphael.kubo.da.costa@intel.com">
|
|
<link rel="help" href="https://drafts.csswg.org/cssom/#dom-cssstyledeclaration-camel-cased-attribute">
|
|
<link rel="help" href="https://drafts.csswg.org/cssom/#dom-cssstyledeclaration-webkit-cased-attribute">
|
|
<link rel="help" href="https://drafts.csswg.org/cssom/#dom-cssstyledeclaration-dashed-attribute">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<div id="original-div" style="background-color:green; height: 100px; width: 100px"></div>
|
|
<script>
|
|
// Create and return a 100x100 red <div>.
|
|
function createDiv(containerDocument) {
|
|
const div = containerDocument.createElement("div");
|
|
div.style.backgroundColor = "red";
|
|
div.style.height = "100px";
|
|
div.style.width = "100px";
|
|
containerDocument.body.appendChild(div);
|
|
return div;
|
|
}
|
|
|
|
async_test(t => {
|
|
const iframeElement = document.createElement("iframe");
|
|
iframeElement.addEventListener("load", t.step_func_done(() => {
|
|
const originalDiv = document.getElementById("original-div");
|
|
const newDiv = createDiv(iframeElement.contentDocument);
|
|
|
|
assert_not_equals(newDiv.ownerDocument, document,
|
|
"The new <div> belongs to the iframe, not the main document");
|
|
|
|
document.body.insertBefore(newDiv, originalDiv);
|
|
assert_equals(newDiv.ownerDocument, document,
|
|
"The new <div> now belongs to the main document");
|
|
|
|
newDiv.style.backgroundColor = "blue";
|
|
assert_equals(window.getComputedStyle(newDiv).getPropertyValue("background-color"),
|
|
"rgb(0, 0, 255)",
|
|
"The new <div>'s background-color is blue");
|
|
|
|
document.body.removeChild(iframeElement);
|
|
|
|
newDiv.style.backgroundColor = "green";
|
|
assert_equals(window.getComputedStyle(newDiv).getPropertyValue("background-color"),
|
|
"rgb(0, 128, 0)",
|
|
"The new <div>'s background-color is green");
|
|
}));
|
|
document.body.appendChild(iframeElement);
|
|
}, "Changing the style of a node that switched documents works");
|
|
</script>
|