mozilla
/
gecko-dev
зеркало из https://github.com/mozilla/gecko-dev.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Bug 1031726 - Implement clip:rect() correctly when fragments are involved, for both box-decoration-break:slice/clone. r=roc

This commit is contained in:
Mats Palmgren 2014-07-01 17:58:14 +00:00
Родитель 3b81bd7c5f
Коммит b1bee79041
18 изменённых файлов: 473 добавлений и 1 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

16
layout/generic/nsFrame.cpp
Просмотреть файл

@ -1619,7 +1619,21 @@ nsIFrame::GetClipPropClipRect(const nsStyleDisplay* aDisp, nsRect* aRect,
return false;
}
*aRect = aDisp->mClip;
if (MOZ_LIKELY(StyleBorder()->mBoxDecorationBreak ==
NS_STYLE_BOX_DECORATION_BREAK_SLICE)) {
// The clip applies to the joined boxes so it's relative the first
// continuation.
nscoord y = 0;
for (nsIFrame* f = GetPrevContinuation(); f; f = f->GetPrevContinuation()) {
y += f->GetRect().height;
}
nsRect clip = aDisp->mClip;
clip.MoveBy(nsPoint(0, -y));
*aRect = nsRect(nsPoint(0, 0), aSize).Intersect(clip);
} else {
*aRect = aDisp->mClip;
}
if (NS_STYLE_CLIP_RIGHT_AUTO & aDisp->mClipFlags) {
aRect->width = aSize.width - aRect->x;
}

29
layout/reftests/pagination/abspos-breaking-003-ref.html Normal file
Просмотреть файл

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect()</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
div {
position: absolute;
top: 50%;
border: 10px solid blue;
width: 50px;
height: 90%;
}
#mask1 {
border-color: white;
background: white;
clip:rect(0px, auto, 3px, 0px);
}
#mask2 {
border-color: white;
background: white;
clip:rect(0px, 5px, auto, 0px);
}
</style>
</head>
<body>
<div></div><div id="mask1"></div><div id="mask2"></div>
</body>
</html>

20
layout/reftests/pagination/abspos-breaking-003.html Normal file
Просмотреть файл

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect()</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
pre {
position: absolute;
top: 50%;
border: 10px solid blue;
width: 50px;
height: 90%;
clip:rect(3px, auto, auto, 5px);
}
</style>
</head>
<body>
<pre></pre>
</body>
</html>

29
layout/reftests/pagination/abspos-breaking-004-ref.html Normal file
Просмотреть файл

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect()</title>
<style type="text/css">
html, body { margin: 0; padding: 0; }
div {
position: absolute;
top: 120px;
border: 10px solid blue;
width: 50px;
height: 300px;
}
#mask1 {
border-color: white;
background: white;
clip:rect(0px, auto, 200px, 0px);
}
#mask2 {
border-color: white;
background: white;
clip:rect(200px, 5px, auto, 0px);
}
</style>
</head>
<body>
<div></div><div id="mask1"></div><div id="mask2"></div>
</body>
</html>

20
layout/reftests/pagination/abspos-breaking-004.html Normal file
Просмотреть файл

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect()</title>
<style type="text/css">
html, body { margin: 0; padding: 0; }
div {
position: absolute;
top: 120px;
border: 10px solid blue;
width: 50px;
height: 300px;
clip:rect(200px, auto, auto, 5px);
}
</style>
</head>
<body>
<div></div>
</body>
</html>

39
layout/reftests/pagination/abspos-breaking-005-ref.html Normal file
Просмотреть файл

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect()</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
div {
position: absolute;
top: 100px;
border: 10px solid blue;
width: 50px;
height: 300px;
}
#mask1 {
border-color: white;
background: white;
clip:rect(0px, auto, 200px, 0px);
}
#mask2 {
border-color: white;
background: white;
clip:rect(200px, 5px, auto, 0px);
}
#mask3 {
border-color: white;
background: white;
clip:rect(250px, auto, auto, 0px);
}
#mask4 {
border-color: white;
background: white;
clip:rect(200px, auto, auto, 65px);
}
</style>
</head>
<body>
<div></div><div id="mask1"></div><div id="mask2"></div><div id="mask3"></div><div id="mask4"></div>
</body>
</html>

