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> 66
