summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/cssom/style-attr-update-across-documents.html
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/css/cssom/style-attr-update-across-documents.html')
-rw-r--r--testing/web-platform/tests/css/cssom/style-attr-update-across-documents.html48
1 files changed, 48 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/cssom/style-attr-update-across-documents.html b/testing/web-platform/tests/css/cssom/style-attr-update-across-documents.html
new file mode 100644
index 0000000000..2b8f443520
--- /dev/null
+++ b/testing/web-platform/tests/css/cssom/style-attr-update-across-documents.html
@@ -0,0 +1,48 @@
+<!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>