20
layout/reftests/pagination/abspos-breaking-005.html Normal file
Просмотреть файл

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect()</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
pre {
position: absolute;
top: 100px;
border: 10px solid blue;
width: 50px;
height: 300px;
clip:rect(200px, 65px, 250px, 5px);
}
</style>
</head>
<body>
<pre></pre>
</body>
</html>

35
layout/reftests/pagination/abspos-breaking-006-ref.html Normal file
Просмотреть файл

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect()</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
div {
position: absolute;
top: 50%;
border: 10px solid blue;
width: 50px;
height: 300px;
clip:rect(5px, auto, 50px, 5px);
}
#mask1 {
border-color: white;
background: white;
clip:rect(0px, auto, 5px, 0px);
}
#mask2 {
border-color: white;
background: white;
clip:rect(50px, auto, auto, 0px);
}
#mask2 {
border-color: white;
background: white;
clip:rect(0px, 5px, auto, 0px);
}
</style>
</head>
<body>
<div></div><div id="mask1"></div><div id="mask2"></div><div id="mask3"></div>
</body>
</html>

20
layout/reftests/pagination/abspos-breaking-006.html Normal file
Просмотреть файл

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect()</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
pre {
position: absolute;
top: 50%;
border: 10px solid blue;
width: 50px;
height: 300px;
clip:rect(5px, auto, 50px, 5px);
}
</style>
</head>
<body>
<pre></pre>
</body>
</html>

50
layout/reftests/pagination/abspos-breaking-007-ref.html Normal file
Просмотреть файл

@ -0,0 +1,50 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect() and box-decoration-break:clone</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
#test {
box-decoration-break:clone;
}
div {
position: absolute;
top: 120px;
border: 10px solid blue;
width: 50px;
height: 160px;
}
#mask1 {
border-color: white;
background: white;
clip:rect(0px, auto, 3px, 0px);
}
#mask2 {
border-color: white;
background: white;
clip:rect(0px, 5px, auto, 0px);
}
#mask3 {
border-color: white;
background: white;
height: 180px;
clip:rect(0px, 5px, auto, 0px);
}
#mask4 {
border-color: white;
background: white;
height: 180px;
clip:rect(0px, 5px, auto, 0px);
}
#mask5 {
box-decoration-break:clone;
border-color: white;
height: 180px;
clip:rect(0, auto, 3px, 0px);
}
</style>
</head>
<body>
<div id="test"></div><div id="mask1"></div><div id="mask2"></div><div id="mask3"></div><div id="mask4"></div><div id="mask5"></div>
</body>
</html>

21
layout/reftests/pagination/abspos-breaking-007.html Normal file
Просмотреть файл

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect() and box-decoration-break:clone</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
pre {
box-decoration-break: clone;
position: absolute;
top: 120px;
border: 10px solid blue;
width: 50px;
height: 160px;
clip:rect(3px, auto, auto, 5px);
}
</style>
</head>
<body>
<pre></pre>
</body>
</html>

35
layout/reftests/pagination/abspos-breaking-008-ref.html Normal file
Просмотреть файл

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect() and box-decoration-break:clone</title>
<style type="text/css">
html, body { margin: 0; padding: 0; }
div {
position: absolute;
top: 120px;
border: 10px solid blue;
width: 50px;
height: 220px;
}
#mask1 {
z-index:1;
border-color: white;
background: white;
clip:rect(0px, auto, 202px, 0px);
}
#mask2 {
border-color: white;
background: white;
clip:rect(0px, 5px, auto, 0px);
}
#mask3 {
border-color: white;
background: white;
clip:rect(237px, auto, auto, 0px);
}
</style>
</head>
<body>
<div></div><div id="mask1"></div><div id="mask2"></div>
</body>
</html>

