mirror of
https://github.com/servo/servo.git
synced 2025-08-05 21:50:18 +01:00
Update web-platform-tests and CSS tests.
- Update CSS tests to revision e05bfd5e30ed662c2f8a353577003f8eed230180. - Update web-platform-tests to revision a052787dd5c069a340031011196b73affbd68cd9.
This commit is contained in:
Ms2ger
parent
fb4f421c8b
commit
296fa2512b
21852 changed files with 2080936 additions and 892894 deletions
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Masking: clip-path: clip path geometry box</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
</head>
|
||||
<body>
|
||||
<svg width="200" style="position: absolute; left: 0px; top: 0px;" height="200">
|
||||
<circle cy="100" cx="100" r="50" fill="blue"></circle>
|
||||
</svg>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Masking: clip-path: clip path geometry box</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
</head>
|
||||
<body>
|
||||
<svg width="200" style="position: absolute; left: 0px; top: 0px;" height="200">
|
||||
<polygon points="100,50 150,100 150,150 50,150 50,100" fill="blue"></polygon>
|
||||
</svg>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>Reference for clip-path linked to local-ref URL</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
</head><body><svg width="0" height="0">
|
||||
<defs>
|
||||
<clipPath id="c1">
|
||||
<circle cy="110" cx="137" r="90"></circle>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<style>
|
||||
div {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
background-color: blue;
|
||||
clip-path: url(#c1);
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS clip-path reference</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
div.foreground {
|
||||
position: absolute;
|
||||
background-color: rgb(0,0,255);
|
||||
z-index: 100;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
div.background {
|
||||
position: absolute;
|
||||
background-color: rgb(0,255,255);
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="foreground"></div>
|
||||
<div class="background"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -31,12 +31,20 @@
|
|||
width: 40px;
|
||||
height: 11px;
|
||||
}
|
||||
|
||||
div.no-clip {
|
||||
left: 310px;
|
||||
margin: 1px 4px;
|
||||
width: 100px;
|
||||
height: 25px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="color border"></div>
|
||||
<div class="color padding"></div>
|
||||
<div class="color content"></div>
|
||||
<div class="color no-clip"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS mask-clip reference</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
svg {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<svg width="200" style="left: 10px;" height="200">
|
||||
<rect y="20" width="100" fill="blue" x="20" height="100"></rect>
|
||||
</svg>
|
||||
<svg width="200" style="left: 220px;" height="200">
|
||||
<rect y="50" width="50" fill="blue" x="50" height="50"></rect>
|
||||
</svg>
|
||||
<svg width="200" style="left: 10px; top: 220px;" height="200">
|
||||
<rect y="50" width="50" fill="green" x="50" height="50"></rect>
|
||||
<rect y="60" width="40" fill="blue" x="60" height="40"></rect>
|
||||
</svg>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
background-color: blue;
|
||||
}
|
||||
|
||||
div.substract {
|
||||
div.subtract {
|
||||
left: 120px;
|
||||
background-image: url(support/blue-100x50-transparent-100x50.svg);
|
||||
}
|
||||
|
|
@ -32,7 +32,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="add"></div>
|
||||
<div class="substract"></div>
|
||||
<div class="subtract"></div>
|
||||
<div class="exclude"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Masking: mask-image: multiple SVG masks</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
</head><body><svg height="0">
|
||||
<mask y="0" width="1" height="1" id="mask" x="0">
|
||||
<rect y="0" width="50" style="stroke:none; fill: #ffffff" height="50" x="0"></rect>
|
||||
<circle style="stroke:none; fill: #ffffff" cx="50" r="25" cy="50"></circle>
|
||||
</mask>
|
||||
</svg>
|
||||
<style type="text/css">
|
||||
div {
|
||||
background-color: purple;
|
||||
mask: url(#mask);
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
|
||||
<div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Masking: mask-image: data url mask</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
div {
|
||||
background-color: purple;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
|
||||
|
||||
</div></body></html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Masking: mask on inline element</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
div {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
font-size: 100px;
|
||||
line-height: 100px;
|
||||
}
|
||||
|
||||
div.mask-by-png {
|
||||
mask-image: url(support/transparent-100x50-blue-100x50.png);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="mask-by-png">A</div>
|
||||
<div class="mask-by-png">B</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
<!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: blue;
|
||||
position: absolute;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
top: 10px;
|
||||
}
|
||||
|
||||
div.match-luminance {
|
||||
left: 10px;
|
||||
background-image: url(support/blue-luminance-100x100.svg);
|
||||
}
|
||||
|
||||
div.match-alpha {
|
||||
left: 120px;
|
||||
background-image: url(support/blue-100x100.svg);
|
||||
}
|
||||
|
||||
div.luminance-luminance {
|
||||
top: 120px;
|
||||
left: 10px;
|
||||
background-image: url(support/blue-luminance-100x100.svg);
|
||||
}
|
||||
|
||||
div.luminance-alpha {
|
||||
top: 120px;
|
||||
left: 120px;
|
||||
background-image: url(support/blue-luminance-100x100.svg);
|
||||
}
|
||||
|
||||
div.alpha-luminance {
|
||||
top: 230px;
|
||||
left: 10px;
|
||||
background-image: url(support/blue-100x100.svg);
|
||||
}
|
||||
|
||||
div.alpha-alpha {
|
||||
top: 230px;
|
||||
left: 120px;
|
||||
background-image: url(support/blue-100x100.svg);
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div class="match-luminance"></div>
|
||||
<div class="match-alpha"></div>
|
||||
<div class="luminance-luminance"></div>
|
||||
<div class="luminance-alpha"></div>
|
||||
<div class="alpha-luminance"></div>
|
||||
<div class="alpha-alpha"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Masking: mask-image: mask with opacity</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
div {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 60px;
|
||||
background-color: rgba(0,0,255,0.5);
|
||||
width: 100px;
|
||||
height: 50px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Masking: mask-origin: mask positioning area</title>
|
||||
<link href="mailto:cku@mozilla.com" rel="author" title="CJ Ku">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
svg {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<svg width="200" style="left: 10px;" height="200">
|
||||
<rect y="50" width="50" fill="blue" x="50" height="50"></rect>
|
||||
</svg>
|
||||
<svg width="200" style="left: 240px;" height="200">
|
||||
<rect y="50" width="50" fill="green" x="50" height="50"></rect>
|
||||
<rect y="60" width="40" fill="blue" x="60" height="40"></rect>
|
||||
</svg>
|
||||
<svg width="200" style="left: 10px; top: 220px;" height="200">
|
||||
<rect y="40" width="50" fill="green" x="60" height="50"></rect>
|
||||
<rect y="60" width="30" fill="blue" x="80" height="30"></rect>
|
||||
</svg>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -12,33 +12,37 @@
|
|||
border: 1px solid black;
|
||||
}
|
||||
|
||||
div.inner {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
position: absolute;
|
||||
.color {
|
||||
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; }
|
||||
#default {
|
||||
position: absolute;
|
||||
width: 50px; height: 50px;
|
||||
}
|
||||
|
||||
#repeat-x {
|
||||
position: absolute;
|
||||
width: 100%; height: 50px;
|
||||
}
|
||||
|
||||
#repeat-y {
|
||||
position: absolute;
|
||||
width: 50px; height: 100%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer color"></div>
|
||||
<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 id="default" class="color"></div>
|
||||
</div>
|
||||
<div class="outer color"></div>
|
||||
<div class="outer">
|
||||
<div id="repeat-x" class="color"></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 id="repeat-y" class="color"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue