Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-05 21:50:18 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update CSS tests to revision b9c63d615a65c4d96f26969bcd504d4e1c3cdab8

Browse source
This commit is contained in:
Ms2ger 2016-04-22 10:06:45 +02:00
parent 0e0e902edd
commit 4d13f9f5d5
641 changed files with 24127 additions and 11370 deletions
Download patch file Download diff file Expand all files Collapse all files

42
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-clip-1-ref.htm Normal file
View file

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS mask-clip reference</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div {
position: absolute;
top: 10px;
background-color: purple;
}
div.border {
left: 10px;
margin: 1px 4px;
width: 60px;
height: 25px;
}
div.padding {
left: 110px;
margin: 9px 10px;
width: 52px;
height: 17px;
}
div.content {
left: 210px;
margin: 15px 13px;
width: 40px;
height: 11px;
}
</style>
</head>
<body>
<div class="color border"></div>
<div class="color padding"></div>
<div class="color content"></div>
</body></html>

19
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-image-1-ref.htm Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-image: mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div {
background-color: purple;
width: 100px;
height: 50px;
}
</style>
</head>
<body>
<div></div>
</body></html>

20
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-image-2-ref.htm Normal file
View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-image: mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div {
background-image: linear-gradient(rgba(128,0,128,0), rgba(128,0,128,1));
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<div></div>
<div></div>
</body></html>

52
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-mode-ref.htm Normal file
View file

@ -0,0 +1,52 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS mask-mode reference</title>
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div {
background-color: white;
position: absolute;
margin: 0px;
padding: 0px;
width: 100px;
height: 100px;
top: 10px;
}
div.auto {
left: 10px;
background-image: url(support/blue-100x100.svg);
}
div.alpha {
left: 120px;
background-image: url(support/blue-100x100.svg);
}
div.luminance1 {
left: 230px;
background-image: url(support/blue-luminance-100x100.svg);
}
div.luminance2 {
left: 340px;
background-image: url(support/red-luminance-100x100.svg);
}
div.luminance3 {
left: 450px;
background-image: url(support/green-luminance-100x100.svg);
}
</style>
</head>
<body>
<div class="auto"></div>
<div class="alpha"></div>
<div class="luminance1"></div>
<div class="luminance2"></div>
<div class="luminance3"></div>
</body></html>

34
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-origin-1-ref.htm Normal file
View file

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-origin: mask positioning area</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div.outer {
border: 1px solid black;
width: 100px;
height: 100px;
position: relative;
}
div.inner {
width: 50px;
height: 50px;
background-color: purple;
position: absolute;
}
#border { left: 4px; top: 1px; }
#padding { left: 10px; top: 9px; }
#content { left: 13px; top: 15px; }
</style>
</head>
<body>
<div class="outer"><div id="border" class="inner"></div></div>
<div class="outer"><div id="border" class="inner"></div></div>
<div class="outer"><div id="padding" class="inner"></div></div>
<div class="outer"><div id="content" class="inner"></div></div>
</body></html>

35
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-origin-2-ref.htm Normal file
View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-origin: mask positioning area</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div.outer {
border: 1px solid black;
width: 125px;
height: 125px;
position: relative;
}
div.inner {
width: 50px;
height: 50px;
background-color: purple;
position: absolute;
}
#pos-left-auto { left: 0px; top: 22px; }
#pos-left-bottom { left: 0px; top: 44px; }
#pos-right-top { left: 36px; top: 0px; }
#pos-right-bottom { left: 36px; top: 44px; }
</style>
</head>
<body>
<div class="outer"><div id="pos-left-auto" class="inner"></div></div>
<div class="outer"><div id="pos-left-bottom" class="inner"></div></div>
<div class="outer"><div id="pos-right-top" class="inner"></div></div>
<div class="outer"><div id="pos-right-bottom" class="inner"></div></div>
</body></html>

33
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-position-1-ref.htm Normal file
View file

@ -0,0 +1,33 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-position: position mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div.outer {
position: relative;
width: 100px;
height: 100px;
border: 1px solid black;
}
div.inner {
position: absolute;
width: 50px;
height: 50px;
background-color: purple;
}
#inner1 { right: 10px; bottom: 35px; }
#inner2 { right: 30px; bottom: 25px; }
</style>
</head>
<body>
<div class="outer"><div id="inner1" class="inner"></div></div>
<div class="outer"><div id="inner1" class="inner"></div></div>
<div class="outer"><div id="inner2" class="inner"></div></div>
<div class="outer"><div id="inner2" class="inner"></div></div>
</body></html>

29
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-position-2-ref.htm Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-position: position mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 100px;
height: 100px;
}
#inner {
margin-left: 20px;
margin-top: 20px;
width: 50px;
height: 50px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

