| OLD | NEW | 
|   1 <!doctype html> |   1 <!doctype html> | 
|   2 <style> |   2 <style> | 
|   3   div { |   3   div { | 
|   4     color: orange; |   4     color: orange; | 
|   5   } |   5   } | 
|   6 </style> |   6 </style> | 
|   7 <script src="../resources/runner.js"></script> |   7 <script src="../resources/runner.js"></script> | 
|   8 <script> |   8 <script> | 
|   9   var listSize = 100; |   9   var listSize = 100; | 
|  10   window.onload = function() { |  10   window.onload = function() { | 
|  11     PerfTestRunner.measureTime({ |  11     PerfTestRunner.measureTime({ | 
|  12       description: "Measures performance of creating and rendering elements with
     shadow roots from templates (contains class descendant selector styles).", |  12       description: "Measures performance of creating and rendering elements with
     shadow roots from templates (contains class descendant selector styles).", | 
|  13       run: function() { |  13       run: function() { | 
|  14         var list = document.querySelector('#list'); |  14         var list = document.querySelector('#list'); | 
|  15         var tmpl = document.querySelector("#tmpl"); |  15         var tmpl = document.querySelector("#tmpl"); | 
|  16         list.innerHTML = ''; |  16         list.innerHTML = ''; | 
|  17         var start = PerfTestRunner.now(); |  17         var start = PerfTestRunner.now(); | 
|  18         var i = 0; |  18         var i = 0; | 
|  19         do { |  19         do { | 
|  20           var host = document.createElement('div'); |  20           var host = document.createElement('div'); | 
|  21           var root = host.createShadowRoot(); |  21           var root = host.createShadowRoot(); | 
|  22           root.appendChild(tmpl.content.cloneNode(true)); |  22           root.appendChild(tmpl.content.cloneNode(true)); | 
|  23           var light = document.createElement('div'); |  23           var light = document.createElement('div'); | 
|  24           list.appendChild(host); |  24           list.appendChild(host); | 
|  25         } while (++i < listSize); |  25         } while (++i < listSize); | 
|  26  |  26  | 
|  27         PerfTestRunner.forceLayoutOrFullFrame(); |  27         PerfTestRunner.forceLayout(); | 
|  28         return PerfTestRunner.now() - start; |  28         return PerfTestRunner.now() - start; | 
|  29       } |  29       } | 
|  30     }); |  30     }); | 
|  31   } |  31   } | 
|  32 </script> |  32 </script> | 
|  33 <template id="tmpl"> |  33 <template id="tmpl"> | 
|  34   <style> |  34   <style> | 
|  35     .foo .bar .foo.bar.baz { |  35     .foo .bar .foo.bar.baz { | 
|  36       color: blue; |  36       color: blue; | 
|  37     } |  37     } | 
|  38     .bar.baz { |  38     .bar.baz { | 
|  39       color: red; |  39       color: red; | 
|  40     } |  40     } | 
|  41   </style> |  41   </style> | 
|  42   <div class="foo"> |  42   <div class="foo"> | 
|  43     <div class="bar"> |  43     <div class="bar"> | 
|  44       <div class="foo bar baz">item</div> |  44       <div class="foo bar baz">item</div> | 
|  45     </div> |  45     </div> | 
|  46   </div> |  46   </div> | 
|  47   <content></content> |  47   <content></content> | 
|  48 </template> |  48 </template> | 
|  49 <section id="list"></section> |  49 <section id="list"></section> | 
| OLD | NEW |