OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <title>::distributed pseudo elements with dynamic attribute change</title> | 4 <title>::distributed pseudo elements with dynamic attribute change</title> |
5 </head> | 5 </head> |
6 <body> | 6 <body> |
7 <div id="host"> | 7 <div id="host"> |
8 <div id="child">I should be green.</div> | 8 <div id="child">I should be green.</div> |
9 </div> | 9 </div> |
10 <script> | 10 <script> |
11 if (window.testRunner) | 11 if (window.testRunner) |
12 testRunner.waitUntilDone(); | 12 testRunner.waitUntilDone(); |
13 var shadowRoot = document.getElementById('host').createShadowRoot(); | 13 var shadowRoot = document.getElementById('host').createShadowRoot(); |
14 shadowRoot.innerHTML = '<style>content::-webkit-distributed(.selected) { ' + | 14 shadowRoot.innerHTML = '<style>content::content .selected { ' + |
15 'background: green; }</style>' + | 15 'background: green; }</style>' + |
16 '<content></content>'; | 16 '<content></content>'; |
17 | 17 |
18 setTimeout(function() { | 18 setTimeout(function() { |
19 document.getElementById('child').classList.add('selected'); | 19 document.getElementById('child').classList.add('selected'); |
20 if (window.testRunner) | 20 if (window.testRunner) |
21 testRunner.notifyDone(); | 21 testRunner.notifyDone(); |
22 }, 0); | 22 }, 0); |
23 </script> | 23 </script> |
24 </body> | 24 </body> |
25 </html> | 25 </html> |
OLD | NEW |