third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-frame-move.html

   1 <!DOCTYPE HTML>
   2 <script src="../../../../resources/js-test.js"></script>
   3 <style>
   4 html, body {
   5  margin: 0;
   6 }
   7 body {
   8   height: 1000px;
   9 }
  10 #target {
  11   width: 50px;
  12   height: 50px;
  13 }
  14 </style>
  15 <iframe frameborder=0 id="target" src="resources/event-delegator-boxes.html"></iframe>
  16 <div id=console></div>
  17 <script>
  18 var event;
  19 var frameRect = target.getBoundingClientRect();
  20 var pointInFrame = {
  21     x: frameRect.width / 2,
  22     y: frameRect.height / 2
  23 };
  24 var pointInWindow = {
  25     x: frameRect.left + pointInFrame.x,
  26     y: frameRect.top + pointInFrame.y
  27 };
  28
  29 var eventReceived = {};
  30 var currentOffset = 0;
  31 var expectedOffset;
  32 var targetRect;
  33
  34 function offsetFrame() {
  35     currentOffset += 5;
  36     target.style.marginTop = currentOffset + 'px';
  37     target.style.marginLeft = currentOffset + 'px';
  38 }
  39
  40 function onEventInFrame(e) {
  41
  42     // Each mouse event relies on a new hit test except for click.
  43     if (e.type != "click")
  44         expectedOffset = currentOffset;
  45
  46     debug("");
  47     debug("Received " + e.type + " in child frame with currentOffset=" + currentOffset + " expectedOffset=" + expectedOffset);
  48     event = e;
  49     eventReceived[e.type] = true;
  50     shouldBeEqualToNumber("event.screenX", pointInWindow.x);
  51     shouldBeEqualToNumber("event.screenY", pointInWindow.y);
  52     shouldBeEqualToNumber("event.clientX", pointInFrame.x - expectedOffset);
  53     shouldBeEqualToNumber("event.clientY", pointInFrame.y - expectedOffset);
  54     shouldBeEqualToNumber("event.pageX", pointInFrame.x - expectedOffset);
  55     shouldBeEqualToNumber("event.pageY", pointInFrame.y - expectedOffset);
  56
  57     // Verify the node found by hit-testing actually contains the point.
  58     // Note that 'click' is dispatched to the common ancestor of 'mousedown' and 'mouseup'.
  59     shouldBeEqualToString("event.target.nodeName", e.type == "click" ? "BODY" : "DIV");
  60     targetRect = event.target.getBoundingClientRect();
  61     debug("Target element is at (" + targetRect.left + "," + targetRect.top + "," + targetRect.right + "," + targetRect.bottom + ")");
  62     shouldBeGreaterThanOrEqual("targetRect.right", "event.clientX");
  63     shouldBeGreaterThanOrEqual("event.clientX", "targetRect.left");
  64     shouldBeGreaterThanOrEqual("targetRect.bottom", "event.clientY");
  65     shouldBeGreaterThanOrEqual("event.clientY", "targetRect.top");
  66
  67     // Move the frame for the next event.
  68     offsetFrame();
  69 }
  70
  71 description("Verifies mouse event co-ordinates from a tap in an iframe that changes position on each mouse event");
  72
  73 if (window.eventSender) {
  74     jsTestIsAsync = true;
  75     target.onload = function() {
  76         debug("Sending GestureTapDown to " + pointInWindow.x + "," + pointInWindow.y);
  77         eventSender.gestureTapDown(pointInWindow.x, pointInWindow.y);
  78
  79         debug("Sending GestureShowPress");
  80         eventSender.gestureShowPress(pointInWindow.x, pointInWindow.y);
  81
  82         debug("Sending GestureTap");
  83         eventSender.gestureTap(pointInWindow.x, pointInWindow.y);
  84
  85         shouldBeTrue("eventReceived.mousemove");
  86         shouldBeTrue("eventReceived.mousedown");
  87         shouldBeTrue("eventReceived.mouseup");
  88         shouldBeTrue("eventReceived.click");
  89         setTimeout(finishJSTest, 0);
  90     }
  91 } else {
  92     debug("This test requires eventSender");
  93 }
  94 </script>