helper_hittest_deep_scene_stack.html (1794B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Exercising the APZ/WR hit-test with a deep scene that produces many results</title> 5 <script type="application/javascript" src="apz_test_utils.js"></script> 6 <script type="application/javascript" src="apz_test_native_event_utils.js"></script> 7 <script src="/tests/SimpleTest/paint_listener.js"></script> 8 <meta name="viewport" content="width=device-width"/> 9 <style> 10 body { 11 transform-style: preserve-3d; 12 } 13 14 div { 15 height: 100px; 16 background-color: rgba(0, 255, 0, 0.1); 17 transform: translateX(1px); 18 } 19 </style> 20 </head> 21 <body> 22 <script> 23 24 // Create a 1000-deep set of nested divs with some transparency and transforms. 25 // This ensures that the WR hit-test will return all of the divs at the tested 26 // point, rather than just the topmost one. We set a touch-action property on 27 // this div so that we can ensure we're hit-testing at the right spot. 28 var div = document.createElement('div'); 29 div.id = "innermost"; 30 div.style.touchAction = "pan-x pan-y"; 31 div.style.width = "2px"; 32 33 for (var i = 3; i < 1000; i++) { 34 var container = document.createElement('div'); 35 container.style.width = i + "px"; 36 container.appendChild(div); 37 div = container; 38 } 39 document.body.appendChild(div); 40 41 async function test() { 42 var config = getHitTestConfig(); 43 var utils = config.utils; 44 45 // Hit-test at the deepest point of divs. 46 checkHitResult(hitTest(centerOf(document.getElementById("innermost"))), 47 APZHitResultFlags.VISIBLE | APZHitResultFlags.PINCH_ZOOM_DISABLED | APZHitResultFlags.DOUBLE_TAP_ZOOM_DISABLED, 48 utils.getViewId(document.scrollingElement), 49 utils.getLayersId(), 50 "innermost div"); 51 } 52 53 54 waitUntilApzStable().then(test).then(subtestDone, subtestFailed); 55 56 </script> 57 </body>