diff options
Diffstat (limited to 'gfx/layers/apz/test/mochitest/helper_position_sticky_scroll_handoff.html')
-rw-r--r-- | gfx/layers/apz/test/mochitest/helper_position_sticky_scroll_handoff.html | 88 |
1 files changed, 88 insertions, 0 deletions
diff --git a/gfx/layers/apz/test/mochitest/helper_position_sticky_scroll_handoff.html b/gfx/layers/apz/test/mochitest/helper_position_sticky_scroll_handoff.html new file mode 100644 index 0000000000..ae7815a2fc --- /dev/null +++ b/gfx/layers/apz/test/mochitest/helper_position_sticky_scroll_handoff.html @@ -0,0 +1,88 @@ +<!DOCTYPE HTML> +<html> +<head> + <title>APZ overscroll handoff for sticky elements</title> + <script type="application/javascript" src="apz_test_utils.js"></script> + <script type="application/javascript" src="apz_test_native_event_utils.js"></script> + <script src="/tests/SimpleTest/paint_listener.js"></script> + <meta name="viewport" content="width=device-width"/> + <style> +html, body { + height: 100%; + overflow: hidden; + margin: 0; +} + +#main { + height: 100%; + overflow: auto; +} + +#spacer { + height: 5000px; +} + +#sticky { + position: sticky; + top: 50%; + left: 0; + width: 100%; + height: 100px; + background: red; + overflow: auto; +} + +#long { + height: 250px; + width: 50%; + position: absolute; + background: green; + top: 0; + left: 25%; +} + </style> +</head> +<body> + <div id="main"> + <div id="sticky"> + <div id="long"> + </div> + </div> + <div id="spacer"> + </div> + </div> +</body> +<script type="application/javascript"> + +async function test() { + // Scroll to the bottom of the sticky position element that should not + // allow overscroll handoff. + sticky.scrollTop = sticky.scrollHeight; + + // After scrolling to bottom tick the refresh driver. + await promiseFrame(); + + info("Start: sticky=" + sticky.scrollTop + " main=" + main.scrollTop); + + let transformEnd = promiseTransformEnd(); + + // Async scroll the sticky element by 200 pixels using the mouse-wheel. + // This should handoff the overscroll to the parent element. + await promiseMoveMouseAndScrollWheelOver(sticky, 25, 25, false, 200); + + // Wait for the trasform triggered by the gesture to complete. + await transformEnd; + await promiseApzFlushedRepaints(); + + info("After scroll: sticky=" + sticky.scrollTop + " main=" + main.scrollTop); + + // Ensure that the main element has scrolled. + isnot(main.scrollTop, 0, "The overscroll should handoff"); +} + +waitUntilApzStable() +.then(test) +.then(subtestDone, subtestFailed); + +</script> +</html> |