29
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-position-3-ref.htm Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-position: position mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 100px;
height: 100px;
}
#inner {
margin-left: 25px;
margin-top: 10px;
width: 50px;
height: 50px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

29
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-position-4-ref.htm Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-position: position mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 100px;
height: 100px;
}
#inner {
margin-left: 0px;
margin-top: 25px;
width: 50px;
height: 50px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

38
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-position-5-ref.htm Normal file
View file

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-position: position mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 120px;
height: 120px;
}
#inner1 {
margin-left: 35px;
margin-top: 0px;
width: 50px;
height: 50px;
background-color: purple;
}
#inner2 {
margin-left: 35px;
margin-top: 20px;
width: 50px;
height: 50px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner1"></div>
<div id="inner2"></div>
</div>
</body></html>

30
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-position-6-ref.htm Normal file
View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-position: position mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
.outer {
border: 1px solid black;
width: 100px;
height: 100px;
}
.inner {
margin-left: 20px;
margin-top: 50px;
width: 50px;
height: 50px;
background-color: purple;
}
</style>
</head>
<body>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
</body></html>

30
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-position-7-ref.htm Normal file
View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-position: position mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
.outer {
border: 1px solid black;
width: 100px;
height: 100px;
}
.inner {
margin-left: 50px;
margin-top: 20px;
width: 50px;
height: 50px;
background-color: purple;
}
</style>
</head>
<body>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
</body></html>

45
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-repeat-1-ref.htm Normal file
View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-repeat: repeated mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div.outer {
width: 128px;
height: 128px;
position: relative;
border: 1px solid black;
}
div.inner {
width: 50px;
height: 50px;
position: absolute;
background-color: purple;
}
#pos-top-left { left: 0; top: 0; }
#pos-top-right { right: 0; top: 0; }
#pos-bottom-left { left: 0; bottom: 0; }
#pos-bottom-right { right: 0; bottom: 0; }
</style>
</head>
<body>
<div class="outer">
<div id="pos-top-left" class="inner"></div>
<div id="pos-top-right" class="inner"></div>
<div id="pos-bottom-left" class="inner"></div>
<div id="pos-bottom-right" class="inner"></div>
</div>
<div class="outer">
<div id="pos-top-left" class="inner"></div>
<div id="pos-top-right" class="inner"></div>
</div>
<div class="outer">
<div id="pos-top-left" class="inner"></div>
<div id="pos-bottom-left" class="inner"></div>
</div>
</body></html>

45
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-repeat-2-ref.htm Normal file
View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-repeat: repeated mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div.outer {
width: 128px;
height: 128px;
position: relative;
border: 1px solid black;
}
div.inner {
width: 50px;
height: 50px;
position: absolute;
background-color: purple;
}
#pos-top-left { left: 0; top: 0; }
#pos-top-right { right: 0; top: 0; }
#pos-bottom-left { left: 0; bottom: 0; }
#pos-bottom-right { right: 0; bottom: 0; }
</style>
</head>
<body>
<div class="outer">
<div id="pos-top-left" class="inner"></div>
<div id="pos-top-right" class="inner"></div>
<div id="pos-bottom-left" class="inner"></div>
<div id="pos-bottom-right" class="inner"></div>
</div>
<div class="outer">
<div id="pos-top-left" class="inner"></div>
<div id="pos-top-right" class="inner"></div>
</div>
<div class="outer">
<div id="pos-top-left" class="inner"></div>
<div id="pos-bottom-left" class="inner"></div>
</div>
</body></html>

40
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-repeat-3-ref.htm Normal file
View file

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-repeat: repeated mask layer image</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div.outer {
width: 150px;
height: 150px;
border: 1px solid black;
}
.color {
background-color: purple;
}
#round {
width: 150px;
height: 150px;
}
#round-x {
width: 150px;
height: 50px;
}
#round-y {
width: 50px;
height: 150px;
}
</style>
</head>
<body>
<div class="outer"><div id="round" class="color"></div></div>
<div class="outer"><div id="round-x" class="color"></div></div>
<div class="outer"><div id="round-y" class="color"></div></div>
</body></html>

27
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-auto-length-ref.htm Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 64px;
height: 128px;
}
#inner {
width: 20px;
height: 20px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

