Fix mask-based clip-path with backdrop filter

Cc requires additional bookkeeping for the case, including setting the mask layer as a backdrop mask layer, etc. Also let CompositeAfterPaint composite the backdrop mask layer which is also required by cc. Bug: 1144520 Change-Id: Id9be79d398c1c4b41aa97a7c8c3e23546ce87365 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2518440 Reviewed-by: Mason Freed <[email protected]> Commit-Queue: Xianzhu Wang <[email protected]> Cr-Commit-Position: refs/heads/master@{#824041}
web-platform-tests · Nov 4, 2020 · 0bfbfff · 0bfbfff
1 parent 7a287c9
commit 0bfbfff
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 0 deletions.
diff --git a/css/css-masking/clip-path/clip-path-svg-text-backdrop-filter-ref.html b/css/css-masking/clip-path/clip-path-svg-text-backdrop-filter-ref.html
@@ -0,0 +1,11 @@
+<!doctype html>
+<meta name="flags" content="ahem">
+<link rel="stylesheet" href="/fonts/ahem.css" />
+<style>
+#svgText {
+  font: 100px/1 Ahem;
+}
+</style>
+<svg width="500" height="300">
+  <text id="svgText" x="10" y="100">Text</text>
+</svg>
diff --git a/css/css-masking/clip-path/clip-path-svg-text-backdrop-filter.html b/css/css-masking/clip-path/clip-path-svg-text-backdrop-filter.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<link rel="help" href="http://www.w3.org/TR/css-masking-1/#the-clip-path">
+<link rel="help" href="https://drafts.fxtf.org/filter-effects-2/#BackdropFilterProperty">
+<link rel="match" href="clip-path-svg-text-backdrop-filter-ref.html">
+<meta name="flags" content="ahem">
+<link rel="stylesheet" href="/fonts/ahem.css" />
+<style>
+.masked {
+  width: 500px;
+  height: 300px;
+  clip-path: url(#svgPath);
+  backdrop-filter: invert(100%);
+  background: transparent;
+}
+#svgText {
+  font: 100px/1 Ahem;
+}
+</style>
+<div class="masked"></div>
+<svg>
+  <clipPath id="svgPath">
+    <text id="svgText" x="10" y="100">Text</text>
+  </clipPath>
+</svg>