| OLD | NEW | 
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> | 
| 2 <html> | 2 <html> | 
| 3 <head> | 3 <head> | 
| 4 <script src="resources/shadow-dom.js"></script> | 4 <script src="resources/shadow-dom.js"></script> | 
| 5 <script src="../../../resources/js-test.js"></script> | 5 <script src="../../../resources/js-test.js"></script> | 
| 6 </head> | 6 </head> | 
| 7 <body> | 7 <body> | 
| 8   <div id='sandbox'></div> | 8   <div id='sandbox'></div> | 
| 9   <pre id='console'></pre> | 9   <pre id='console'></pre> | 
| 10 </body> | 10 </body> | 
| (...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after  Loading... | 
| 50                     createDOM('style', {}, | 50                     createDOM('style', {}, | 
| 51                         document.createTextNode('::content > p { border: 1px sol
     id green; }')), | 51                         document.createTextNode('::content > p { border: 1px sol
     id green; }')), | 
| 52                     createDOM('content', {})), | 52                     createDOM('content', {})), | 
| 53                 createDOM('content', {}))), | 53                 createDOM('content', {}))), | 
| 54         createDOM('p', {'id': 'target'}))); | 54         createDOM('p', {'id': 'target'}))); | 
| 55 | 55 | 
| 56 borderColorShouldBe('target', 'rgb(0, 128, 0)'); | 56 borderColorShouldBe('target', 'rgb(0, 128, 0)'); | 
| 57 | 57 | 
| 58 cleanUp(); | 58 cleanUp(); | 
| 59 | 59 | 
| 60 // Rules declared in outer treescope should win. |  | 
| 61 sandbox.appendChild( |  | 
| 62     createDOM('div', {}, |  | 
| 63         createDOM('style', {}, |  | 
| 64             document.createTextNode('div /deep/ span { border: 1px solid green; 
     }')), |  | 
| 65         createDOM('div', {'id': 'host'}, |  | 
| 66             createShadowRoot( |  | 
| 67                 createDOM('style', {}, |  | 
| 68                     document.createTextNode('div /deep/ span { border: 1px solid
      red; }')), |  | 
| 69                 createDOM('div', {'id': 'host2'}, |  | 
| 70                     createShadowRoot( |  | 
| 71                         createDOM('style', {}, |  | 
| 72                             document.createTextNode('div > span { border: 1px so
     lid yellow; }')), |  | 
| 73                         createDOM('div', {}, |  | 
| 74                             createDOM('span', {'id': 'target'}, |  | 
| 75                                 document.createTextNode('Geen border'))))))))); |  | 
| 76 |  | 
| 77 borderColorShouldBe('host/host2/target', 'rgb(0, 128, 0)'); |  | 
| 78 |  | 
| 79 cleanUp(); |  | 
| 80 |  | 
| 81 // Comparing rules declared in outer treescope with rules declared in inner tree
     scope. |  | 
| 82 // Outer's should win. |  | 
| 83 sandbox.appendChild( |  | 
| 84     createDOM('div', {}, |  | 
| 85         createDOM('style', {}, |  | 
| 86             document.createTextNode('div /deep/ p:empty { border: 1px solid gree
     n; }')), |  | 
| 87         createDOM('div', {'id': 'host'}, |  | 
| 88             createShadowRoot( |  | 
| 89                 createDOM('div', {}, |  | 
| 90                     createDOM('style', {}, |  | 
| 91                         document.createTextNode('div > p:empty { border: 1px sol
     id blue; }')), |  | 
| 92                     createShadowRoot( |  | 
| 93                         createDOM('style', {}, |  | 
| 94                             document.createTextNode('content::content > p { bord
     er: 1px solid red; }')), |  | 
| 95                         createDOM('div', {}, |  | 
| 96                             createShadowRoot( |  | 
| 97                                 createDOM('style', {}, |  | 
| 98                                     document.createTextNode('content::content > 
     p { border: 1px solid yellow; }')), |  | 
| 99                                 createDOM('content', {})), |  | 
| 100                             createDOM('content', {}))), |  | 
| 101                     createDOM('p', {'id': 'target'})))))); |  | 
| 102 |  | 
| 103 borderColorShouldBe('host/target', 'rgb(0, 128, 0)'); |  | 
| 104 |  | 
| 105 cleanUp(); |  | 
| 106 |  | 
| 107 // Comparing important rules declared in outer treescope with important rules de
     clared in inner treescope. | 60 // Comparing important rules declared in outer treescope with important rules de
     clared in inner treescope. | 
| 108 // Inner's should win. | 61 // Inner's should win. | 
| 109 sandbox.appendChild( | 62 sandbox.appendChild( | 
| 110     createDOM('div', {}, | 63     createDOM('div', {}, | 
| 111         createDOM('style', {}, | 64         createDOM('style', {}, | 
| 112             document.createTextNode('div { border: 1px solid red !important; }')
     ), | 65             document.createTextNode('div { border: 1px solid red !important; }')
     ), | 
| 113         createDOM('div', {'id': 'host'}, | 66         createDOM('div', {'id': 'host'}, | 
| 114             createShadowRoot( | 67             createShadowRoot( | 
| 115                 createDOM('style', {}, | 68                 createDOM('style', {}, | 
| 116                     document.createTextNode('#target { border: 1px solid green !
     important; }')), | 69                     document.createTextNode('#target { border: 1px solid green !
     important; }')), | 
| 117                 createDOM('p', {'id': 'target'}))))); | 70                 createDOM('p', {'id': 'target'}))))); | 
| 118 | 71 | 
| 119 borderColorShouldBe('host/target', 'rgb(0, 128, 0)'); | 72 borderColorShouldBe('host/target', 'rgb(0, 128, 0)'); | 
| 120 | 73 | 
| 121 cleanUp(); | 74 cleanUp(); | 
| 122 | 75 | 
| 123 </script> | 76 </script> | 
| 124 </html> | 77 </html> | 
| 125 |  | 
| OLD | NEW | 
|---|