27
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-auto-ref.htm Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 64px;
height: 128px;
}
#inner {
width: 50px;
height: 50px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

27
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-contain-clip-border-ref.htm Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 64px;
height: 128px;
}
#inner {
width: 64px;
height: 64px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

35
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-contain-clip-padding-ref.htm Normal file
View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 64px;
height: 128px;
}
#inner {
border: 20px solid white;
width: 24px;
height: 88px;
}
#innermost {
width: 24px;
height: 24px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner">
<div id="innermost"></div>
</div>
</div>
</body></html>

33
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-contain-position-fifty-fifty-ref.htm Normal file
View file

@ -0,0 +1,33 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 64px;
height: 128px;
}
#inner1 {
width: 64px;
height: 32px;
}
#inner2 {
width: 64px;
height: 64px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner1"></div>
<div id="inner2"></div>
</div>
</body></html>

27
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-contain-ref.htm Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 10px solid black;
width: 64px;
height: 128px;
}
#inner {
width: 64px;
height: 64px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

21
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-cover-ref.htm Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 10px solid transparent;
width: 64px;
height: 128px;
background-clip: content-box;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer"></div>
</body></html>

27
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-length-length-ref.htm Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 64px;
height: 128px;
}
#inner {
width: 32px;
height: 64px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

27
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-length-percent-ref.htm Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 64px;
height: 128px;
}
#inner {
width: 16px;
height: 32px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

27
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-percent-percent-ref.htm Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
#outer {
border: 1px solid black;
width: 64px;
height: 128px;
}
#inner {
width: 32px;
height: 32px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

29
tests/wpt/css-tests/css-masking-1_dev/html/reference/mask-size-percent-percent-stretch-ref.htm Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>CSS Masking: mask-size: mask layer size</title>
<link href="mailto:aschen@mozilla.com" rel="author" title="Astley Chen">
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
<style type="text/css">
div {
width: 60px;
height: 120px;
}
#outer {
border: 10px solid black;
}
#inner {
height: 60px;
background-color: purple;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body></html>

3
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/50x100-opaque-blue.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="100">
<rect x="0" y="0" width="50" height="100" fill="blue" fill-opacity="1"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 146 B

3
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/50x50-opaque-blue.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50">
<rect x="0" y="0" width="50" height="50" fill="blue" fill-opacity="1"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 144 B

BIN
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/blue-100x100.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 39 KiB

3
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/blue-100x100.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="100%" height="100%" fill="blue" fill-opacity="1"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 125 B

2
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/blue-100x50-transparent-100x50.svg
View file

@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<rect x="0" y="0" width="100%" height="50%" fill="blue" fill-opacity="0"/>
<rect x="0" y="50" width="100%" height="50%" fill="blue" fill-opacity="1"/>
<rect x="0" y="50%" width="100%" height="50%" fill="blue" fill-opacity="1"/>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 216 B

After

Width:  |  Height:  |  Size: 217 B

Before After
Before After

3
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/blue-luminance-100x100.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="100%" height="100%" fill="RGB(238,238,255)" fill-opacity="1"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 137 B

BIN
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/green-100x100.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 39 KiB

3
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/green-100x100.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="100%" height="100%" fill="lime" fill-opacity="1"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 125 B

3
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/green-luminance-100x100.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="100%" height="100%" fill="RGB(73,73,255)" fill-opacity="1"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 135 B

8
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/mask-half-transparent-100x100.svg Normal file
View file

@ -0,0 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<defs>
<mask id="mask" mask-type="alpha">
<rect x="0" y="0" width="100" height="50" fill-opacity="1"/>
<rect x="0" y="50" width="100" height="50" fill-opacity="0"/>
</mask>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 266 B

BIN
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/red-100x100.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 39 KiB

3
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/red-100x100.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="100%" height="100%" fill="red" fill-opacity="1"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 124 B

3
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/red-luminance-100x100.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="100%" height="100%" fill="RGB(201,201,255)" fill-opacity="1"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 137 B

2
tests/wpt/css-tests/css-masking-1_dev/html/reference/support/transparent-100x50-blue-100x50.svg
View file

@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<rect x="0" y="0" width="100%" height="50%" fill="blue" fill-opacity="1"/>
<rect x="0" y="50" width="100%" height="50%" fill="blue" fill-opacity="0"/>
<rect x="0" y="50%" width="100%" height="50%" fill="blue" fill-opacity="0"/>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 216 B

After

Width:  |  Height:  |  Size: 217 B

Before After
Before After