зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1449326: Account for min- / max- block size changes too in the flex caching code. r=dholbert
We may be reflowing the same kid with different (definite / non-definite) containing block sizes, which changes the min block size in: https://searchfox.org/mozilla-central/rev/f65d7528e34ef1a7665b4a1a7b7cdb1388fcd3aa/layout/generic/ReflowInput.cpp#3077 In which case we may need to reflow in order to properly align the flex item. MozReview-Commit-ID: 27aS2UrgXjs
This commit is contained in:
Родитель
1f9cbf532c
Коммит
00763b545a
|
@ -1670,26 +1670,45 @@ nsFlexContainerFrame::
|
|||
*/
|
||||
class nsFlexContainerFrame::CachedMeasuringReflowResult
|
||||
{
|
||||
// Members that are part of the cache key:
|
||||
const LogicalSize mAvailableSize;
|
||||
const nscoord mComputedBSize;
|
||||
struct Key
|
||||
{
|
||||
const LogicalSize mAvailableSize;
|
||||
const nscoord mComputedBSize;
|
||||
const nscoord mComputedMinBSize;
|
||||
const nscoord mComputedMaxBSize;
|
||||
|
||||
explicit Key(const ReflowInput& aRI)
|
||||
: mAvailableSize(aRI.AvailableSize())
|
||||
, mComputedBSize(aRI.ComputedBSize())
|
||||
, mComputedMinBSize(aRI.ComputedMinBSize())
|
||||
, mComputedMaxBSize(aRI.ComputedMaxBSize())
|
||||
{ }
|
||||
|
||||
bool operator==(const Key& aOther) const
|
||||
{
|
||||
return mAvailableSize == aOther.mAvailableSize &&
|
||||
mComputedBSize == aOther.mComputedBSize &&
|
||||
mComputedMinBSize == aOther.mComputedMinBSize &&
|
||||
mComputedMaxBSize == aOther.mComputedMaxBSize;
|
||||
}
|
||||
};
|
||||
|
||||
const Key mKey;
|
||||
|
||||
// Members that are part of the cache value:
|
||||
const nscoord mBSize;
|
||||
const nscoord mAscent;
|
||||
|
||||
public:
|
||||
CachedMeasuringReflowResult(const ReflowInput& aReflowInput,
|
||||
const ReflowOutput& aDesiredSize)
|
||||
: mAvailableSize(aReflowInput.AvailableSize())
|
||||
, mComputedBSize(aReflowInput.ComputedBSize())
|
||||
: mKey(aReflowInput)
|
||||
, mBSize(aDesiredSize.BSize(aReflowInput.GetWritingMode()))
|
||||
, mAscent(aDesiredSize.BlockStartAscent())
|
||||
{}
|
||||
{ }
|
||||
|
||||
bool IsValidFor(const ReflowInput& aReflowInput) const {
|
||||
return mAvailableSize == aReflowInput.AvailableSize() &&
|
||||
mComputedBSize == aReflowInput.ComputedBSize();
|
||||
bool IsValidFor(const ReflowInput& aReflowInput) const
|
||||
{
|
||||
return mKey == Key(aReflowInput);
|
||||
}
|
||||
|
||||
nscoord BSize() const { return mBSize; }
|
||||
|
|
|
@ -0,0 +1,13 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test Reference</title>
|
||||
<link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
|
||||
<style>
|
||||
div {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if you see a green 100px x 100px square, and no red</p>
|
||||
<div></div>
|
|
@ -0,0 +1,30 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: nested flex containers with height established by 'min-height'</title>
|
||||
<link rel="match" href="flexbox-definite-sizes-001-ref.html">
|
||||
<link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#definite-sizes">
|
||||
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1449326">
|
||||
<style>
|
||||
div {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.item {
|
||||
width: 100px;
|
||||
background: red;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.item span {
|
||||
min-height: 100%;
|
||||
width: 100%;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if you see a green 100px x 100px square, and no red</p>
|
||||
<div style="min-height: 100px;">
|
||||
<div class="item">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,31 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: nested flex containers with height established by 'min-height'</title>
|
||||
<link rel="match" href="flexbox-definite-sizes-001-ref.html">
|
||||
<link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#definite-sizes">
|
||||
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1449326">
|
||||
<style>
|
||||
div {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.item {
|
||||
width: 100px;
|
||||
background: red;
|
||||
align-items: center;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.item span {
|
||||
min-height: 100%;
|
||||
width: 100%;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if you see a green 100px x 100px square, and no red</p>
|
||||
<div>
|
||||
<div class="item">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,38 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: nested flex containers with definite max-height</title>
|
||||
<link rel="match" href="flexbox-definite-sizes-001-ref.html">
|
||||
<link rel="author" href="mailto:dholbert@mozilla.com" title="Daniel Holbert">
|
||||
<link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#definite-sizes">
|
||||
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1449326">
|
||||
<style>
|
||||
body { overflow: hidden }
|
||||
|
||||
.outerFlex {
|
||||
display: flex;
|
||||
width: 100px;
|
||||
/* Implicit "align-items:stretch" */
|
||||
}
|
||||
|
||||
.innerFlex {
|
||||
display: flex;
|
||||
width: 100px;
|
||||
background: red;
|
||||
|
||||
/* This reveals if we miscalculate the height of our flex item: */
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.block {
|
||||
width: 100px;
|
||||
max-height: 100%;
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if you see a green 100px x 100px square, and no red</p>
|
||||
<div class="outerFlex" style="max-height: 100px">
|
||||
<div class="innerFlex">
|
||||
<div class="block"><div style="height:9999px"></div></div>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,38 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: nested flex containers with definite max-height</title>
|
||||
<link rel="match" href="flexbox-definite-sizes-001-ref.html">
|
||||
<link rel="author" href="mailto:dholbert@mozilla.com" title="Daniel Holbert">
|
||||
<link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#definite-sizes">
|
||||
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1449326">
|
||||
<style>
|
||||
body { overflow: hidden }
|
||||
|
||||
.outerFlex {
|
||||
display: flex;
|
||||
width: 100px;
|
||||
/* Implicit "align-items:stretch" */
|
||||
}
|
||||
|
||||
.innerFlex {
|
||||
display: flex;
|
||||
width: 100px;
|
||||
background: red;
|
||||
|
||||
/* This reveals if we miscalculate the height of our flex item: */
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.block {
|
||||
width: 100px;
|
||||
max-height: 100%;
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if you see a green 100px x 100px square, and no red</p>
|
||||
<div class="outerFlex">
|
||||
<div class="innerFlex" style="max-height: 100px">
|
||||
<div class="block"><div style="height:9999px"></div></div>
|
||||
</div>
|
||||
</div>
|
|
@ -134,6 +134,12 @@ fuzzy-if(Android,158,32) == flexbox-align-self-vert-rtl-001.xhtml flexbox-align
|
|||
== flexbox-intrinsic-ratio-006.html flexbox-intrinsic-ratio-006-ref.html
|
||||
== flexbox-intrinsic-ratio-006v.html flexbox-intrinsic-ratio-006-ref.html
|
||||
|
||||
# Test for definite and indefinite sizes.
|
||||
== flexbox-definite-sizes-001.html flexbox-definite-sizes-001-ref.html
|
||||
== flexbox-definite-sizes-002.html flexbox-definite-sizes-001-ref.html
|
||||
== flexbox-definite-sizes-003.html flexbox-definite-sizes-001-ref.html
|
||||
== flexbox-definite-sizes-004.html flexbox-definite-sizes-001-ref.html
|
||||
|
||||
# Tests for flex items as (pseudo) stacking contexts
|
||||
== flexbox-items-as-stacking-contexts-001.xhtml flexbox-items-as-stacking-contexts-001-ref.xhtml
|
||||
== flexbox-items-as-stacking-contexts-002.html flexbox-items-as-stacking-contexts-002-ref.html
|
||||
|
|
Загрузка…
Ссылка в новой задаче