summaryrefslogtreecommitdiffstats
path: root/gfx/layers/apz/test/mochitest/helper_fission_tap_on_zoomed.html
blob: 5d99b972c25abebdc33d7acccd3f2fa044661d13 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <title>Test to ensure events get delivered properly for an OOP iframe</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <script src="/tests/SimpleTest/paint_listener.js"></script>
  <script src="helper_fission_utils.js"></script>
  <script src="apz_test_utils.js"></script>
  <script src="apz_test_native_event_utils.js"></script>
  <script>

// Copied from helper_fission_touch.html, differences are 1) the iframe is not
// transformed instead it's offseted by margin values, 2) the top level document
// is zoomed by 2.0, 3) using documentElement instead of body to query
// getBoundingClientRect() because margin collapsing happens between the body
// and the offseted div (i.e. getBoundingClientRect() for body returns 100px top
// value).

fission_subtest_init();

SpecialPowers.getDOMWindowUtils(window).setResolutionAndScaleTo(2.0);

FissionTestHelper.startTestPromise
  .then(waitUntilApzStable)
  .then(loadOOPIFrame("testframe", "helper_fission_empty.html"))
  .then(waitUntilApzStable)
  .then(test)
  .then(FissionTestHelper.subtestDone, FissionTestHelper.subtestFailed);

let code_for_oopif_to_run = function() {
  document.addEventListener("click", function(e) {
    dump(`OOPIF got click at ${e.clientX},${e.clientY}\n`);
    let result = { x: e.clientX, y: e.clientY };
    FissionTestHelper.fireEventInEmbedder("OOPIF:ClickData", result);
  }, {once: true});
  dump("OOPIF registered click listener\n");
  return true;
};

function failsafe() {
  // Catch and fail faster on the case where the click ends up not going to
  // the iframe like it should. Otherwise the test hangs until timeout which
  // is more painful.
  document.addEventListener("click", function(e) {
    dump(`${location.href} got click at ${e.clientX},${e.clientY}\n`);
    ok(false, "The OOPIF hosting page should not have gotten the click");
    setTimeout(FissionTestHelper.subtestDone, 0);
  }, {once: true});
}

async function test() {
  let iframeElement = document.getElementById("testframe");

  let iframeResponse = await FissionTestHelper.sendToOopif(iframeElement, `(${code_for_oopif_to_run})()`)
  dump("OOPIF response: " + JSON.stringify(iframeResponse) + "\n");
  ok(iframeResponse, "code_for_oopif_to_run successfully installed");

  iframePromise = promiseOneEvent(window, "OOPIF:ClickData", null);
  await synthesizeNativeTap(document.documentElement, 200, 200, function() {
    dump("Finished synthesizing click, waiting for OOPIF message...\n");
  });
  iframeResponse = await iframePromise;
  dump("OOPIF response: " + JSON.stringify(iframeResponse.data) + "\n");

  let expected_coord = 100; // because the iframe is offseted by (100, 100).
  ok(Math.abs(iframeResponse.data.x - expected_coord) < 3,
     `x-coord ${iframeResponse.data.x} landed near expected value ${expected_coord}`);
  ok(Math.abs(iframeResponse.data.y - expected_coord) < 3,
     `y-coord ${iframeResponse.data.y} landed near expected value ${expected_coord}`);
}

  </script>
  <style>
    body, html {
        margin: 0;
    }
    div {
        margin-left: 100px;
        margin-top: 100px;
        width: 500px;
    }
    iframe {
        width: 400px;
        height: 300px;
        border: solid 1px black;
    }
  </style>
</head>
<body onload="failsafe()">
<div><iframe id="testframe"></iframe></div>
</body>
</html>