Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-09 15:35:34 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update web-platform-tests to revision 155daf0c385420faf208b8bd5e319e244ec7f9cc

Browse source
This commit is contained in:
WPT Sync Bot 2018-05-27 21:17:21 -04:00 • committed by Josh Matthews
parent 4e6b100c7e
commit e9bdf87a27
768 changed files with 5782 additions and 26218 deletions
Download patch file Download diff file Expand all files Collapse all files

4
tests/wpt/web-platform-tests/css/css-masking/clip-path-svg-content/clip-path-css-transform-002.svg
View file

@ -11,10 +11,10 @@
cause masking in some implementations. A green square should be
visible.</desc>
</g>
<clipPath id="clip1" style="transform: scale(10) translate(2px, 2px);">
<clipPath id="clip1" style="transform: scale(10) translate(5px, 5px);">
<rect width="10" height="10"/>
<!-- Second rect may cause masking -->
<rect width="5" height="4"/>
</clipPath>
<rect width="200" height="200" fill="green" clip-path="url(#clip1)"/>
</svg>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1 KiB

After

Width:  |  Height:  |  Size: 1 KiB

Before After
Before After

4
tests/wpt/web-platform-tests/css/css-masking/clip-path-svg-content/clip-path-dom-href.svg
View file

@ -14,12 +14,12 @@
<rect width="200" height="200"/>
</clipPath>
<g clip-path="url(#noclip)">
<g clip-path="url(#noclip)" id="target">
<rect width="400" height="400" fill="red"/>
<rect width="200" height="200" fill="green"/>
</g>
<script>
document.getElementsByTagName("g")[0].setAttribute("clip-path", "url(#clip1)");
document.getElementById("target").setAttribute("clip-path", "url(#clip1)");
</script>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 985 B

After

Width:  |  Height:  |  Size: 993 B

Before After
Before After

4
tests/wpt/web-platform-tests/css/css-masking/clip-path-svg-content/reference/clip-path-clip-rule-004-ref.svg Normal file
View file

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg">
<polygon points="0 0, 150 0, 150 150, 0 150, 0 25, 125 25, 125 125, 25 125, 25 25, 0 25" fill-rule="evenodd" fill="green"/>
<polygon points="50 50, 200 50, 200 200, 50 200, 50 75, 175 75, 175 175, 75 175, 75 75, 50 75" fill-rule="evenodd" fill="green"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 306 B

8
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-element-userSpaceOnUse-002.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-ellipse-002.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-ellipse-003.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-ellipse-004.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-ellipse-005.html
View file

@ -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>

8
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-ellipse-006.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-ellipse-007.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-ellipse-008.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-polygon-001.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-polygon-002.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-polygon-003.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-polygon-004.html
View file

@ -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>

4
tests/wpt/web-platform-tests/css/css-masking/clip-path/clip-path-polygon-005.html
View file

@ -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>