| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="resources/polyfill.js"></script> |
| <script src="../../../resources/js-test-pre.js"></script> |
| <script> |
| function getColorProperty(id) { |
| return window.getComputedStyle(document.getElementById(id)).color; |
| } |
| |
| function log(message) { |
| var console = document.getElementById('console'); |
| console.innerHTML += message + '\n'; |
| } |
| </script> |
| </head> |
| <body> |
| <pre id="console"></div> |
| <div id="test"> |
| <div id="host" style="color: red"> |
| <div id="child-a"></div> |
| <div id="child-b"></div> |
| </div> |
| </div> |
| <script> |
| description("Tests to ensure that styles of distributed nodes are different if their parent styles are different."); |
| |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| var sr = document.getElementById("host").webkitCreateShadowRoot(); |
| sr.innerHTML = '<content select="#child-a"></content><div style="color: blue"><content select="#child-b"></content></div>'; |
| |
| shouldBe('getColorProperty("child-a")', '"rgb(255, 0, 0)"'); |
| shouldBe('getColorProperty("child-b")', '"rgb(0, 0, 255)"'); |
| |
| document.getElementById("test").innerHTML = ''; |
| </script> |
| <script src="../../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
