Home | History | Annotate | Download | only in CSS
      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4 <script src="../resources/runner.js"></script>
      5 <style>
      6   .root .child {}
      7 </style>
      8 </head>
      9 <body>
     10 <div id="root"></div>
     11 <script>
     12 function addChildren(element, numChildren, idPrefix)
     13 {
     14     for (var i = 0; i < numChildren; i++) {
     15         var child = document.createElement("div");
     16         child.id = idPrefix  + i;
     17         element.appendChild(child);
     18     }
     19 }
     20 
     21 function makeTree(element, depth, fanOut, idPrefix)
     22 {
     23     if (depth <= 0)
     24         return;
     25     addChildren(element, fanOut, idPrefix);
     26     for (var child = element.firstChild; child.nextSibling; child = child.nextSibling) {
     27         makeTree(child, depth - 1, fanOut, child.id);
     28     }
     29     if (child)
     30         makeTree(child, depth - 1, fanOut, child.id);
     31 }
     32 
     33 var root = document.querySelector("#root");
     34 makeTree(root, 6, 5, "child");
     35 
     36 var child = document.querySelector("#child012341");
     37 child.className = "child";
     38 var runFunction = function()
     39 {
     40     root.offsetHeight; // force recalc style
     41     root.className = "root";
     42     root.offsetHeight;
     43     root.className = "";
     44 }
     45 
     46 PerfTestRunner.measureRunsPerSecond({run: runFunction});
     47 
     48 </script>
     49 </body>
     50 </html>
     51