Skip to content
Permalink
Browse files
contain:content on the body breaks scrolling
https://bugs.webkit.org/show_bug.cgi?id=244989

Reviewed by Simon Fraser.

Do not take paint containment into account when deciding
whether the viewport scrollbars needs to be enabled.

Behavior matches Firefox and Chrome.

* LayoutTests/imported/w3c/web-platform-tests/css/css-contain/contain-paint-050-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-contain/contain-paint-050-ref.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-contain/contain-paint-050.html: Added.
* Source/WebCore/page/FrameView.cpp:
(WebCore::FrameView::applyOverflowToViewport):

Canonical link: https://commits.webkit.org/254506@main
  • Loading branch information
rwlbuis committed Sep 15, 2022
1 parent cb185fe commit 2bf7fb96494b9ccf14e3e6d26c054419eb44ced4
Show file tree
Hide file tree
Showing 4 changed files with 90 additions and 2 deletions.
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html class="reftest-wait">
<title>CSS Containment Test: Scrolling overflow works when paint is contained"</title>
<link rel="help" href="https://drafts.csswg.org/css-contain-1/#containment-paint">
<meta name="assert" content="Scrolling overflow works when paint is contained.">

<script src="/common/reftest-wait.js"></script>
<script src="/common/rendering-utils.js"></script>

<style>
.content {
height: 100vh;
width: 100%;
}
</style>

<body>
<div class="content"></div>

<script>
waitForAtLeastOneFrame().then(() => {
document.body.scrollTop = 100;
takeScreenshot();
});
</script>

</body>
</html>
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html class="reftest-wait">
<title>CSS Containment Test: Scrolling overflow works when paint is contained"</title>
<link rel="help" href="https://drafts.csswg.org/css-contain-1/#containment-paint">
<meta name="assert" content="Scrolling overflow works when paint is contained.">

<script src="/common/reftest-wait.js"></script>
<script src="/common/rendering-utils.js"></script>

<style>
.content {
height: 100vh;
width: 100%;
}
</style>

<body>
<div class="content"></div>

<script>
waitForAtLeastOneFrame().then(() => {
document.body.scrollTop = 100;
takeScreenshot();
});
</script>

</body>
</html>
@@ -0,0 +1,32 @@
<!DOCTYPE html>
<html class="reftest-wait">
<title>CSS Containment Test: Scrolling overflow works when paint is contained"</title>
<link rel="help" href="https://drafts.csswg.org/css-contain-1/#containment-paint">
<link rel="match" href="contain-paint-050-ref.html">
<meta name="assert" content="Scrolling overflow works when paint is contained.">

<script src="/common/reftest-wait.js"></script>
<script src="/common/rendering-utils.js"></script>

<style>
body {
contain: paint;
}
.content {
height: 100vh;
width: 100%;
}
</style>

<body>
<div class="content"></div>

<script>
waitForAtLeastOneFrame().then(() => {
document.body.scrollTop = 100;
takeScreenshot();
});
</script>

</body>
</html>
@@ -618,8 +618,8 @@ void FrameView::applyOverflowToViewport(const RenderElement& renderer, Scrollbar

bool overrideHidden = frame().isMainFrame() && ((frame().frameScaleFactor() > 1) || headerHeight() || footerHeight());

Overflow overflowX = renderer.effectiveOverflowX();
Overflow overflowY = renderer.effectiveOverflowY();
Overflow overflowX = renderer.style().overflowX();
Overflow overflowY = renderer.style().overflowY();

#if ENABLE(LAYER_BASED_SVG_ENGINE)
if (is<RenderSVGRoot>(renderer)) {

0 comments on commit 2bf7fb9

Please sign in to comment.