diff options
Diffstat (limited to 'testing/web-platform/tests/css/filter-effects')
3 files changed, 69 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/filter-effects/backdrop-filter-clip-rect-2.html b/testing/web-platform/tests/css/filter-effects/backdrop-filter-clip-rect-2.html new file mode 100644 index 0000000000..8116bd0dcf --- /dev/null +++ b/testing/web-platform/tests/css/filter-effects/backdrop-filter-clip-rect-2.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>backdrop-filter: Clip the filter at border box of element</title> +<link rel="author" href="mailto:Hironori.Fujii@sony.com"> +<link rel="help" href="https://drafts.fxtf.org/filter-effects-2/#BackdropFilterProperty"> +<link rel="match" href="reference/backdrop-filter-clip-rect-2-ref.html"> +<meta name="fuzzy" content="maxDifference=0-80; totalPixels=0-1000" /> +<style> +.box { + display: inline-block; + box-sizing: border-box; + width: 100px; + height: 100px; + border-radius: 10px 20px 30px 40px; + border-width: 10px; +} +.no-bf > .box { + background: black; +} +.bf > .box { + border-color: transparent; + backdrop-filter: invert(1); +} +</style> +<div> + <p>Expected: Same size rounded black boxes.</p> +</div> + +<div class="no-bf"> + <div class="box"></div> + <div class="box"></div> + <div class="box"></div> +</div> +<div class="bf"> + <div class="box" style="border-style:none"></div> + <div class="box" style="border-style:solid"></div> + <div class="box" style="border-style:dotted"></div> +</div> diff --git a/testing/web-platform/tests/css/filter-effects/backdrop-filter-clip-rect.html b/testing/web-platform/tests/css/filter-effects/backdrop-filter-clip-rect.html index 5d5c707116..35b74652dc 100644 --- a/testing/web-platform/tests/css/filter-effects/backdrop-filter-clip-rect.html +++ b/testing/web-platform/tests/css/filter-effects/backdrop-filter-clip-rect.html @@ -4,6 +4,7 @@ <link rel="author" href="mailto:masonf@chromium.org"> <link rel="help" href="https://drafts.fxtf.org/filter-effects-2/#BackdropFilterProperty"> <link rel="match" href="backdrop-filter-clip-rect-ref.html"> +<meta name="fuzzy" content="maxDifference=0-1; totalPixels=0-1" /> <div> <p>Expected: A green box, color-inverted inside the short, wide box with a<br> diff --git a/testing/web-platform/tests/css/filter-effects/reference/backdrop-filter-clip-rect-2-ref.html b/testing/web-platform/tests/css/filter-effects/reference/backdrop-filter-clip-rect-2-ref.html new file mode 100644 index 0000000000..f12e88515f --- /dev/null +++ b/testing/web-platform/tests/css/filter-effects/reference/backdrop-filter-clip-rect-2-ref.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<link rel="author" href="mailto:Hironori.Fujii@sony.com"> +<style> +.box { + display: inline-block; + box-sizing: border-box; + width: 100px; + height: 100px; + border-radius: 10px 20px 30px 40px; + border-width: 10px; +} +.no-bf > .box { + background: black; +} +</style> +<div> + <p>Expected: Same size rounded black boxes.</p> +</div> + +<div class="no-bf"> + <div class="box"></div> + <div class="box"></div> + <div class="box"></div> +</div> +<div class="no-bf"> + <div class="box"></div> + <div class="box"></div> + <div class="box"></div> +</div> |