LayoutTests/perf/show-hide-table-rows.html

   1 <style>
   2 .hidden { display: none; }
   3 </style>
   4 <script src="../resources/magnitude-perf.js"></script>
   5 <body>
   6 <div></div>
   7 <script>
   8
   9 function setupFunction(magnitude)
  10 {
  11     var html = '<table>';
  12     for (var i = 0; i < magnitude; ++i)
  13         html += '<tr><td>A</td><td>B</td><td>C</td><td>D</td><td>E</td><td>F</td></tr>\n';
  14     html += '</table>';
  15     document.querySelector('div').innerHTML = html;
  16 }
  17
  18 function forEachRow(what)
  19 {
  20     Array.prototype.forEach.call(document.querySelectorAll("tr"), what);
  21 }
  22
  23 function test(magnitude)
  24 {
  25     forEachRow(function(tr) {
  26         tr.className = 'hidden';
  27     });
  28     document.body.offsetWidth;
  29     forEachRow(function(tr) {
  30         tr.className = '';
  31     });
  32     document.body.offsetWidth;
  33 }
  34
  35 Magnitude.description("Tests that hiding/showing of table rows is linear.");
  36 Magnitude.run(setupFunction, test, Magnitude.LINEAR);
  37 document.querySelector('div').textContent = '';
  38 </script>
  39 </body>