haikuwebkit/LayoutTests/fast/visual-viewport/zoomed-fixed.html

132 lines
3.7 KiB
HTML
Raw Permalink Normal View History

Add basic visual/layout viewport support for fixed position layout https://bugs.webkit.org/show_bug.cgi?id=164261 Reviewed by Dean Jackson. Source/WebCore: This patch adds a new behavior for position:fixed objects on zooming. Instead of interpolating between two implicit viewports as we do now, have explicit and distinct layout and visual viewports. The layout viewport is always the size of the initial containing block (i.e. the RenderView). Position:fixed and sticky elements are laid out relative to the layout viewport. The visual viewport is the visible part of the view, in content coordinates. When the user pans and zooms, the visual viewport changes. If it hits the edge of the layout viepwort, it pushes the layout viewport in that direction; it's as if the user is dragging the layout viewport around. The layout viewport is maintained on FrameView, and has to be recomputed when the scroll position changes, when the view size changes, and when the content size (which affets min/max scroll position) changes. Layout viewport size and position are computed in unzoomed coordinates, requiring some new functions on FrameView to return these. Updated the TileCoverageMap to show the layout viewport visually. Subsequent patches will plumb the layout and visual viewports through the scrolling tree. Tests: fast/visual-viewport/nonzoomed-rects.html fast/visual-viewport/zoomed-fixed-scroll-down-then-up.html fast/visual-viewport/zoomed-fixed.html fast/visual-viewport/zoomed-rects.html * page/FrameView.cpp: (WebCore::FrameView::fixedScrollableAreaBoundsInflatedForScrolling): (WebCore::FrameView::scrollPositionRespectingCustomFixedPosition): (WebCore::FrameView::computeLayoutViewportOrigin): (WebCore::FrameView::setLayoutViewportOrigin): (WebCore::FrameView::updateLayoutViewport): (WebCore::FrameView::minStableLayoutViewportOrigin): (WebCore::FrameView::maxStableLayoutViewportOrigin): (WebCore::FrameView::layoutViewportRect): (WebCore::FrameView::visualViewportRect): (WebCore::FrameView::viewportConstrainedVisibleContentRect): (WebCore::FrameView::rectForFixedPositionLayout): (WebCore::FrameView::scrollPositionForFixedPosition): (WebCore::FrameView::unscaledMinimumScrollPosition): (WebCore::FrameView::unscaledMaximumScrollPosition): (WebCore::FrameView::scrollPositionChanged): (WebCore::FrameView::availableContentSizeChanged): (WebCore::FrameView::performPostLayoutTasks): (WebCore::FrameView::scrollTo): (WebCore::FrameView::useCustomFixedPositionLayoutRect): * page/FrameView.h: * page/Settings.in: * page/scrolling/AsyncScrollingCoordinator.cpp: (WebCore::AsyncScrollingCoordinator::updateScrollPositionAfterAsyncScroll): * platform/graphics/TiledBacking.h: * platform/graphics/ca/TileController.cpp: (WebCore::TileController::setLayoutViewportRect): * platform/graphics/ca/TileController.h: * platform/graphics/ca/TileCoverageMap.cpp: (WebCore::TileCoverageMap::TileCoverageMap): (WebCore::TileCoverageMap::update): * platform/graphics/ca/TileCoverageMap.h: * rendering/RenderBoxModelObject.cpp: (WebCore::RenderBoxModelObject::constrainingRectForStickyPosition): * rendering/RenderLayerBacking.cpp: (WebCore::RenderLayerBacking::updateCompositedBounds): * rendering/RenderLayerCompositor.cpp: (WebCore::RenderLayerCompositor::requiresCompositingForPosition): (WebCore::RenderLayerCompositor::computeFixedViewportConstraints): * rendering/RenderTreeAsText.cpp: (WebCore::externalRepresentation): Logging here is useful when debugging tests. * testing/Internals.cpp: (WebCore::Internals::layoutViewportRect): Expose these rects so tests can dump them. (WebCore::Internals::visualViewportRect): * testing/Internals.h: * testing/Internals.idl: Source/WebKit2: Don't make visualViewportEnabled an experimental feature, because I don't want it enabled by default in WebKitTestRunner (and therefore mismatching DumpRenderTree). * Shared/WebPreferencesDefinitions.h: Tools: Don't give tests in the "visual-viewport" directory a flexible viewport. * DumpRenderTree/mac/DumpRenderTree.mm: (shouldMakeViewportFlexible): * WebKitTestRunner/TestOptions.cpp: (WTR::shouldMakeViewportFlexible): LayoutTests: * fast/visual-viewport/nonzoomed-rects-expected.txt: Added. * fast/visual-viewport/nonzoomed-rects.html: Added. * fast/visual-viewport/zoomed-fixed-expected.txt: Added. * fast/visual-viewport/zoomed-fixed-scroll-down-then-up-expected.txt: Added. * fast/visual-viewport/zoomed-fixed-scroll-down-then-up.html: Added. * fast/visual-viewport/zoomed-fixed.html: Added. * fast/visual-viewport/zoomed-rects-expected.txt: Added. * fast/visual-viewport/zoomed-rects.html: Added. * platform/ios-simulator/fast/visual-viewport/nonzoomed-rects-expected.txt: Added. * platform/ios-simulator/fast/visual-viewport/zoomed-fixed-scroll-down-then-up-expected.txt: Added. * platform/ios-simulator/fast/visual-viewport/zoomed-rects-expected.txt: Added. * resources/js-test-pre.js: (evalAndLog): (evalAndLogResult): (shouldEvaluateTo): Canonical link: https://commits.webkit.org/181988@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@208213 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2016-11-01 05:32:35 +00:00
<!DOCTYPE html>
<html>
<head>
<style>
body {
height: 2000px;
width: 2000px;
}
.fixed {
position: fixed;
background-color: gray;
}
#top, #bottom {
width: 100%;
left: 0;
height: 100px;
}
#left, #right {
width: 100px;
top: 0;
height: 100%;
}
#top { top: 0; }
#bottom { bottom: 0; }
#left { left: 0; }
#right { right: 0; }
</style>
<script src="../../resources/js-test-pre.js"></script>
<script>
description("This test zooms and scrolls the page and checks the positions of fixed-position objects.");
window.jsTestIsAsync = true;
var fixedElement;
function logFixedObject(objectID)
{
debug('client rect of ' + objectID + ':');
fixedElement = document.getElementById(objectID);
evalAndLogResult("JSON.stringify(fixedElement.getBoundingClientRect())");
}
function doAfterZooming()
{
// Zooming may scroll the view away from the origin.
window.scrollTo(0, 0);
evalAndLogResult("JSON.stringify(internals.layoutViewportRect())");
evalAndLogResult("JSON.stringify(internals.visualViewportRect())");
logFixedObject('top');
logFixedObject('bottom');
logFixedObject('left');
logFixedObject('right');
debug('');
window.scrollTo(475, 525);
debug('Scrolled to ' + window.scrollX + ', ' + window.scrollY);
evalAndLogResult("JSON.stringify(internals.layoutViewportRect())");
evalAndLogResult("JSON.stringify(internals.visualViewportRect())");
logFixedObject('top');
logFixedObject('bottom');
logFixedObject('left');
logFixedObject('right');
debug('');
window.scrollTo(100, 776);
debug('Scrolled to ' + window.scrollX + ', ' + window.scrollY);
evalAndLogResult("JSON.stringify(internals.layoutViewportRect())");
evalAndLogResult("JSON.stringify(internals.visualViewportRect())");
logFixedObject('top');
logFixedObject('bottom');
logFixedObject('left');
logFixedObject('right');
debug('');
window.scrollTo(50, 300);
debug('Scrolled to ' + window.scrollX + ', ' + window.scrollY);
evalAndLogResult("JSON.stringify(internals.layoutViewportRect())");
evalAndLogResult("JSON.stringify(internals.visualViewportRect())");
logFixedObject('top');
logFixedObject('bottom');
logFixedObject('left');
logFixedObject('right');
window.scrollTo(0, 0);
finishJSTest();
}
function getUIScript()
{
return `(function() {
uiController.zoomToScale(2, function() {
uiController.uiScriptComplete(uiController.zoomScale);
});
})();`;
}
function doTest()
{
if (!window.testRunner)
return;
testRunner.runUIScript(getUIScript(), function(zoomScale) {
doAfterZooming();
});
}
window.addEventListener('load', doTest, false);
</script>
</head>
<body>
<div id="top" class="fixed"></div>
<div id="bottom" class="fixed"></div>
<div id="left" class="fixed"></div>
<div id="right" class="fixed"></div>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>