OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <head> |
| 4 <script src="../../../../resources/js-test.js"></script> |
| 5 <link rel="stylesheet" href="../resources/touch-hover-active-tests.css"> |
| 6 <style> |
| 7 #box { |
| 8 width: 300px; |
| 9 height: 50px; |
| 10 } |
| 11 |
| 12 #overflowBox { |
| 13 width: 300px; |
| 14 height: 600px; |
| 15 } |
| 16 |
| 17 #container { |
| 18 width: 300px; |
| 19 height: 50px; |
| 20 overflow-y: scroll; |
| 21 overflow-x: hidden; |
| 22 margin: 10px 0 10px 0; |
| 23 } |
| 24 |
| 25 #spacer { |
| 26 display: none; |
| 27 width: 100px; |
| 28 height: 600px; |
| 29 } |
| 30 </style> |
| 31 </head> |
| 32 <body> |
| 33 <div id="box" class="touch-interactive">Gestures go here</div> |
| 34 <div id="container"> |
| 35 <div id="overflowBox" class="touch-interactive">Gestures go here</div> |
| 36 </div> |
| 37 |
| 38 <p id="description"></p> |
| 39 <p>See http://crbug.com/316974 for details</p> |
| 40 |
| 41 <div id="console"></div> |
| 42 |
| 43 <div id="spacer"></div> |
| 44 |
| 45 <script src="../resources/touch-hover-active-tests.js"></script> |
| 46 <script> |
| 47 var box = document.getElementById("box"); |
| 48 var container = document.getElementById("container"); |
| 49 var overflowBox = document.getElementById("overflowBox"); |
| 50 |
| 51 if (window.internals) { |
| 52 internals.settings.setViewportEnabled(true); |
| 53 internals.settings.setViewportMetaEnabled(true); |
| 54 } |
| 55 |
| 56 description("Tests gesture tapdown behaviour on different scroll / pinch setting
s."); |
| 57 |
| 58 function runTests() |
| 59 { |
| 60 if (!window.eventSender) { |
| 61 debug('This test requires DRT.'); |
| 62 return; |
| 63 } |
| 64 |
| 65 if (!eventSender.gestureTapDown |
| 66 || !eventSender.gestureShowPress) { |
| 67 debug('Gesture events are not supported by this platform'); |
| 68 return; |
| 69 } |
| 70 |
| 71 // Insert meta tag after viewport has been enabled via internals |
| 72 var meta = document.createElement('meta'); |
| 73 meta.name = 'viewport'; |
| 74 meta.content = 'initial-scale=1, maximum-scale=2'; |
| 75 document.head.appendChild(meta); |
| 76 |
| 77 // Verify behaviour when page is pinchable |
| 78 debug("Scroll disabled, Pinch enabled."); |
| 79 var boxLocation = elementCenter(box); |
| 80 hasEarlyShowPress("getHoverActiveState(box)", boxLocation, false); |
| 81 |
| 82 // Send a sequence to another element to clear current one without relying o
n tap |
| 83 var containerLocation = elementCenter(container); |
| 84 eventSender.gestureTapDown(containerLocation.x, containerLocation.y); |
| 85 eventSender.gestureShowPress(containerLocation.x, containerLocation.y); |
| 86 eventSender.gestureTapCancel(containerLocation.x, containerLocation.y); |
| 87 |
| 88 // Update viewport to make page non-pinchable |
| 89 meta.content = 'width=device-width, initial-scale=1, user-scalable=no'; |
| 90 |
| 91 // Verify behaviour when page isn't scrollable or pinchable |
| 92 debug("Scroll disabled, Pinch disabled."); |
| 93 hasEarlyShowPress("getHoverActiveState(box)", boxLocation, true); |
| 94 |
| 95 // Verify behaviour when ancestor is scrollable |
| 96 debug("overflowBox with scrollable ancestor."); |
| 97 hasEarlyShowPress("getHoverActiveState(overflowBox)", containerLocation, fal
se); |
| 98 |
| 99 // Now check when page becomes scrollable |
| 100 document.getElementById('spacer').style.display = 'block'; |
| 101 debug("Scroll enabled, Pinch disabled."); |
| 102 hasEarlyShowPress("getHoverActiveState(box)", boxLocation, false); |
| 103 } |
| 104 |
| 105 window.onload = runTests; |
| 106 </script> |
| 107 </body> |
| 108 </html> |
| 109 |
OLD | NEW |