21
layout/reftests/pagination/abspos-breaking-008.html Normal file
Просмотреть файл

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect() and box-decoration-break:clone</title>
<style type="text/css">
html, body { margin: 0; padding: 0; }
div {
box-decoration-break: clone;
position: absolute;
top: 120px;
border: 10px solid blue;
width: 50px;
height: 200px;
clip:rect(130px, auto, auto, 5px);
}
</style>
</head>
<body>
<div></div>
</body>
</html>

39
layout/reftests/pagination/abspos-breaking-009-ref.html Normal file
Просмотреть файл

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect() and box-decoration-break:clone</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
div {
position: absolute;
top: 100px;
border: 10px solid blue;
width: 50px;
height: 220px;
}
#mask1 {
border-color: white;
background: white;
clip:rect(0px, auto, 212px, 0px);
}
#mask2 {
border-color: white;
background: white;
clip:rect(200px, 5px, auto, 0px);
}
#mask3 {
border-color: white;
background: white;
clip:rect(222px, auto, auto, 0px);
}
#mask4 {
border-color: white;
background: white;
clip:rect(200px, auto, auto, 65px);
}
</style>
</head>
<body>
<div></div><div id="mask1"></div><div id="mask2"></div><div id="mask3"></div><div id="mask4"></div>
</body>
</html>

21
layout/reftests/pagination/abspos-breaking-009.html Normal file
Просмотреть файл

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect() and box-decoration-break:clone</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
pre {
box-decoration-break: clone;
position: absolute;
top: 100px;
border: 10px solid blue;
width: 50px;
height: 200px;
clip:rect(120px, 65px, 130px, 5px);
}
</style>
</head>
<body>
<pre></pre>
</body>
</html>

30
layout/reftests/pagination/abspos-breaking-010-ref.html Normal file
Просмотреть файл

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect() and box-decoration-break:clone</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
.b {
page-break-before: always;
}
div {
position: absolute;
top: 50%;
border: 10px solid blue;
width: 50px;
height: 100px;
clip:rect(5px, auto, 50px, 5px);
}
x {
display: block;
position: relative;
}
x div { top:0; }
</style>
</head>
<body>
<div class="test"></div>
<x class="b"><div class="test"></div>&nbsp;</x>
<x class="b"><div class="test"></div>&nbsp;</x>
</body>
</html>

21
layout/reftests/pagination/abspos-breaking-010.html Normal file
Просмотреть файл

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html class="reftest-print">
<head>
<title>AbsPos Pagination, with clip:rect() and box-decoration-break:clone</title>
<style type="text/css">
html, body, pre { margin: 0; padding: 0; }
pre {
box-decoration-break: clone;
position: absolute;
top: 50%;
border: 10px solid blue;
width: 50px;
height: 300px;
clip:rect(5px, auto, 50px, 5px);
}
</style>
</head>
<body>
<pre></pre>
</body>
</html>

8
layout/reftests/pagination/reftest.list
Просмотреть файл

@ -4,6 +4,14 @@
== abspos-breaking-000.xhtml abspos-breaking-000.ref.xhtml
== abspos-breaking-001.xhtml abspos-breaking-000.ref.xhtml
== abspos-breaking-002.xhtml abspos-breaking-000.ref.xhtml
== abspos-breaking-003.html abspos-breaking-003-ref.html
== abspos-breaking-004.html abspos-breaking-004-ref.html
== abspos-breaking-005.html abspos-breaking-005-ref.html
== abspos-breaking-006.html abspos-breaking-006-ref.html
pref(layout.css.box-decoration-break.enabled,true) == abspos-breaking-007.html abspos-breaking-007-ref.html
skip-if(B2G) pref(layout.css.box-decoration-break.enabled,true) == abspos-breaking-008.html abspos-breaking-008-ref.html
skip-if(B2G) pref(layout.css.box-decoration-break.enabled,true) == abspos-breaking-009.html abspos-breaking-009-ref.html
skip-if(B2G) pref(layout.css.box-decoration-break.enabled,true) == abspos-breaking-010.html abspos-breaking-010-ref.html
== abspos-overflow-01.xhtml abspos-overflow-01.ref.xhtml
== abspos-overflow-01-cols.xhtml abspos-overflow-01-cols.ref.xhtml
== border-breaking-000-cols.xhtml border-breaking-000-cols.ref.xhtml