Bug 1373159 - Add a bunch of test cases for 'context-fill-opacity' and 'context-stroke-opacity'. r=heycam

MozReview-Commit-ID: AkSep6phtm8

--HG--
extra : rebase_source : f82775c1e97e0aef540f3cf2e58d16351615e1c7
This commit is contained in:
KuoE0 2017-06-20 11:51:56 +08:00
Родитель a9221913fd
Коммит 4a137498b6
16 изменённых файлов: 257 добавлений и 0 удалений

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

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<title>Basic context-fill-opacity test</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: fill-opacity;
fill-opacity: 0.5;
}
</style>
</head>
<body>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' fill='blue' fill-opacity='context-fill-opacity'/></svg>">
</body>
</html>

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

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<title>Test context-fill-opacity with different fill-opacity values (test image caching correctness)</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: fill-opacity;
}
#img1 {
fill-opacity: 0.3;
}
#img2 {
fill-opacity: 0.7;
}
</style>
</head>
<body>
<img id="img1" src="context-fill-opacity-02.svg">
<img id="img2" src="context-fill-opacity-02.svg">
</body>
</html>

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

@ -0,0 +1,3 @@
<svg xmlns='http://www.w3.org/2000/svg'>
<rect width='100%' height='100%' fill='blue' fill-opacity='context-fill-opacity'/>
</svg>

После

Ширина:  |  Высота:  |  Размер: 133 B

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

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<title>Test context-fill-opacity works with context-fill</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: fill, fill-opacity;
fill: blue;
fill-opacity: 0.5;
}
</style>
</head>
<body>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' fill='context-fill' fill-opacity='context-fill-opacity'/></svg>">
</body>
</html>

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

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<title>No context-fill-opacity value is provided</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: fill-opacity;
}
</style>
</head>
<body>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' fill='blue' fill-opacity='context-fill-opacity'/></svg>">
</body>
</html>

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

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<title>Test context-fill-opacity when only '-moz-context-properties: stroke-opacity' is specified</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: stroke-opacity;
fill: 0.5;
stroke: 0.5;
}
</style>
</head>
<body>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' fill='blue' fill-opacity='context-fill-opacity'/></svg>">
</body>
</html>

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

@ -0,0 +1,6 @@
<!DOCTYPE html>
<html>
<body>
<div style="width: 100px; height: 100px; background: rgba(0, 0, 255, 0.5)"></div>
</body>
</html>

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

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 100px;
height: 100px;
display: inline-block;
}
</style>
</head>
<body>
<div style="background: rgba(0, 0, 255, 0.3); "></div>
<div style="background: rgba(0, 0, 255, 0.7); "></div>
</body>
</html>

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

@ -0,0 +1,6 @@
<!DOCTYPE html>
<html>
<body>
<div style="width: 100px; height: 100px; background: rgba(0, 0, 255, 0.5)"></div>
</body>
</html>

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

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<title>Basic context-stroke-opacity test</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: stroke-opacity;
stroke-opacity: 0.5;
}
</style>
</head>
<body>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><line x1='0' y1='50%' x2='100%' y2='50%' stroke-width='120%' stroke='blue' stroke-opacity='context-stroke-opacity'/></svg>">
</body>
</html>

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

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<title>Test context-stroke-opacity with different stroke-opacity values (test image caching correctness)</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: stroke-opacity;
}
#img1 {
stroke-opacity: 0.3;
}
#img2 {
stroke-opacity: 0.7;
}
</style>
</head>
<body>
<img id="img1" src="context-stroke-opacity-02.svg">
<img id="img2" src="context-stroke-opacity-02.svg">
</body>
</html>

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

@ -0,0 +1,3 @@
<svg xmlns='http://www.w3.org/2000/svg'>
<line x1='0' y1='50%' x2='100%' y2='50%' stroke-width='120%' stroke='blue' stroke-opacity='context-stroke-opacity'/>
</svg>

