LayoutTests/perf/clone-with-focus.html

   1 <!DOCTYPE html>
   2 <html>
   3   <body>
   4     <input id="input">
   5     <ul id="list"><li><span></span></li></ul>
   6     <div id="console"></div>
   7
   8     <script>
   9         if (window.testRunner)
  10             testRunner.dumpAsText();
  11
  12         var listElement = document.getElementById('list');
  13         var templateElement = list.firstChild;
  14         var inputElement = document.getElementById('input');
  15
  16         function test(numberOfElements, focusInput)
  17         {
  18             if (focusInput)
  19                 inputElement.focus();
  20
  21             var startTime = Date.now();
  22             for (var i = 0; i < numberOfElements; i++) {
  23                 var clone = templateElement.cloneNode(true);
  24                 clone.childNodes[0].textContent = i;
  25                 listElement.appendChild(clone);
  26             }
  27             var endTime = Date.now();
  28
  29             if (focusInput)
  30                 inputElement.blur();
  31
  32             while (listElement.firstChild != listElement.lastChild)
  33                 listElement.removeChild(listElement.lastChild);
  34
  35             return endTime - startTime;
  36         }
  37
  38         function log(str)
  39         {
  40             var element = document.createElement('div');
  41             element.appendChild(document.createTextNode(str));
  42             document.getElementById('console').appendChild(element);
  43         }
  44
  45         var timeWithoutFocus = test(1000, false);
  46         var timeWithFocus = test(1000, true);
  47
  48         if (Math.abs(timeWithFocus - timeWithoutFocus) <= timeWithoutFocus) {
  49             log('PASS. Cloning elements takes roughly as long with as without focus.');
  50         } else {
  51             log('FAIL. Cloning 1000 elements with focus took ' + timeWithFocus + 'ms, without took ' + timeWithoutFocus + 'ms.');
  52         }
  53     </script>
  54   </body>
  55 </html>