third_party/WebKit/PerformanceTests/ShadowDOM/ChangingClassNameShadowDOM.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4     <script type="text/javascript" src="../resources/runner.js"></script>
   5 </head>
   6 <body>
   7
   8 <div id="wrapper">
   9     <div id="host"></div>
  10 </div>
  11
  12 <script>
  13 var numDivsInHost = 100;
  14 var array = new Array(numDivsInHost);
  15
  16 function setup()
  17 {
  18     var nDivs = numDivsInHost;
  19
  20     window.shadowRoot = host.createShadowRoot();
  21     shadowRoot.innerHTML = '<h2>Selected</h2><div id="selected"><content select=".selected"></content></div><h2>NonSelected</h2><div id="nonselected"><content></content></div>';
  22
  23     for (var i = 0; i < nDivs; ++i) {
  24         var div = document.createElement('div');
  25         div.appendChild(document.createTextNode('div' + i));
  26         host.appendChild(div);
  27         array[i] = div;
  28     }
  29 }
  30
  31 function run()
  32 {
  33     var nDivs = numDivsInHost;
  34     var array = window.array;
  35
  36     var selected = shadowRoot.getElementById('selected');
  37     var nonSelected = shadowRoot.getElementById('nonselected');
  38
  39     for (var i = 2; i < 100; ++i) {
  40         for (var j = 0; j < nDivs; ++j)
  41             array[j].className = (j % i == 0) ? 'selected' : '';
  42         PerfTestRunner.forceLayoutOrFullFrame();
  43     }
  44 }
  45
  46 function done()
  47 {
  48     wrapper.innerHTML = '';
  49 }
  50
  51
  52 setup();
  53
  54 PerfTestRunner.measureTime({
  55     description: "Measure distribution and layout performance when className is changed",
  56     run: run,
  57     done: done
  58 });
  59 </script>
  60 </body>
  61 </html>