| OLD | NEW | 
|---|
|  | (Empty) | 
| 1 <!doctype html> |  | 
| 2 <html> |  | 
| 3 <head> |  | 
| 4 <script src="resources/shadow-dom.js"></script> |  | 
| 5 <script src="../../../resources/js-test.js"></script> |  | 
| 6 </head> |  | 
| 7 <body class="bodyClass"> |  | 
| 8   <div id="sandbox"></div> |  | 
| 9   <pre id="console"></pre> |  | 
| 10 </body> |  | 
| 11 <script> |  | 
| 12 description("Test for /content/ with /shadow/ and :host."); |  | 
| 13 |  | 
| 14 var sandbox = document.getElementById('sandbox'); |  | 
| 15 |  | 
| 16 function colorOf(selector) |  | 
| 17 { |  | 
| 18     return document.defaultView.getComputedStyle(document.querySelector(selector
     ), null).getPropertyValue('color'); |  | 
| 19 } |  | 
| 20 |  | 
| 21 function cleanUp() |  | 
| 22 { |  | 
| 23     sandbox.innerHTML = ''; |  | 
| 24 } |  | 
| 25 |  | 
| 26 sandbox.appendChild( |  | 
| 27     createDOM('div', {'id': 'host1'}, |  | 
| 28         createShadowRoot( |  | 
| 29             createDOM('style', {}, |  | 
| 30                 document.createTextNode( |  | 
| 31                     ':host(#host1) /shadow/ #content1 /content/ .content { color
     : green; }')), |  | 
| 32             createDOM('div', {}, |  | 
| 33                 createDOM('div', {'id': 'host2'}, |  | 
| 34                     createShadowRoot( |  | 
| 35                         createDOM('content', {'id': 'content2'})), |  | 
| 36                     createDOM('div', {'id': 'parentOfContent1'}, |  | 
| 37                         createDOM('content', {'id': 'content1'}))))), |  | 
| 38         createDOM('div', {'class': 'content'}, |  | 
| 39             document.createTextNode('content')))); |  | 
| 40 |  | 
| 41 shouldBe('colorOf("#host1 > .content")', '"rgb(0, 128, 0)"'); |  | 
| 42 |  | 
| 43 cleanUp(); |  | 
| 44 |  | 
| 45 sandbox.appendChild( |  | 
| 46     createDOM('div', {'id': 'host1'}, |  | 
| 47         createShadowRoot( |  | 
| 48             createDOM('style', {}, |  | 
| 49                 document.createTextNode( |  | 
| 50                     '#host2 /shadow/ #content2 /content/ #parentOfContent1 > #co
     ntent1 /content/ .content { color: green; }')), |  | 
| 51             createDOM('div', {}, |  | 
| 52                 createDOM('div', {'id': 'host2'}, |  | 
| 53                     createShadowRoot( |  | 
| 54                         createDOM('content', {'id': 'content2'})), |  | 
| 55                     createDOM('div', {'id': 'parentOfContent1'}, |  | 
| 56                         createDOM('content', {'id': 'content1'}))))), |  | 
| 57         createDOM('div', {'class': 'content'}, |  | 
| 58             document.createTextNode('content')))); |  | 
| 59 |  | 
| 60 shouldBe('colorOf("#host1 > .content")', '"rgb(0, 128, 0)"'); |  | 
| 61 |  | 
| 62 cleanUp(); |  | 
| 63 |  | 
| 64 sandbox.appendChild( |  | 
| 65     createDOM('div', {'id': 'host1'}, |  | 
| 66         createShadowRoot( |  | 
| 67             createDOM('style', {}, |  | 
| 68                 document.createTextNode( |  | 
| 69                     ':host /shadow/ #content2 /content/ #shadow1 /content/ #cont
     ent1 /content/ .content { color: red; }')), |  | 
| 70             createDOM('content', {'id': 'content1'})), |  | 
| 71         createShadowRoot( |  | 
| 72             createDOM('div', {}, |  | 
| 73                 createDOM('div', {'id': 'host2'}, |  | 
| 74                     createShadowRoot( |  | 
| 75                         createDOM('content', {'id': 'content2'})), |  | 
| 76                     createDOM('div', {'id': 'parentOfShadow1'}, |  | 
| 77                         createDOM('shadow', {'id': 'shadow1'}))))), |  | 
| 78         createDOM('div', {'class': 'content'}, |  | 
| 79             document.createTextNode('content')))); |  | 
| 80 |  | 
| 81 shouldNotBe('colorOf("#host1 > .content")', '"rgb(255, 0, 0)"'); |  | 
| 82 |  | 
| 83 cleanUp(); |  | 
| 84 |  | 
| 85 sandbox.appendChild( |  | 
| 86     createDOM('div', {'id': 'host1'}, |  | 
| 87         createShadowRoot( |  | 
| 88             createDOM('style', {}, |  | 
| 89                 document.createTextNode( |  | 
| 90                     ':host /shadow/ #content2 /content/ #parentOfContent1 > #con
     tent1 /content/ .content { color: red; }')), |  | 
| 91             createDOM('div', {}, |  | 
| 92                 createDOM('div', {'id': 'host2'}, |  | 
| 93                     createShadowRoot( |  | 
| 94                         createDOM('content', {'id': 'content2'})), |  | 
| 95                     createDOM('div', {'id': 'parentOfContent1'}, |  | 
| 96                         createDOM('content', {'id': 'content1'}))))), |  | 
| 97         createDOM('div', {'class': 'content'}, |  | 
| 98             document.createTextNode('content')))); |  | 
| 99 |  | 
| 100 shouldNotBe('colorOf("#host1 > .content")', '"rgb(255, 0, 0)"'); |  | 
| 101 |  | 
| 102 cleanUp(); |  | 
| 103 |  | 
| 104 </script> |  | 
| 105 </html> |  | 
| OLD | NEW | 
|---|