touch-gesture-scroll-iframe-past-extent.html

<!DOCTYPE html>
<script src="../../../../resources/testharness.js"></script>
<script src="../../../../resources/testharnessreport.js"></script>
<script src="../../../../resources/gesture-util.js"></script>
<script src="../../../../resources/testdriver.js"></script>
<script src="../../../../resources/testdriver-actions.js"></script>
<script src="../../../../resources/testdriver-vendor.js"></script>
<style>
  body {
    margin: 0;
  }

  #bluebox {
    width: 100px;
    height: 100px;
    background: blue;
  }

  iframe {
    border-width: 0;
    width: 300px;
    height: 150px;
  }

  #container {
    position: relative;
    width: 150px;
    height: 150px;
    overflow-y: scroll;
    overflow-x: scroll;
  }

  #outerdiv {
    width: 200px;
    height: 200px;
    overflow-y: scroll;
    overflow-x: scroll;
  }

</style>

<div id="outerdiv">
  <div id="container">
    <iframe id="touch-target-iframe"
        src="resources/scroll-inside-editable-iframe-promise-resolve-on-load.html">
    </iframe>
  </div>
  <div id="bluebox"></div>
</div>
<p id="description"></p>
<div id="console"></div>
<script>
promise_test (async () => {
  await waitForCompositorCommit();
  await iframeOnLoadPromise;

  const frame = document.getElementById("touch-target-iframe");
  const innerScroller = document.getElementById("container");
  const outerScroller = document.getElementById("outerdiv");
  const frameScroller = frame.contentDocument.scrollingElement;
  const scrollRange =
      frame.contentDocument.body.scrollHeight - frame.clientHeight;

  // Jump to a position shortly before the bottom of the frame's content.
  let initialScrollPos =
      Math.trunc(scrollRange - innerScroller.clientHeight / 4);
  await waitForScrollReset(frameScroller, 0, initialScrollPos);
  assert_equals(frameScroller.scrollTop, initialScrollPos);
  assert_equals(innerScroller.scrollTop, 0);
  assert_equals(outerScroller.scrollTop, 0);

  const dragStart = elementCenter(innerScroller);
  const dragDeltaX = 0;
  const dragDeltaY = -innerScroller.clientHeight / 2;

  await touchScroll(dragStart.x, dragStart.y, dragDeltaX, dragDeltaY,
                    frameScroller);

  assert_equals(frameScroller.scrollTop, scrollRange);

  await raf();
  await raf();
  assert_equals(innerScroller.scrollTop, 0);
  assert_equals(outerScroller.scrollTop, 0);
}, 'This tests that a gesture scroll isn\'t propagated from an ' +
   'iframe to an outer div when the iframe has no remaining ' +
   'scroll offset.');
</script>
chromium/third_party/blink/web_tests/fast/events/touch/gesture/touch-gesture-scroll-iframe-past-extent.html
