| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <script src="../../../resources/js-test.js"></script> | 4 <script src="../../../resources/js-test.js"></script> |
| 5 <script src="resources/shadow-dom.js"></script> | 5 <script src="resources/shadow-dom.js"></script> |
| 6 <style> | 6 <style> |
| 7 :host-context(*) { | 7 :host-context(*) { |
| 8 background-color: red; | 8 background-color: red; |
| 9 } | 9 } |
| 10 </style> | 10 </style> |
| 11 </head> | 11 </head> |
| 12 <body class='mytheme'> | 12 <body class='mytheme'> |
| 13 <div> | 13 <div> |
| 14 <div id='sandbox'></div> | 14 <div id='sandbox'></div> |
| 15 </div> | 15 </div> |
| 16 <pre id='console'></pre> | 16 <pre id='console'></pre> |
| 17 <script> | 17 <script> |
| 18 description('Test whether :host-context matches a shadow host correctly.'); | 18 description('Test whether :host-context matches a shadow host correctly.'); |
| 19 | 19 |
| 20 var sandbox = document.getElementById('sandbox'); | 20 var sandbox = document.getElementById('sandbox'); |
| 21 | 21 |
| 22 function backgroundColorOf(selector) { | |
| 23 return window.getComputedStyle(getNodeInTreeOfTrees(selector)).backgroundCol
or; | |
| 24 } | |
| 25 | |
| 26 function backgroundColorShouldBe(selector, expected) { | |
| 27 shouldBeEqualToString('backgroundColorOf(\'' + selector + '\')', expected); | |
| 28 } | |
| 29 | |
| 30 function cleanUp() { | 22 function cleanUp() { |
| 31 sandbox.innerHTML = ''; | 23 sandbox.innerHTML = ''; |
| 32 } | 24 } |
| 33 | 25 |
| 34 debug(':host-context out of shadow tree should not match any shadow hosts.'); | 26 debug(':host-context out of shadow tree should not match any shadow hosts.'); |
| 35 | 27 |
| 36 sandbox.appendChild( | 28 sandbox.appendChild( |
| 37 createDOM('div', {'id': 'host'}, | 29 createDOM('div', {'id': 'host'}, |
| 38 createShadowRoot( | 30 createShadowRoot( |
| 39 createDOM('div', {}, | 31 createDOM('div', {}, |
| (...skipping 300 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 340 document.createTextNode(':host-context { background-color: red;
}')), | 332 document.createTextNode(':host-context { background-color: red;
}')), |
| 341 createDOM('div', {}, | 333 createDOM('div', {}, |
| 342 document.createTextNode('Hello'))))); | 334 document.createTextNode('Hello'))))); |
| 343 | 335 |
| 344 backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)'); | 336 backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)'); |
| 345 | 337 |
| 346 cleanUp(); | 338 cleanUp(); |
| 347 | 339 |
| 348 </script> | 340 </script> |
| 349 </body> | 341 </body> |
| OLD | NEW |