зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1465936 - Ignore contain:paint for elements without a principal box, internal table elements except table-cell, internal ruby elements, and non-atomic inlines. r=dholbert
MozReview-Commit-ID: Lt8z3BEWnQy --HG-- extra : rebase_source : 526838f24f75adc75f825bb7813103a3f02579c7
This commit is contained in:
Родитель
b328e08738
Коммит
4139d00894
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset=utf-8>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<style>
|
||||
tr {
|
||||
z-index: 10;
|
||||
}
|
||||
th {
|
||||
background-color: blue;
|
||||
padding-left: 50px;
|
||||
}
|
||||
caption {
|
||||
position: fixed;
|
||||
background-color: yellow;
|
||||
z-index: 2;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table>
|
||||
<caption>PASS</caption>
|
||||
<tr>
|
||||
<th> </th>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset=utf-8>
|
||||
<title>CSS-contain test: paint containment on internal table elements except table-cell.</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-containment-1/#containment-paint">
|
||||
<link rel="match" href="contain-paint-ignored-cases-internal-table-001-ref.html">
|
||||
<meta name="assert" content="Paint containment should not apply to internal table elements except table-cell. This test testes only the tr element, and confirms contain:paint does not create a stacking context.">
|
||||
<style>
|
||||
tr {
|
||||
contain: paint;
|
||||
z-index: 10;
|
||||
}
|
||||
th {
|
||||
background-color: blue;
|
||||
padding-left: 50px;
|
||||
}
|
||||
caption {
|
||||
position: fixed;
|
||||
background-color: yellow;
|
||||
z-index: 2;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table>
|
||||
<caption>PASS</caption>
|
||||
<tr>
|
||||
<th> </th>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset=utf-8>
|
||||
<title>CSS-contain test: paint containment on internal table elements except table-cell.</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-containment-1/#containment-paint">
|
||||
<link rel="match" href="contain-paint-ignored-cases-internal-table-001-ref.html">
|
||||
<meta name="assert" content="Paint containment should not apply to internal table elements except table-cell. This test testes only the tbody element, and confirms contain:paint does not create a stacking context.">
|
||||
<style>
|
||||
tbody {
|
||||
contain: paint;
|
||||
z-index: 10;
|
||||
}
|
||||
th {
|
||||
background-color: blue;
|
||||
padding-left: 50px;
|
||||
}
|
||||
caption {
|
||||
position: fixed;
|
||||
background-color: yellow;
|
||||
z-index: 2;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table>
|
||||
<caption>PASS</caption>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th> </th>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,57 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
width: 100px;
|
||||
}
|
||||
#div1,
|
||||
#div3 {
|
||||
background-color: #cfc;
|
||||
height: 100px;
|
||||
}
|
||||
#div1 {
|
||||
z-index: 5;
|
||||
}
|
||||
#div2 {
|
||||
display: contents;
|
||||
background-color: #fdd;
|
||||
height: 100px;
|
||||
top: -20px;
|
||||
}
|
||||
#div2_1 {
|
||||
background-color: #ffc;
|
||||
z-index: 6;
|
||||
top: -10px;
|
||||
height: 100px;
|
||||
}
|
||||
#div2_2 {
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
top: -15px;
|
||||
width: 40px;
|
||||
height: 300px;
|
||||
background-color: #ddf;
|
||||
}
|
||||
#div3 {
|
||||
z-index: 2;
|
||||
top: -50px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="div1"></div>
|
||||
|
||||
<div id="div2">
|
||||
<div id="div2_1"></div>
|
||||
|
||||
<div id="div2_2"></div>
|
||||
</div>
|
||||
|
||||
<div id="div3"></div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,61 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: 'contain: paint' with 'display: contents'.</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-paint">
|
||||
<link rel="match" href="contain-paint-ignored-cases-no-principal-box-001-ref.html">
|
||||
<meta name="assert" content="Contain:paint should have no effect when no principle box is generated.">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
width: 100px;
|
||||
}
|
||||
#div1,
|
||||
#div3 {
|
||||
background-color: #cfc;
|
||||
height: 100px;
|
||||
}
|
||||
#div1 {
|
||||
z-index: 5;
|
||||
}
|
||||
#div2 {
|
||||
display: contents;
|
||||
contain: paint;
|
||||
background-color: #fdd;
|
||||
height: 100px;
|
||||
top: -20px;
|
||||
}
|
||||
#div2_1 {
|
||||
background-color: #ffc;
|
||||
z-index: 6;
|
||||
top: -10px;
|
||||
height: 100px;
|
||||
}
|
||||
#div2_2 {
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
top: -15px;
|
||||
width: 40px;
|
||||
height: 300px;
|
||||
background-color: #ddf;
|
||||
}
|
||||
#div3 {
|
||||
z-index: 2;
|
||||
top: -50px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="div1"></div>
|
||||
|
||||
<div id="div2">
|
||||
<div id="div2_1"></div>
|
||||
|
||||
<div id="div2_2"></div>
|
||||
</div>
|
||||
|
||||
<div id="div3"></div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,37 @@
|
|||
<!doctype html>
|
||||
<html lang=en>
|
||||
<head>
|
||||
<meta charset=utf-8>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<style>
|
||||
rb,
|
||||
rbc,
|
||||
rt,
|
||||
rtc {
|
||||
background-color: yellow;
|
||||
font-size: 2em;
|
||||
}
|
||||
rbc {
|
||||
display: ruby-base-container;
|
||||
}
|
||||
.contained {
|
||||
width: 50px;
|
||||
height: 10px;
|
||||
background-color: blue;
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
}
|
||||
.wrapper {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper"><ruby><rt> <div class="contained"></div></rt></ruby></div>
|
||||
<div class="wrapper"><ruby><rtc> <div class="contained"></div></rtc></ruby></div>
|
||||
<div class="wrapper"><ruby><rb> <div class="contained"></div></rb></ruby></div>
|
||||
<div class="wrapper"><ruby><rbc> <div class="contained"></div></rbc></ruby></div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,41 @@
|
|||
<!doctype html>
|
||||
<html lang=en>
|
||||
<head>
|
||||
<meta charset=utf-8>
|
||||
<title>CSS-contain test: paint containment on internal ruby elements.</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-containment-1/#containment-paint">
|
||||
<link rel="match" href="contain-paint-ignored-cases-ruby-containing-block-001-ref.html">
|
||||
<meta name="assert" content="Paint containment should not apply to ruby base, ruby base container, ruby text, and ruby text container. This test confirms contain:paint does not act as a containing block for fixed positioned descendants.">
|
||||
<style>
|
||||
rb,
|
||||
rbc,
|
||||
rt,
|
||||
rtc {
|
||||
contain: paint;
|
||||
background-color: yellow;
|
||||
font-size: 2em;
|
||||
}
|
||||
rbc {
|
||||
display: ruby-base-container;
|
||||
}
|
||||
.contained {
|
||||
width: 50px;
|
||||
height: 10px;
|
||||
background-color: blue;
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
}
|
||||
.wrapper {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper"><ruby><rt> <div class="contained"></div></rt></ruby></div>
|
||||
<div class="wrapper"><ruby><rtc> <div class="contained"></div></rtc></ruby></div>
|
||||
<div class="wrapper"><ruby><rb> <div class="contained"></div></rb></ruby></div>
|
||||
<div class="wrapper"><ruby><rbc> <div class="contained"></div></rbc></ruby></div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,52 @@
|
|||
<!doctype html>
|
||||
<html lang=en>
|
||||
<head>
|
||||
<meta charset=utf-8>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
}
|
||||
rbc {
|
||||
display: ruby-base-container;
|
||||
}
|
||||
.contained {
|
||||
z-index: 5;
|
||||
width: 70px;
|
||||
height: 10px;
|
||||
background-color: blue;
|
||||
margin-left: -25px;
|
||||
}
|
||||
.background {
|
||||
display: inline-block;
|
||||
background-color: yellow;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
position: fixed;
|
||||
z-index: 2;
|
||||
}
|
||||
.group {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="group">
|
||||
<div class="background"></div>
|
||||
<ruby><rb> <div class="contained"></div></rb></ruby>
|
||||
</div>
|
||||
<div class="group">
|
||||
<div class="background"></div>
|
||||
<ruby><rbc> <div class="contained"></div></rbc></ruby>
|
||||
</div>
|
||||
<div class="group">
|
||||
<div class="background"></div>
|
||||
<ruby><rt> <div class="contained"></div></rt></ruby>
|
||||
</div>
|
||||
<div class="group">
|
||||
<div class="background"></div>
|
||||
<ruby><rtc> <div class="contained"></div></rtc></ruby>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,60 @@
|
|||
<!doctype html>
|
||||
<html lang=en>
|
||||
<head>
|
||||
<meta charset=utf-8>
|
||||
<title>CSS-contain test: paint containment on internal ruby elements.</title>
|
||||
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-containment-1/#containment-paint">
|
||||
<link rel="match" href="contain-paint-ignored-cases-ruby-stacking-and-clipping-001-ref.html">
|
||||
<meta name="assert" content="Paint containment should not apply to ruby base, ruby base container, ruby text, and ruby text container. This test confirms that contain:paint does not create a stacking context and does not apply overflow clipping.">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
}
|
||||
rb,
|
||||
rbc,
|
||||
rt,
|
||||
rtc {
|
||||
contain: paint;
|
||||
}
|
||||
rbc {
|
||||
display: ruby-base-container;
|
||||
}
|
||||
.contained {
|
||||
z-index: 5;
|
||||
width: 70px;
|
||||
height: 10px;
|
||||
background-color: blue;
|
||||
margin-left: -25px;
|
||||
}
|
||||
.background {
|
||||
background-color: yellow;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
position: fixed;
|
||||
z-index: 2;
|
||||
}
|
||||
.group {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="group">
|
||||
<div class="background"></div>
|
||||
<ruby><rb> <div class="contained"></div></rb></ruby>
|
||||
</div>
|
||||
<div class="group">
|
||||
<div class="background"></div>
|
||||
<ruby><rbc> <div class="contained"></div></rbc></ruby>
|
||||
</div>
|
||||
<div class="group">
|
||||
<div class="background"></div>
|
||||
<ruby><rt> <div class="contained"></div></rt></ruby>
|
||||
</div>
|
||||
<div class="group">
|
||||
<div class="background"></div>
|
||||
<ruby><rtc> <div class="contained"></div></rtc></ruby>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -10,5 +10,10 @@ pref(layout.css.overflow-clip-box.enabled,true) == contain-paint-clip-006.html c
|
|||
== contain-paint-containing-block-fixed-001.html contain-paint-containing-block-fixed-001-ref.html
|
||||
== contain-paint-formatting-context-float-001.html contain-paint-formatting-context-float-001-ref.html
|
||||
== contain-paint-formatting-context-margin-001.html contain-paint-formatting-context-margin-001-ref.html
|
||||
== contain-paint-ignored-cases-internal-table-001a.html contain-paint-ignored-cases-internal-table-001-ref.html
|
||||
== contain-paint-ignored-cases-internal-table-001b.html contain-paint-ignored-cases-internal-table-001-ref.html
|
||||
== contain-paint-ignored-cases-no-principal-box-001.html contain-paint-ignored-cases-no-principal-box-001-ref.html
|
||||
== contain-paint-ignored-cases-ruby-containing-block-001.html contain-paint-ignored-cases-ruby-containing-block-001-ref.html
|
||||
== 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
|
||||
|
|
|
@ -2384,7 +2384,11 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsStyleDisplay
|
|||
bool IsInnerTableStyle() const {
|
||||
return mozilla::StyleDisplay::TableCaption == mDisplay ||
|
||||
mozilla::StyleDisplay::TableCell == mDisplay ||
|
||||
mozilla::StyleDisplay::TableRow == mDisplay ||
|
||||
IsInternalTableStyleExceptCell();
|
||||
}
|
||||
|
||||
bool IsInternalTableStyleExceptCell() const {
|
||||
return mozilla::StyleDisplay::TableRow == mDisplay ||
|
||||
mozilla::StyleDisplay::TableRowGroup == mDisplay ||
|
||||
mozilla::StyleDisplay::TableHeaderGroup == mDisplay ||
|
||||
mozilla::StyleDisplay::TableFooterGroup == mDisplay ||
|
||||
|
@ -2412,7 +2416,11 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsStyleDisplay
|
|||
|
||||
static bool IsRubyDisplayType(mozilla::StyleDisplay aDisplay) {
|
||||
return mozilla::StyleDisplay::Ruby == aDisplay ||
|
||||
mozilla::StyleDisplay::RubyBase == aDisplay ||
|
||||
IsInternalRubyDisplayType(aDisplay);
|
||||
}
|
||||
|
||||
static bool IsInternalRubyDisplayType(mozilla::StyleDisplay aDisplay) {
|
||||
return mozilla::StyleDisplay::RubyBase == aDisplay ||
|
||||
mozilla::StyleDisplay::RubyBaseContainer == aDisplay ||
|
||||
mozilla::StyleDisplay::RubyText == aDisplay ||
|
||||
mozilla::StyleDisplay::RubyTextContainer == aDisplay;
|
||||
|
@ -2422,6 +2430,10 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsStyleDisplay
|
|||
return IsRubyDisplayType(mDisplay);
|
||||
}
|
||||
|
||||
bool IsInternalRubyDisplayType() const {
|
||||
return IsInternalRubyDisplayType(mDisplay);
|
||||
}
|
||||
|
||||
bool IsOutOfFlowStyle() const {
|
||||
return (IsAbsolutelyPositionedStyle() || IsFloatingStyle());
|
||||
}
|
||||
|
@ -2434,7 +2446,9 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsStyleDisplay
|
|||
}
|
||||
|
||||
bool IsContainPaint() const {
|
||||
return NS_STYLE_CONTAIN_PAINT & mContain;
|
||||
return (NS_STYLE_CONTAIN_PAINT & mContain) &&
|
||||
!IsInternalRubyDisplayType() &&
|
||||
!IsInternalTableStyleExceptCell();
|
||||
}
|
||||
|
||||
/* Returns whether the element has the -moz-transform property
|
||||
|
|
|
@ -1,2 +0,0 @@
|
|||
[contain-paint-005.html]
|
||||
expected: FAIL
|
|
@ -1,2 +0,0 @@
|
|||
[contain-paint-006.html]
|
||||
expected: FAIL
|
|
@ -1,2 +0,0 @@
|
|||
[contain-paint-008.html]
|
||||
expected: FAIL
|
|
@ -1,2 +0,0 @@
|
|||
[contain-paint-015.html]
|
||||
expected: FAIL
|
|
@ -1,2 +0,0 @@
|
|||
[contain-paint-016.html]
|
||||
expected: FAIL
|
|
@ -1,2 +0,0 @@
|
|||
[contain-paint-017.html]
|
||||
expected: FAIL
|
|
@ -1,2 +0,0 @@
|
|||
[contain-paint-018.html]
|
||||
expected: FAIL
|
Загрузка…
Ссылка в новой задаче