Bug 1805597 - Place a float with insufficient available inline-size below current line regarless of its clearance value. r=jfkthame,layout-reviewers

This bug is a regression of Bug 1323517. This patch fixes the bug by restoring
the behavior to what it was prior to Bug 1323517 Part 7 [1], i.e. a float
element with insufficient available inline-size will be placed below the current
line, regardless of its clearance value. The old logic is here [2] .

`floats-placement-008.html` already passes with current Nightly, but it triggers
this assertion [3] while exploring a solution for this bug. I feel it is worth
to include it as a test.

[1] https://hg.mozilla.org/mozilla-central/rev/d08bab0259f7
[2] https://searchfox.org/mozilla-central/rev/b9cb8817f510057021874627487c6c14f69287c3/layout/generic/BlockReflowState.cpp#588-589
[3] https://searchfox.org/mozilla-central/rev/b25ff1fab82c2d3a91531ad3735e50422407b163/layout/generic/BlockReflowState.cpp#1026-1027

Differential Revision: https://phabricator.services.mozilla.com/D169588
This commit is contained in:
Ting-Yu Lin 2023-02-13 19:12:10 +00:00
Родитель 4e24d0ce51
Коммит b0c8b987ce
4 изменённых файлов: 120 добавлений и 5 удалений

Просмотреть файл

@ -760,12 +760,10 @@ BlockReflowState::PlaceFloatResult BlockReflowState::FlowAndPlaceFloat(
}
// Now we've computed the float's margin inline-size.
if (!HasFloatPushedDown() && aAvailableISizeInCurrentLine &&
if (aAvailableISizeInCurrentLine &&
floatMarginISize > *aAvailableISizeInCurrentLine) {
// We haven't needed to push down the float-placement block-dir coordinate
// (for float clearance), but the float cannot fit in the available
// inline-size of the current line. Let's notify our caller to place it
// later.
// The float cannot fit in the available inline-size of the current line.
// Let's notify our caller to place it later.
return PlaceFloatResult::ShouldPlaceBelowCurrentLine;
}

Просмотреть файл

@ -0,0 +1,38 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Test the inline-block does not overlap with the float-right element.</title>
<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1805597">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<style>
.container {
width: 100px;
height: 100px;
background-color: red;
}
.inline-block {
display: inline-block;
width: 50px;
height: 100px;
background-color: green;
}
.float-right {
float: right;
width: 50px;
height: 100px;
background-color: green;
}
.float-left {
width: 30px;
height: 50px;
clear: both;
float: left;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div class="container">
<div class="inline-block"></div><div class="float-right"></div><div class="float-left"></div>
</div>

Просмотреть файл

@ -0,0 +1,39 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Test the inline-block does not overlap with the float-left element.</title>
<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1805597">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<style>
.container {
width: 100px;
height: 100px;
background-color: red;
direction: rtl;
}
.inline-block {
display: inline-block;
width: 50px;
height: 100px;
background-color: green;
}
.float-left {
float: left;
width: 50px;
height: 100px;
background-color: green;
}
.float-right {
width: 30px;
height: 50px;
clear: both;
float: right;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div class="container">
<div class="inline-block"></div><div class="float-left"></div><div class="float-right"></div>
</div>

Просмотреть файл

@ -0,0 +1,40 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Test the inline-block does not overlap with the float-right element.</title>
<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1805597">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<style>
.container {
width: 100px;
height: 100px;
background-color: red;
position: relative;
}
.inline-block {
display: inline-block;
width: 50px;
height: 50px;
background-color: green;
}
.float-right {
float: right;
width: 50px;
height: 100px;
background-color: green;
}
.float-left {
width: 30px;
height: 50px;
clear: both;
float: left;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div class="container">
<div class="inline-block"></div><div class="float-right"></div><div class="float-left"></div>
<div style="position: absolute; top: 50px; width: 50px; height: 50px; background-color: green"></div>
</div>