Source code
Revision control
Copy as Markdown
Other Tools
<!DOCTYPE HTML>
<html>
<!--
-->
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="/tests/SimpleTest/paint_listener.js"></script>
  <script src="/tests/SimpleTest/EventUtils.js"></script>
  <script type="application/javascript" src="apz_test_native_event_utils.js"></script>
  <script type="application/javascript" src="apz_test_utils.js"></script>
  <style>
    iframe {
      margin-top: 1000px;
    }
  </style>
</head>
<body>
  <iframe id="subframe" srcdoc="<div id='target' style='width:100px;height:100px;'>" width="100px" height="100px"></iframe>
  <script type="application/javascript">
async function test() {
  let utils = SpecialPowers.getDOMWindowUtils(window);
  // Reproducing the bug requires three ingredients:
  //  1. A large layout viewport offset.
  //  2. A large visual viewport offset relative to the layout viewport.
  //  3. An event that's dispatched in the iframe's document.
  // We make the first two happen by doing a large visual scroll that will
  // also drag the layout viewport with it part of the way.
  let visualScrollPromise = new Promise(resolve => {
    window.visualViewport.addEventListener("scroll", resolve, { once: true });
  });
  utils.scrollToVisual(0, 900, utils.UPDATE_TYPE_MAIN_THREAD,
                       utils.SCROLL_MODE_INSTANT);
  await visualScrollPromise;
  await promiseApzFlushedRepaints();
  let target = subframe.contentWindow.document.getElementById("target");
  // To get an event that's dispatched in the iframe's document,
  // synthesize a native tap. This will synthesize three events:
  // a mouse-move, a mouse-down, and a mouse-up. The mouse-move
  // and mouse-down are dispatched in the root content document.
  // The mouse-down causes the iframe to "capture" the mouse, which
  // leads the mouse-up to be dispatched in the iframe's document
  // instead. We listen for the mouse-up.
  let mouseUpEvent = null;
  let mouseUpPromise = new Promise(resolve => {
    target.addEventListener("mouseup", function(e) {
      mouseUpEvent = e;
      resolve();
    });
  });
  await synthesizeNativeTap(target, 10, 10);
  await mouseUpPromise;
  is(mouseUpEvent.target, target, "mouseup event targeted the correct element");
}
SpecialPowers.getDOMWindowUtils(window).setResolutionAndScaleTo(2.0);
waitUntilApzStable()
.then(test)
.then(subtestDone, subtestFailed);
  </script>
</body>
</html>