Commit 53238de8 authored by Mason Freed's avatar Mason Freed Committed by Chromium LUCI CQ

Add a test for backdrop filter underlapping a border

A recent bug [1] showed that in SkiaRenderer, it was possible for a
backdrop-filter element to blend pixels from a neighboring (but not
underlapping) render pass, due to some clipping issues. This test
checks for this situation.

The original bug was fixed in [2], but I verified that this test
breaks pre-[2] (see patchset 1 of this CL).

[1] https://crbug.com/1162743
[2] https://chromium-review.googlesource.com/c/chromium/src/+/2611452

Bug: 1162743
Change-Id: I86d00d9831057ace40476d29848c11ba1b671a82
Fixed: 1165868
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2625156
Auto-Submit: Mason Freed <masonfreed@chromium.org>
Commit-Queue: kylechar <kylechar@chromium.org>
Reviewed-by: default avatarkylechar <kylechar@chromium.org>
Cr-Commit-Position: refs/heads/master@{#843000}
parent 18119ba1
......@@ -1064,8 +1064,6 @@ void SkiaRenderer::PrepareCanvasForRPDQ(const DrawRPDQParams& rpdq_params,
// Only sample from pixels behind the RPDQ for backdrop filters to avoid
// color bleeding with pixel-moving filters.
// TODO(crbug.com/1165868): Add web platform test to verify this clip is
// done correctly.
if (rpdq_params.bypass_geometry) {
crop_rect.Intersect(rpdq_params.bypass_geometry->rect);
} else {
......
<!DOCTYPE html>
<meta charset="utf-8">
<title>backdrop-filter: Edge behavior</title>
<link rel="author" title="Mason Freed" href="mailto:masonfreed@chromium.org">
<div>
<p>Expected: The black box inside the red box should not contain any red.</p>
</div>
<div id=backdrop></div>
<div id=scroller></div>
<style>
#scroller {
position: relative;
top:-202px;
width: 250px;
height: 250px;
border: 6px solid red;
}
#backdrop {
position: relative;
height: 200px;
width: 200px;
left: 6px;
top: 3px;
border: 1px solid black;
}
</style>
<!DOCTYPE html>
<meta charset="utf-8">
<title>backdrop-filter: Edge behavior</title>
<link rel="author" title="Mason Freed" href="mailto:masonfreed@chromium.org">
<link rel="help" href="https://drafts.fxtf.org/filter-effects-2/#BackdropFilterProperty">
<link rel="help" href="https://crbug.com/1165868">
<link rel="match" href="backdrop-filter-edge-behavior-ref.html">
<div>
<p>Expected: The black box inside the red box should not contain any red.</p>
</div>
<div id=scroller>
<div class=filler></div>
<div id=backdrop></div>
<div class=filler></div>
</div>
<style>
#scroller {
width: 250px;
height: 250px;
overflow: scroll;
border: 6px solid red;
}
#scroller::-webkit-scrollbar {
width: 0px;
}
#backdrop {
height: 200px;
width: 200px;
backdrop-filter: blur(10px);
border: 1px solid black;
}
.filler {
position: relative;
left: 50px;
width: 100px;
height: 100px;
}
</style>
<script>
scroller.scrollTop = 103;
</script>
\ No newline at end of file
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment