зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1470329
- Change ReflowInput to have unconstrained BSize for size-contained elements, add reftests r=dholbert
MozReview-Commit-ID: 6IRAi8iScwy --HG-- extra : rebase_source : 2d98a5f5fc591fcb8d6360c0a6ac478e6afd77a6
This commit is contained in:
Родитель
580655b2ca
Коммит
51d3a6c12c
|
@ -485,6 +485,13 @@ ReflowInput::Init(nsPresContext* aPresContext,
|
|||
}
|
||||
}
|
||||
|
||||
if (mStyleDisplay->IsContainSize()) {
|
||||
// In the case that a box is size contained, we want to ensure
|
||||
// that it is also monolithic. We do this by unsetting
|
||||
// AvailableBSize() to avoid fragmentaiton.
|
||||
AvailableBSize() = NS_UNCONSTRAINEDSIZE;
|
||||
}
|
||||
|
||||
LAYOUT_WARN_IF_FALSE((mFrameType == NS_CSS_FRAME_TYPE_INLINE &&
|
||||
!mFrame->IsFrameOfType(nsIFrame::eReplaced)) ||
|
||||
type == LayoutFrameType::Text ||
|
||||
|
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-paged">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Reftest Reference</title>
|
||||
<style>
|
||||
.basicOuter {
|
||||
height: 20px;
|
||||
background: orange;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="basicOuter">
|
||||
before
|
||||
<div>inside</div>
|
||||
after
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-paged">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: 'contain: size' should ignore breaks and force elements to be monolithic.</title>
|
||||
<style>
|
||||
.contain {
|
||||
contain:size;
|
||||
}
|
||||
.innerPageBreak {
|
||||
page-break-before: always;
|
||||
page-break-after: always;
|
||||
}
|
||||
.basicOuter {
|
||||
height: 20px;
|
||||
background: orange;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="contain basicOuter">
|
||||
before
|
||||
<div class="innerPageBreak">
|
||||
inside
|
||||
</div>
|
||||
after
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-paged">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Reftest Reference</title>
|
||||
<style>
|
||||
table {
|
||||
background: lightblue;
|
||||
height: 1in;
|
||||
width: 1in;
|
||||
}
|
||||
.basicOuter {
|
||||
height: 20px;
|
||||
background: orange;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="basicOuter">
|
||||
<table border>
|
||||
<tr><td></td></tr>
|
||||
<tr><td></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-paged">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: 'contain: size' should ignore breaks and force elements to be monolithic.</title>
|
||||
<style>
|
||||
table {
|
||||
background: lightblue;
|
||||
height: 1in;
|
||||
width: 1in;
|
||||
}
|
||||
.contain {
|
||||
contain:size;
|
||||
}
|
||||
.innerPageBreak {
|
||||
page-break-before: always;
|
||||
page-break-after: always;
|
||||
}
|
||||
.basicOuter {
|
||||
height: 20px;
|
||||
background: orange;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="contain basicOuter">
|
||||
<table border>
|
||||
<tr class="innerPageBreak"><td></td></tr>
|
||||
<tr class="innerPageBreak"><td></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-paged">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Reftest Reference</title>
|
||||
</head>
|
||||
<body>
|
||||
<table>
|
||||
<tr>
|
||||
<td style="height:4in; width: 50px; background:orange;">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-paged">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: 'contain: size' should not affect breaking in tables or table elements.</title>
|
||||
<style>
|
||||
.contain {
|
||||
contain:size;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table class="contain">
|
||||
<tr>
|
||||
<td style="height:4in; width: 50px; background:orange;">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
|
@ -76,6 +76,9 @@ fuzzy-if(skiaContent,1,23) == resize-reflow-001.html resize-reflow-001.ref.html
|
|||
== column-balancing-break-inside-avoid-2.html column-balancing-break-inside-avoid-2-ref.html
|
||||
fuzzy-if(Android,1,2) == combobox-page-break-inside.html combobox-page-break-inside-ref.html
|
||||
== table-nested-1308876-1.xhtml table-nested-1308876-1-ref.html
|
||||
test-pref(layout.css.contain.enabled,true) == contain-size-break-001.html contain-size-break-001-ref.html
|
||||
test-pref(layout.css.contain.enabled,true) == contain-size-break-002.html contain-size-break-002-ref.html
|
||||
test-pref(layout.css.contain.enabled,true) == contain-size-break-003.html contain-size-break-003-ref.html
|
||||
|
||||
# Bugs
|
||||
== 272830-1.html 272830-1-ref.html
|
||||
|
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Morgan Rae Reschenberg" href="mailto:mreschenberg@berkeley.edu">
|
||||
<style>
|
||||
.cols {
|
||||
column-count: 3;
|
||||
column-rule: 1px dotted blue;
|
||||
column-fill: auto;
|
||||
border: 2px solid blue;
|
||||
height: 50px;
|
||||
width: 300px;
|
||||
}
|
||||
.innerObject {
|
||||
height: 200px;
|
||||
width: 100px;
|
||||
background: orange;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="cols">
|
||||
<canvas class="innerObject">
|
||||
<!-- Note: We use a canvas object here as a generic reference for
|
||||
something monolithic/non-fragmentable. -->
|
||||
</canvas>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: 'contain: size' should force elements to be monolithic, i.e. to not fragment inside a multicol element.</title>
|
||||
<link rel="author" title="Morgan Rae Reschenberg" href="mailto:mreschenberg@berkeley.edu">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-size">
|
||||
<link rel="match" href="contain-size-multicol-001-ref.html">
|
||||
<style>
|
||||
.contain {
|
||||
contain:size;
|
||||
}
|
||||
.cols {
|
||||
column-count: 3;
|
||||
column-rule: 1px dotted blue;
|
||||
column-fill: auto;
|
||||
border: 2px solid blue;
|
||||
height: 50px;
|
||||
width: 300px;
|
||||
}
|
||||
.innerObject {
|
||||
height: 200px;
|
||||
width: 100px;
|
||||
background: orange;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="cols">
|
||||
<div class="contain innerObject">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -17,3 +17,4 @@ pref(layout.css.overflow-clip-box.enabled,true) == contain-paint-clip-006.html c
|
|||
== contain-paint-ignored-cases-ruby-stacking-and-clipping-001.html contain-paint-ignored-cases-ruby-stacking-and-clipping-001-ref.html
|
||||
== contain-paint-stacking-context-001a.html contain-paint-stacking-context-001-ref.html
|
||||
== contain-paint-stacking-context-001b.html contain-paint-stacking-context-001-ref.html
|
||||
== contain-size-multicol-001.html contain-size-multicol-001-ref.html
|
||||
|
|
Загрузка…
Ссылка в новой задаче