helper_doubletap_zoom_square.html (2368B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=2100"/> 6 <title>Check that double tapping on a square img doesn't cut off parts of the image</title> 7 <script type="application/javascript" src="apz_test_native_event_utils.js"></script> 8 <script type="application/javascript" src="apz_test_utils.js"></script> 9 <script src="/tests/SimpleTest/paint_listener.js"></script> 10 <script type="application/javascript"> 11 12 async function test() { 13 let useTouchpad = (location.search == "?touchpad"); 14 15 let resolution = await getResolution(); 16 let initial_resolution = resolution; 17 ok(resolution > 0, 18 "The initial_resolution is " + resolution + ", which is some sane value"); 19 20 let target = document.getElementById("target"); 21 22 // Check that double-tapping once on the element zooms in 23 info("sending first double tap"); 24 await doubleTapOn(target, 20, 20, useTouchpad); 25 let prev_resolution = resolution; 26 resolution = await getResolution(); 27 ok(resolution > prev_resolution, "The first double-tap has increased the resolution to " + resolution); 28 29 let rect = target.getBoundingClientRect(); 30 ok(visualViewport.pageLeft < rect.x, `left: ${visualViewport.pageLeft} < ${rect.x}`); 31 ok(visualViewport.pageTop < rect.y, `top: ${visualViewport.pageTop} < ${rect.y}`); 32 ok(visualViewport.pageLeft + visualViewport.width > rect.x + rect.width, 33 `right: ${visualViewport.pageLeft} + ${visualViewport.width} > ${rect.x} + ${rect.width}`); 34 ok(visualViewport.pageTop + visualViewport.height > rect.y + rect.height, 35 `bottom: ${visualViewport.pageTop} + ${visualViewport.height} > ${rect.y} + ${rect.height}`); 36 37 // Check that double-tapping the second time on the element zooms out 38 info("sending second double tap"); 39 await doubleTapOn(target, 20, 20, useTouchpad); 40 prev_resolution = resolution; 41 resolution = await getResolution(); 42 ok(resolution < prev_resolution, "The second double-tap has decreased the resolution to " + resolution); 43 ok(resolution == initial_resolution, "The second double-tap has restored the resolution to " + resolution); 44 } 45 46 waitUntilApzStable() 47 .then(test) 48 .then(subtestDone, subtestFailed); 49 50 </script> 51 <style> 52 .bigsquare { 53 width: 40vh; 54 height: 40vh; 55 } 56 </style> 57 </head> 58 <body> 59 60 <img id="target" class="bigsquare" src="green100x100.png"> 61 62 </body> 63 </html>