corysanin/tubestation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bug 1990786: Don't transform empty overflow. a=RyanVM

Browse Source 
Original Revision: https://phabricator.services.mozilla.com/D266907

Differential Revision: https://phabricator.services.mozilla.com/D267818
This commit is contained in:
David Shin
2025-10-09 12:13:23 +00:00
committed by rvandermeulen@mozilla.com
parent 1d31c84e92
commit 19f835d232
2 changed files with 51 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
layout/generic/nsIFrame.cpp
View File

@@ -10932,8 +10932,13 @@ bool nsIFrame::FinishAndStoreOverflow(OverflowAreas& aOverflowAreas,
TransformReferenceBox refBox(this);
for (const auto otype : AllOverflowTypes()) {
nsRect& o = aOverflowAreas.Overflow(otype);
// If the overflow is empty, it can still have a non-zero length in one axis.
// Transforming such axis-bound rect can cause the resulting rect to be non-empty,
// e.g. by rotating the rect.
if (!o.IsEmpty()) {
o = nsDisplayTransform::TransformRect(o, this, refBox);
}
}
/* If we're the root of the 3d context, then we want to include the
* overflow areas of all the participants. This won't have happened yet as

45
testing/web-platform/tests/css/css-overflow/scrollable-overflow-transform-011.html Normal file
View File

@@ -0,0 +1,45 @@
<!DOCTYPE html>
<html class="reftest-wait">
<meta charset="utf-8">
<title>CSS Overflow: Scrollable Overflow Transform Zero Area Overflow</title>
<link rel="author" title="David Shin" href="mailto:dshin@mozilla.com">
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable" />
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1990786" />
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<style>
.transformed {
height: 0;
width: 0;
transform: rotate(89deg);
text-indent: 250px;
}
.transformed::after {
text-indent: 0;
content: "";
}
.outer {
width: 100px;
height: 100px;
overflow: hidden;
background: red;
}
.good {
width: 200px;
height: 200px;
background: green;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div id=dut class=outer>
<div class=good></div>
<div class=transformed></div>
</div>
<script>
dut.scrollTo(0, dut.scrollHeight)
document.documentElement.classList.remove('reftest-wait');
</script>
</html>