| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <script src="../../resources/js-test.js"></script> | 2 <script src="../../resources/js-test.js"></script> |
| 3 <div id="host"> | 3 <div id="host"> |
| 4 <div> | 4 <div> |
| 5 <span class="red" id="span">red?</span> | 5 <span class="red" id="span">There should be no red</span> |
| 6 </div> | 6 </div> |
| 7 </div> | 7 </div> |
| 8 <script> | 8 <script> |
| 9 description('Checking if styles in the nested shadow roots apply properly to dis
tributed elements.'); | 9 description('Checking if styles in the nested shadow roots apply properly to dis
tributed elements.'); |
| 10 var root = document.querySelector('#host').createShadowRoot(); | 10 var root = document.querySelector('#host').createShadowRoot(); |
| 11 root.innerHTML = '<div><content></content></div><style>::content .red { color: g
reen; }</style>'; | 11 root.innerHTML = '<div><content></content></div><style>::content .red { color: g
reen; }</style>'; |
| 12 var root2 = root.firstChild.createShadowRoot(); | 12 var root2 = root.firstChild.createShadowRoot(); |
| 13 root2.innerHTML = '<style>::content .red { background-color: green; color: red;
}</style><content></content>'; | 13 root2.innerHTML = '<style>::content .red { background-color: green; color: red;
}</style><content></content>'; |
| 14 var span = document.querySelector('#span'); | 14 var span = document.querySelector('#span'); |
| 15 shouldBeEqualToString('getComputedStyle(span).color', 'rgb(255, 0, 0)'); | 15 shouldBeEqualToString('getComputedStyle(span).color', 'rgb(0, 128, 0)'); |
| 16 shouldBeEqualToString('getComputedStyle(span).backgroundColor', 'rgb(0, 128, 0)'
); | 16 shouldBeEqualToString('getComputedStyle(span).backgroundColor', 'rgb(0, 128, 0)'
); |
| 17 </script> | 17 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1224673002:
Implement proposed shadow tree cascade order. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master