Bug 1941545 [wpt PR 50068] - CSS shape() - Set WindRule when emitting path, a=testonly
Automatic update from web-platform-tests CSS shape() - Set WindRule when emitting path Bug: 384605099 Change-Id: I0ad8563f6dcba405b4cd517709725146f0828e5b Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6172369 Commit-Queue: Noam Rosenthal <nrosenthal@chromium.org> Reviewed-by: Fredrik Söderquist <fs@opera.com> Cr-Commit-Position: refs/heads/main@{#1405999} -- wpt-commits: 97e933ecb5a7fdb0f231fa669444d6c99619850a wpt-pr: 50068
This commit is contained in:
committed by
moz-wptsync-bot
parent
fc556dc166
commit
b336072796
@@ -0,0 +1,25 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>CSS Masking: Test clip-path property and shape function with nonzero fill</title>
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-shapes-2/#funcdef-shape">
|
||||||
|
<link rel="match" href="reference/clip-path-path-winding-ref.html">
|
||||||
|
<meta name="assert" content="The clip-path property takes the basic shape
|
||||||
|
'shape()' for clipping, with evenodd winding. On pass you should
|
||||||
|
see a green square with an empty white square inside it.">
|
||||||
|
</head>
|
||||||
|
<style>
|
||||||
|
#rect {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
background-color: green;
|
||||||
|
clip-path: shape(evenodd from 10px 10px,
|
||||||
|
hline by 80px, vline by 80%, hline by -80%, close,
|
||||||
|
move to 25px 25px, hline by 50px, vline by 50px, hline by -50%, close);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<body>
|
||||||
|
<p>The test passes if there is a green rect with an empty white rect inside it.</p>
|
||||||
|
<div id="rect"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,29 @@
|
|||||||
|
<!--
|
||||||
|
Any copyright is dedicated to the Public Domain.
|
||||||
|
http://creativecommons.org/publicdomain/zero/1.0/
|
||||||
|
-->
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>CSS Masking: Reference for clip-path's path function with evenodd</title>
|
||||||
|
<style type="text/css">
|
||||||
|
#rect {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
background-color: green;
|
||||||
|
clip-path: url("#clip");
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>The test passes if there is a green rect with an empty white rect inside it.</p>
|
||||||
|
<div id="rect"></div>
|
||||||
|
<svg height="0" width="0">
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip">
|
||||||
|
<path clip-rule="evenodd" d="M10,10h80v80h-80zM25,25h50v50h-50z"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user