| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <meta http-equiv="Content-Security-Policy" content="style-src 'self';"> | 4 <meta http-equiv="Content-Security-Policy" content="style-src 'self';"> |
| 5 <script src="/js-test-resources/js-test.js"></script> | 5 <script src="/js-test-resources/js-test.js"></script> |
| 6 <script> | 6 <script> |
| 7 window.onload = function () { | 7 window.onload = function () { |
| 8 debug("This test ensures that styles can be set by object.cloneNode(
)"); | 8 debug("This test ensures that styles can be set by object.cloneNode(
)"); |
| 9 | 9 |
| 10 window.nodes = document.getElementById('nodes'); | 10 window.nodes = document.getElementById('nodes'); |
| (...skipping 17 matching lines...) Expand all Loading... |
| 28 shouldBeEqualToString("node1.style.background", "yellow"); | 28 shouldBeEqualToString("node1.style.background", "yellow"); |
| 29 shouldBeEqualToString("node2.style.background", "yellow"); | 29 shouldBeEqualToString("node2.style.background", "yellow"); |
| 30 shouldBeEqualToString("node3.style.background", "blue"); | 30 shouldBeEqualToString("node3.style.background", "blue"); |
| 31 shouldBeEqualToString("node4.style.background", "blue"); | 31 shouldBeEqualToString("node4.style.background", "blue"); |
| 32 | 32 |
| 33 shouldBeEqualToString("node1.style.color", "red"); | 33 shouldBeEqualToString("node1.style.color", "red"); |
| 34 shouldBeEqualToString("node2.style.color", "red"); | 34 shouldBeEqualToString("node2.style.color", "red"); |
| 35 shouldBeEqualToString("node3.style.color", "green"); | 35 shouldBeEqualToString("node3.style.color", "green"); |
| 36 shouldBeEqualToString("node4.style.color", "green"); | 36 shouldBeEqualToString("node4.style.color", "green"); |
| 37 | 37 |
| 38 shouldBe("window.getComputedStyle(node1).getPropertyCSSValue('backgr
ound').cssText", "window.getComputedStyle(node2).getPropertyCSSValue('background
').cssText"); | 38 shouldBe("window.getComputedStyle(node1).background", "window.getCom
putedStyle(node2).background"); |
| 39 shouldBe("window.getComputedStyle(node3).getPropertyCSSValue('backgr
ound').cssText", "window.getComputedStyle(node4).getPropertyCSSValue('background
').cssText"); | 39 shouldBe("window.getComputedStyle(node3).background", "window.getCom
putedStyle(node4).background"); |
| 40 | 40 |
| 41 shouldBe("window.getComputedStyle(node1).getPropertyCSSValue('color'
).cssText", "window.getComputedStyle(node2).getPropertyCSSValue('color').cssText
"); | 41 shouldBe("window.getComputedStyle(node1).color", "window.getComputed
Style(node2).color"); |
| 42 shouldBe("window.getComputedStyle(node3).getPropertyCSSValue('color'
).cssText", "window.getComputedStyle(node4).getPropertyCSSValue('color').cssText
"); | 42 shouldBe("window.getComputedStyle(node3).color", "window.getComputed
Style(node4).color"); |
| 43 | 43 |
| 44 window.ops = document.getElementById('ops'); | 44 window.ops = document.getElementById('ops'); |
| 45 ops.style.color = 'red'; | 45 ops.style.color = 'red'; |
| 46 window.clonedOps = ops.cloneNode(true); | 46 window.clonedOps = ops.cloneNode(true); |
| 47 window.violetOps = document.getElementById('violetOps'); | 47 window.violetOps = document.getElementById('violetOps'); |
| 48 | 48 |
| 49 violetOps.style.background = 'rgb(238, 130, 238)'; | 49 violetOps.style.background = 'rgb(238, 130, 238)'; |
| 50 document.getElementsByTagName('body')[0].appendChild(clonedOps); | 50 document.getElementsByTagName('body')[0].appendChild(clonedOps); |
| 51 | 51 |
| 52 shouldBeEqualToString("ops.style.background", ""); | 52 shouldBeEqualToString("ops.style.background", ""); |
| 53 debug("getComputedStyle(clonedOps).getPropertyCSSValue('background')
.cssText: " + window.getComputedStyle(ops).getPropertyCSSValue('background').css
Text); | 53 debug("getComputedStyle(clonedOps).background: " + window.getCompute
dStyle(ops).background); |
| 54 shouldBeEqualToString("ops.style.color", "red"); | 54 shouldBeEqualToString("ops.style.color", "red"); |
| 55 shouldBeEqualToString("clonedOps.style.background", ""); | 55 shouldBeEqualToString("clonedOps.style.background", ""); |
| 56 shouldBeEqualToString("violetOps.style.background", "rgb(238, 130, 2
38)"); | 56 shouldBeEqualToString("violetOps.style.background", "rgb(238, 130, 2
38)"); |
| 57 | 57 |
| 58 shouldBe("window.getComputedStyle(clonedOps).getPropertyCSSValue('ba
ckground').cssText", "window.getComputedStyle(ops).getPropertyCSSValue('backgrou
nd').cssText"); | 58 shouldBe("window.getComputedStyle(clonedOps).background", "window.ge
tComputedStyle(ops).background"); |
| 59 shouldBe("window.getComputedStyle(clonedOps).getPropertyCSSValue('co
lor').cssText", "window.getComputedStyle(ops).getPropertyCSSValue('color').cssTe
xt"); | 59 shouldBe("window.getComputedStyle(clonedOps).color", "window.getComp
utedStyle(ops).color"); |
| 60 debug("getComputedStyle(violetOps).getPropertyCSSValue('background')
.cssText: " + window.getComputedStyle(violetOps).getPropertyCSSValue('background
').cssText); | 60 debug("getComputedStyle(violetOps).background: " + window.getCompute
dStyle(violetOps).background); |
| 61 shouldNotBe("window.getComputedStyle(ops).getPropertyCSSValue('backg
round').cssText", "window.getComputedStyle(violetOps).getPropertyCSSValue('backg
round').cssText"); | 61 shouldNotBe("window.getComputedStyle(ops).background", "window.getCo
mputedStyle(violetOps).background"); |
| 62 shouldNotBe("window.getComputedStyle(clonedOps).getPropertyCSSValue(
'background').cssText", "window.getComputedStyle(violetOps).getPropertyCSSValue(
'background').cssText"); | 62 shouldNotBe("window.getComputedStyle(clonedOps).background", "window
.getComputedStyle(violetOps).background"); |
| 63 | 63 |
| 64 shouldBeEqualToString("ops.id", "ops"); | 64 shouldBeEqualToString("ops.id", "ops"); |
| 65 shouldBe("ops.id", "clonedOps.id"); | 65 shouldBe("ops.id", "clonedOps.id"); |
| 66 }; | 66 }; |
| 67 </script> | 67 </script> |
| 68 </head> | 68 </head> |
| 69 <body> | 69 <body> |
| 70 | 70 |
| 71 <div id="nodes"> | 71 <div id="nodes"> |
| 72 This is a div (nodes) | 72 This is a div (nodes) |
| 73 <div id="node1"> This is a div. (node 1 or 2)</div> | 73 <div id="node1"> This is a div. (node 1 or 2)</div> |
| 74 <div id="node3"> This is a div. (node 3 or 4)</div> | 74 <div id="node3"> This is a div. (node 3 or 4)</div> |
| 75 </div> | 75 </div> |
| 76 | 76 |
| 77 <div id="ops" style="background: rgb(238, 130, 238)"> | 77 <div id="ops" style="background: rgb(238, 130, 238)"> |
| 78 Yet another div. | 78 Yet another div. |
| 79 </div> | 79 </div> |
| 80 | 80 |
| 81 <div id="violetOps"> | 81 <div id="violetOps"> |
| 82 Yet another div. | 82 Yet another div. |
| 83 </div> | 83 </div> |
| 84 | 84 |
| 85 </body> | 85 </body> |
| 86 </html> | 86 </html> |
| OLD | NEW |