| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <head> |
| 4 <link rel="stylesheet" href="resources/compositor-touch-hit-rects.css"> |
| 5 <style> |
| 6 .scroll { |
| 7 overflow-y: scroll; |
| 8 overflow-x: hidden; |
| 9 border: 1px solid lightgrey; |
| 10 height: 50px; |
| 11 } |
| 12 #transformed { |
| 13 -webkit-transform: translate3d(10px, 10px, 0); |
| 14 } |
| 15 </style> |
| 16 </head> |
| 17 <body> |
| 18 <p id="description"> |
| 19 This test verifies the hit test regions given to the compositor specifically aro
und composited |
| 20 overflow scroll elements. |
| 21 </p> |
| 22 |
| 23 <div id="tests"> |
| 24 <div id="scroll1" class="scroll"> |
| 25 <div style='height: 13px;'></div> |
| 26 <div class="testcase" id="scrollContent">Scroll content</div> |
| 27 <div style='height: 50px;'></div> |
| 28 </div> |
| 29 <div id="scroll2" class="scroll"> |
| 30 <div style='height: 10px;'></div> |
| 31 <div id="scroll2b" class="scroll"> |
| 32 <div style='height: 30px;'></div> |
| 33 <div class="testcase" id="nestedContent">Nested content</div> |
| 34 <div style='height: 30px;'></div> |
| 35 </div> |
| 36 <div style='height: 50px;'></div> |
| 37 </div> |
| 38 <div id="scroll4" class="scroll"> |
| 39 <div style='height: 10px;'></div> |
| 40 <div id="overflowWithHandler" class="scroll testcase"> |
| 41 <div style='height: 30px;'></div> |
| 42 <div>Overflow div with a touch handler</div> |
| 43 <div style='height: 60px;'></div> |
| 44 </div> |
| 45 <div style='height: 50px;'></div> |
| 46 </div> |
| 47 <!-- Note this case needs to be last because the transform can disable |
| 48 accelerated overflow scrolling of any following elements --> |
| 49 <div id="scroll3" class="scroll"> |
| 50 <div style='height: 13px;'></div> |
| 51 <div class="testcase" id="withTransform"> |
| 52 <div id="transformed">Transformed</div> |
| 53 </div> |
| 54 <div style='height: 50px;'></div> |
| 55 </div> |
| 56 |
| 57 |
| 58 </div> |
| 59 |
| 60 <div id="console"></div> |
| 61 <script src="resources/compositor-touch-hit-rects.js"></script> |
| 62 <script> |
| 63 |
| 64 // Scroll after layout has finished and verify that doesn't |
| 65 // cause the hit rects to be recomputed. |
| 66 preRunHandlerForTest['scrollContent'] = function(e) { |
| 67 checkForRectUpdate(false, function() { |
| 68 // Scroll so the rect is visible but slighly clipped. |
| 69 document.getElementById('scroll1').scrollTop = 15; |
| 70 }); |
| 71 }; |
| 72 |
| 73 preRunHandlerForTest['nestedContent'] = function(e) { |
| 74 checkForRectUpdate(false, function() { |
| 75 document.getElementById('scroll2').scrollTop = 20; |
| 76 document.getElementById('scroll2b').scrollTop = 18; |
| 77 }); |
| 78 }; |
| 79 |
| 80 preRunHandlerForTest['withTransform'] = function(e) { |
| 81 checkForRectUpdate(false, function() { |
| 82 document.getElementById('scroll3').scrollTop = 20; |
| 83 }); |
| 84 }; |
| 85 |
| 86 preRunHandlerForTest['overflowWithHandler'] = function(e) { |
| 87 checkForRectUpdate(false, function() { |
| 88 document.getElementById('scroll4').scrollTop = 20; |
| 89 document.getElementById('overflowWithHandler').scrollTop = 18; |
| 90 }); |
| 91 }; |
| 92 |
| 93 if (window.internals) { |
| 94 window.internals.settings.setAcceleratedCompositingForOverflowScrollEnabled(tr
ue); |
| 95 } |
| 96 </script> |
| 97 </body> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 17471008:
Rework compositor touch hit testing (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master