mirror of
https://github.com/servo/servo.git
synced 2025-08-11 08:25:32 +01:00
Update web-platform-tests to revision 155daf0c385420faf208b8bd5e319e244ec7f9cc
This commit is contained in:
parent
4e6b100c7e
commit
e9bdf87a27
768 changed files with 5782 additions and 26218 deletions
|
@ -11,13 +11,13 @@
|
|||
On pass you should see a green with a blue border.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green box with a blue border.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid blue 50px; background-color: green; clip-path: url(#clip);"></div>
|
||||
<p>The test passes if there is a green box.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid red 50px; background-color: green; clip-path: url(#clip);"></div>
|
||||
|
||||
<svg>
|
||||
<clipPath id="clip">
|
||||
<rect x="0" y="0" width="250px" height="200" />
|
||||
<rect x="50" y="50" width="150px" height="100" />
|
||||
</clipPath>
|
||||
</svg>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
On pass you should see a green ellipse.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green ellipse.</p>
|
||||
<p>The test passes if there is a full green ellipse.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid red 50px; background-color: green; clip-path: ellipse(30% 25% at 50% 50%);"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
On pass there should be a full green circle.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green circle.</p>
|
||||
<p>The test passes if there is a full green circle.</p>
|
||||
<div style="width: 200px; height: 200px; background-color: green; clip-path: ellipse(50% 50% at 50% 50%);"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
should see a green ellipse.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green ellipse.</p>
|
||||
<p>The test passes if there is a full green ellipse.</p>
|
||||
<div style="width: 200px; height: 200px; background-color: green; clip-path: ellipse(75px 50px at 125px 100px);"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
see a green ellipse.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green ellipse.</p>
|
||||
<p>The test passes if there is a full green ellipse.</p>
|
||||
<div style="width: 200px; height: 200px; background-color: green; clip-path: ellipse(37.5% 25% at 62.5% 50%);"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -5,13 +5,13 @@
|
|||
<link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-masking-1/#clipping-paths">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-masking-1/#propdef-clip-path">
|
||||
<link rel="match" href="reference/clip-path-circle-ref.html">
|
||||
<link rel="match" href="reference/clip-path-ellipse-ref.html">
|
||||
<meta name="assert" content="The clip-path property takes the basic shape
|
||||
'ellipse' for clipping. Test absolute values for radii and position
|
||||
arguments. On pass you should see a green circle.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green circle.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid red 50px; background-color: green; clip-path: ellipse();"></div>
|
||||
<p>The test passes if there is a full green ellipse.</p>
|
||||
<div style="width: 150px; height: 100px; position: absolute; margin: 50px; background-color: green; clip-path: ellipse();"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -13,6 +13,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a full green ellipse.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid red 50px; background-color: green; clip-path: ellipse(farthest-side closest-side);"></div>
|
||||
<div style="width: 150px; height: 100px; position: absolute; margin: 50px; background-color: green; clip-path: ellipse(farthest-side closest-side);"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -16,6 +16,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a full green ellipse.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid red 50px; background-color: green; clip-path: ellipse(50% 50%);"></div>
|
||||
<div style="width: 150px; height: 100px; position: absolute; margin: 50px; background-color: green; clip-path: ellipse(50% 50%);"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
see a green square and no red.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green square and no red.</p>
|
||||
<p>The test passes if there is a green box.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid red 50px; background-color: green; clip-path: polygon(50px 50px, 200px 50px, 200px 150px, 50px 150px)"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
green square and no red.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green square and no red.</p>
|
||||
<p>The test passes if there is a green box.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid red 50px; background-color: green; clip-path: polygon(20% 25%, 80% 25%, 80% 75%, 20% 75%)"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
pass you should see a green square and no red.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green square and no red.</p>
|
||||
<p>The test passes if there is a green box.</p>
|
||||
<div style="width: 150px; height: 100px; border: solid red 50px; background-color: green; position: absolute; clip-path: polygon(20% 50px, 200px 25%, 200px 150px, 20% 75%)"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css-masking-1/#propdef-clip-path">
|
||||
<link rel="match" href="reference/clip-path-rectangle-border-ref.html">
|
||||
<meta name="assert" content="The clip-path property takes the basic shape 'polygon' for clipping.
|
||||
The point list for the polygon creates a 'whole' with the dimension of the background. With
|
||||
The point list for the polygon creates a 'hole' with the dimension of the background. With
|
||||
the fill rule 'evenodd', this whole is clipped out. The clipping makes the green background
|
||||
of the parent div box visible.
|
||||
On pass you should see a green box with a blue border.">
|
||||
|
@ -18,4 +18,4 @@
|
|||
<div style="width: 150px; height: 100px; border: solid blue 50px; background-color: red; clip-path: polygon(evenodd, 0 0, 250px 0, 250px 200px, 0 200px, 0 50px, 200px 50px, 200px 150px, 50px 150px, 50px 50px, 0 50px)"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -14,9 +14,9 @@
|
|||
square with a blue border.">
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if there is a green square with a blue border.</p>
|
||||
<p>The test passes if there is a green box with a blue border.</p>
|
||||
<div style="background-color: green; width: 250px;">
|
||||
<div style="width: 150px; height: 100px; border: solid blue 50px; background-color: red; clip-path: polygon(nonzero, 0 0, 250px 0, 250px 200px, 0 200px, 0 50px, 50px 50px, 50px 150px, 200px 150px, 200px 50px, 0 50px)"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue