| <!DOCTYPE html> |
| <script src="../../../../resources/testharness.js"></script> |
| <script src="../../../../resources/testharnessreport.js"></script> |
| <script src="../../../../resources/gesture-util.js"></script> |
| <style type="text/css"> |
| ::-webkit-scrollbar { |
| width: 0px; |
| height: 0px; |
| } |
| |
| #bluebox { |
| width: 100px; |
| height: 100px; |
| background: blue; |
| padding: 0px; |
| margin: 0px; |
| } |
| |
| #container { |
| width: 150px; |
| height: 150px; |
| overflow-y: scroll; |
| overflow-x: scroll; |
| } |
| |
| #outerdiv { |
| width: 200px; |
| height: 200px; |
| overflow-y: scroll; |
| overflow-x: scroll; |
| } |
| |
| td { |
| padding: 0px; |
| } |
| </style> |
| |
| <body style="margin:0" > |
| <div id="outerdiv"> |
| <table border="0" cellspacing="0px" > |
| <tr><td> |
| <div id="container"> |
| <iframe id="touchtargetiframe" |
| src="resources/scroll-inside-editable-iframe-promise-resolve-on-load.html"> |
| </iframe> |
| </div> |
| </td></tr> |
| <tr><td> |
| <div id="bluebox"></div> |
| </td></tr> |
| </table> |
| </div> |
| </body> |
| |
| <p id="description"></p> |
| <div id="console"></div> |
| <script type="text/javascript"> |
| var touchtarget; |
| var expectedGesturesTotal = 2; |
| var gesturesOccurred = 0; |
| var scrollAmountX = [0, 0]; |
| var scrollAmountY = [0, 0]; |
| var scrollEventsOccurred = 0; |
| var scrolledElement = document.getElementById("outerdiv"); |
| var expectedScrollEventsOccurred = 1; |
| |
| var x = 10; |
| var y = 72; |
| function firstGestureScroll() { |
| return smoothScroll(700, x, y, GestureSourceType.TOUCH_INPUT, "down", |
| SPEED_INSTANT); |
| } |
| |
| function secondGestureScroll() { |
| x = 12; |
| y = 40; |
| return smoothScroll(60, x, y, GestureSourceType.TOUCH_INPUT, "down", |
| SPEED_INSTANT); |
| } |
| |
| function iframeScrollTop() { |
| return touchtarget.contentDocument.scrollingElement.scrollTop; |
| } |
| |
| promise_test (async () => { |
| // Wait for the iframe to be ready before starting the test. |
| await iframeOnLoadPromise; |
| touchtarget = document.getElementById("touchtargetiframe"); |
| touchtarget.contentDocument.addEventListener("scroll", recordScroll); |
| |
| await firstGestureScroll(); |
| await conditionHolds(() => { return notScrolled(); }); |
| await secondGestureScroll(); |
| // wait for the iframe to fully scroll, then wait for 100 to make |
| // sure that the scrolling does not propagate to the outer div. |
| await waitForAnimationEnd(iframeScrollTop, 500, 20); |
| await conditionHolds(() => { return notScrolled(); }); |
| assert_equals(scrollEventsOccurred, expectedScrollEventsOccurred); |
| }, '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> |
