third_party/WebKit/LayoutTests/fast/events/gesture-pinch-zoom.html

   1 <!DOCTYPE html>
   2 <script src="../../resources/js-test.js"></script>
   3 <div onwheel="wheel(event)" style="margin: 0px 0; width: 100px; height: 100px; background-color: blue;"></div>
   4 <script>
   5 var gotWheelEvent = false;
   6 var testX = 50;
   7 var testY = 40;
   8 var testScale = 1.5;
   9 var tolerance = 0.001;
  10
  11 function wheel(event)
  12 {
  13     shouldBeFalse('gotWheelEvent');
  14     gotWheelEvent = true;
  15     shouldBeTrue('event.ctrlKey');
  16     shouldBeCloseTo('event.deltaX', 0, tolerance);
  17     shouldBeCloseTo('event.deltaY', 100 * Math.log(1 / testScale), tolerance);
  18     shouldBeCloseTo('event.x', testX, tolerance);
  19     shouldBeCloseTo('event.y', testY, tolerance);
  20     event.preventDefault()
  21 }
  22
  23 if (window.eventSender) {
  24   // Do a pinch in a region that prevents the event from propagating up to
  25   // do a zoom.
  26   shouldBe('window.innerWidth', '800');
  27   shouldBe('window.innerHeight', '600');
  28   eventSender.gesturePinchBegin('touchpad', testX, testY);
  29   eventSender.gesturePinchUpdate('touchpad', testX, testY, testScale);
  30   eventSender.gesturePinchEnd('touchpad', testX, testY);
  31   shouldBe('window.innerWidth', '800');
  32   shouldBe('window.innerHeight', '600');
  33   shouldBe('window.scrollX', '0');
  34   shouldBe('window.scrollY', '0');
  35   shouldBeTrue('gotWheelEvent');
  36   gotWheelEvent = false;
  37
  38   // Do a pinch outside of this region and ensure that a zoom occurs, and
  39   // that it occurs around the pinch area.
  40   eventSender.gesturePinchBegin('touchpad', 150, 100);
  41   eventSender.gesturePinchUpdate('touchpad', 150, 100, 2.0);
  42   eventSender.gesturePinchEnd('touchpad', 150, 100);
  43   shouldBe('window.innerWidth', '400');
  44   shouldBe('window.innerHeight', '300');
  45   shouldBe('window.scrollX', '75');
  46   shouldBe('window.scrollY', '50');
  47
  48   shouldBeFalse('gotWheelEvent');
  49 }
  50 </script>