| <!DOCTYPE html> |
| |
| <script src="../../resources/js-test.js"></script> |
| <script> |
| window.jsTestIsAsync = true; |
| window.setPrintTestResultsLazily(); |
| |
| description("Ensure that overflow clamping takes into account the container and content size " + |
| "that are applied in the same animation frame."); |
| |
| |
| function runTests() { |
| var container = document.querySelector("#overflowContainer"); |
| testOverflowClamp(container, container, document.querySelector("#overflowContainer > div")); |
| |
| var iframe = document.querySelector("iframe"); |
| testOverflowClamp(iframe, iframe.contentDocument.body, iframe.contentDocument.body, function(){ |
| setTimeout(finishJSTest, 500); |
| }); |
| |
| function testOverflowClamp(container, scroller, content, onDone) { |
| // ensure 400px of overflow |
| container.style.height = "100px"; |
| content.style.height = "500px"; |
| |
| scroller.scrollTop = 200; |
| |
| window.requestAnimationFrame(function() { |
| // Increase the height of the container by an amount that would cause clamping but also |
| // change the content size by the same amount which should mean that scroll position remains |
| // the same. |
| container.style.height = "500px"; |
| content.style.height = "900px"; |
| |
| window.requestAnimationFrame(function () { |
| window.scroller = scroller; |
| shouldBeEqualToNumber("scroller.scrollTop", 200); |
| |
| if (onDone) onDone(); |
| }); |
| }); |
| } |
| } |
| </script> |
| |
| <div id="overflowContainer" style="overflow: scroll;"> |
| <div></div> |
| </div> |
| <iframe height="100px" onload="runTests()"></iframe> |