После

Ширина:  |  Высота:  |  Размер: 169 B

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

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<title>Test context-stroke-opacity works with context-stroke</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: stroke, stroke-opacity;
stroke: blue;
stroke-opacity: 0.5;
}
</style>
</head>
<body>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><line x1='0' y1='50%' x2='100%' y2='50%' stroke-width='120%' stroke='context-stroke' stroke-opacity='context-stroke-opacity'/></svg>">
</body>
</html>

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

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<title>No context-stroke-opacity value is provided</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: stroke-opacity;
}
</style>
</head>
<body>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><line x1='0' y1='50%' x2='100%' y2='50%' stroke-width='120%' stroke='blue' stroke-opacity='context-stroke-opacity'/></svg>">
</body>
</html>

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

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<title>Test context-stroke-opacity when only '-moz-context-properties: fill-opacity' is specified</title>
<style>
img {
width: 100px;
height: 100px;
-moz-context-properties: fill-opacity;
stroke-opacity: 0.5;
}
</style>
</head>
<body>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><line x1='0' y1='50%' x2='100%' y2='50%' stroke-width='120%' stroke='blue' stroke-opacity='context-stroke-opacity'/></svg>">
</body>
</html>

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

@ -81,6 +81,20 @@ test-pref(svg.context-properties.content.enabled,true) == context-stroke-06.html
test-pref(svg.context-properties.content.enabled,true) == context-stroke-07.html context-stroke-07-ref.html
test-pref(svg.context-properties.content.enabled,true) == context-stroke-08.html blue100x100-border-ref.html
test-pref(svg.context-properties.content.enabled,true) == context-stroke-bg-image-01.html blue100x100-border-ref.html
# context-fill-opacity:
== context-fill-opacity-01.html blue100x100-ref.html
fuzzy-if(winWidget,1,10000) test-pref(svg.context-properties.content.enabled,true) == context-fill-opacity-01.html context-fill-or-stroke-opacity-01-ref.html # Bug 1377327
fuzzy-if(winWidget,1,20000) test-pref(svg.context-properties.content.enabled,true) == context-fill-opacity-02.html context-fill-or-stroke-opacity-02-ref.html # Bug 1377327
fuzzy-if(winWidget,1,10000) test-pref(svg.context-properties.content.enabled,true) == context-fill-opacity-03.html context-fill-or-stroke-opacity-03-ref.html # Bug 1377327
fuzzy-if(winWidget,1,10000) test-pref(svg.context-properties.content.enabled,true) == context-fill-opacity-04.html blue100x100-ref.html # Bug 1377327
fuzzy-if(winWidget,1,10000) test-pref(svg.context-properties.content.enabled,true) == context-fill-opacity-05.html blue100x100-ref.html # Bug 1377327
# context-stroke-opacity:
== context-stroke-opacity-01.html blue100x100-ref.html
fuzzy-if(winWidget,1,10000) test-pref(svg.context-properties.content.enabled,true) == context-stroke-opacity-01.html context-fill-or-stroke-opacity-01-ref.html # Bug 1377327
fuzzy-if(winWidget,1,20000) test-pref(svg.context-properties.content.enabled,true) == context-stroke-opacity-02.html context-fill-or-stroke-opacity-02-ref.html # Bug 1377327
fuzzy-if(winWidget,1,10000) test-pref(svg.context-properties.content.enabled,true) == context-stroke-opacity-03.html context-fill-or-stroke-opacity-03-ref.html # Bug 1377327
fuzzy-if(winWidget,1,10000) test-pref(svg.context-properties.content.enabled,true) == context-stroke-opacity-04.html blue100x100-ref.html # Bug 1377327
fuzzy-if(winWidget,1,10000) test-pref(svg.context-properties.content.enabled,true) == context-stroke-opacity-05.html blue100x100-ref.html # Bug 1377327
# Simple <img> tests
== img-simple-1.html lime100x100-ref.html