src/third_party/WebKit/PerformanceTests/Events/EventsDispatchingInDeeplyNestedShadowTrees.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script type="text/javascript" src="../resources/runner.js"></script>
   5 </head>
   6 <body>
   7 <div id="root"><div id="child1"></div><div id="child2"></div></div>
   8 <script>
   9 function createTreeOfTrees(root, depth, eachTreeHeight)
  10 {
  11     var node = root;
  12     var i;
  13     for (i = 0; i < eachTreeHeight; ++i) {
  14         var child = document.createElement('div');
  15         node.appendChild(child);
  16         node = child;
  17     }
  18     if (depth == 1)
  19         return;
  20       var child = document.createElement('div');
  21       node.appendChild(child);
  22       var shadowRoot = child.createShadowRoot();
  23       createTreeOfTrees(shadowRoot, depth - 1, eachTreeHeight);
  24 }
  25
  26 function leftMostLeaf(root)
  27 {
  28     var node = root;
  29     while (node.firstChild)
  30         node = node.firstChild
  31     if (!node.shadowRoot)
  32         return node;
  33     return leftMostLeaf(node.shadowRoot)
  34 }
  35
  36 function rightMostLeaf(root)
  37 {
  38     var node = root;
  39     while (node.lastChild)
  40         node = node.lastChild
  41     if (!node.shadowRoot)
  42         return node;
  43     return rightMostLeaf(node.shadowRoot)
  44 }
  45
  46 var root = document.getElementById('root');
  47 createTreeOfTrees(document.getElementById('child1'), 50, 20);
  48 createTreeOfTrees(document.getElementById('child2'), 50, 20);
  49 var leaf1 = leftMostLeaf(root);
  50 var leaf2 = rightMostLeaf(root);
  51
  52 function run()
  53 {
  54     leaf1.dispatchEvent(new MouseEvent('mousemove', {
  55         relatedTarget: leaf2
  56     }));
  57 }
  58
  59 PerfTestRunner.measureRunsPerSecond({
  60     description: "Measure mousemove events dispatching in shadow trees",
  61     run: run
  62 });
  63 </script>
  64 </body>
  65 </html>