Bug 1766501 - Make backdrop-filter blurs use Duplicate for edgeMode r=gfx-reviewers,lsalzman

Differential Revision: https://phabricator.services.mozilla.com/D145682
This commit is contained in:
Glenn Watson 2022-05-08 21:06:26 +00:00
Родитель 4ce1ce51db
Коммит 02aa3d190d
6 изменённых файлов: 43 добавлений и 1 удалений

Просмотреть файл

@ -2456,6 +2456,7 @@ impl<'a> SceneBuilder<'a> {
stacking_context.composite_ops.filters, stacking_context.composite_ops.filters,
stacking_context.composite_ops.filter_primitives, stacking_context.composite_ops.filter_primitives,
stacking_context.composite_ops.filter_datas, stacking_context.composite_ops.filter_datas,
None,
); );
// Same for mix-blend-mode, except we can skip if this primitive is the first in the parent // Same for mix-blend-mode, except we can skip if this primitive is the first in the parent
@ -3615,6 +3616,7 @@ impl<'a> SceneBuilder<'a> {
filters, filters,
filter_primitives, filter_primitives,
filter_datas, filter_datas,
Some(false),
); );
// Clip the backdrop filter to the outline of the backdrop-filter prim. If this is // Clip the backdrop filter to the outline of the backdrop-filter prim. If this is
@ -3661,6 +3663,7 @@ impl<'a> SceneBuilder<'a> {
mut filter_ops: Vec<Filter>, mut filter_ops: Vec<Filter>,
mut filter_primitives: Vec<FilterPrimitive>, mut filter_primitives: Vec<FilterPrimitive>,
filter_datas: Vec<FilterData>, filter_datas: Vec<FilterData>,
should_inflate_override: Option<bool>,
) -> PictureChainBuilder { ) -> PictureChainBuilder {
// TODO(cbrewster): Currently CSS and SVG filters live side by side in WebRender, but unexpected results will // TODO(cbrewster): Currently CSS and SVG filters live side by side in WebRender, but unexpected results will
// happen if they are used simulataneously. Gecko only provides either filter ops or filter primitives. // happen if they are used simulataneously. Gecko only provides either filter ops or filter primitives.
@ -3704,7 +3707,18 @@ impl<'a> SceneBuilder<'a> {
if filter.is_noop() { if filter.is_noop() {
continue; continue;
} else { } else {
PictureCompositeMode::Filter(filter.clone()) let mut filter = filter.clone();
// backdrop-filter spec says that blurs should assume edgeMode=Duplicate
// We can do this by not inflating the bounds, which means the blur
// shader will duplicate pixels outside the sample rect
if let Some(should_inflate_override) = should_inflate_override {
if let Filter::Blur { ref mut should_inflate, .. } = filter {
*should_inflate = should_inflate_override;
}
}
PictureCompositeMode::Filter(filter)
} }
} }
}; };

Двоичный файл не отображается.

До

Ширина:  |  Высота:  |  Размер: 25 KiB

После

Ширина:  |  Высота:  |  Размер: 109 KiB

Просмотреть файл

@ -0,0 +1,10 @@
# Verify that blurs on backdrop-filters use edgeMode=duplicate
---
root:
items:
- type: rect
bounds: 0 0 400 400
color: red
- type: rect
bounds: 100 100 200 200
color: blue

Просмотреть файл

@ -0,0 +1,17 @@
# Verify that blurs on backdrop-filters use edgeMode=duplicate
---
root:
items:
- type: stacking-context
backdrop-root: true
bounds: 0 0 0 0
items:
- type: rect
bounds: 0 0 400 400
color: red
- type: rect
bounds: 100 100 200 200
color: blue
- type: backdrop-filter
bounds: 100 100 200 200
filters: ["blur(10,10)"]

Двоичный файл не отображается.

До

Ширина:  |  Высота:  |  Размер: 42 KiB

После

Ширина:  |  Высота:  |  Размер: 52 KiB

Просмотреть файл

@ -69,6 +69,7 @@ fuzzy(1,1) platform(linux,mac) == svg-filter-drop-shadow-perspective.yaml svg-fi
#platform(linux,mac) == backdrop-filter-overlap.yaml backdrop-filter-overlap.png #platform(linux,mac) == backdrop-filter-overlap.yaml backdrop-filter-overlap.png
#platform(linux,mac) == backdrop-filter-blur-across-tiles.yaml backdrop-filter-blur-across-tiles.png #platform(linux,mac) == backdrop-filter-blur-across-tiles.yaml backdrop-filter-blur-across-tiles.png
#platform(linux,mac) == backdrop-filter-drop-shadow.yaml backdrop-filter-drop-shadow.png #platform(linux,mac) == backdrop-filter-drop-shadow.yaml backdrop-filter-drop-shadow.png
#== backdrop-filter-blur-edge-mode.yaml backdrop-filter-blur-edge-mode-ref.yaml
platform(linux,max) == svg-filter-offset.yaml svg-filter-offset-ref.yaml platform(linux,max) == svg-filter-offset.yaml svg-filter-offset-ref.yaml
skip_on(android,device) == fuzzy(1,100) svg-filter-composite.yaml svg-filter-composite-ref.yaml skip_on(android,device) == fuzzy(1,100) svg-filter-composite.yaml svg-filter-composite-ref.yaml
skip_on(android,device) == filter-mix-blend-scaling.yaml filter-mix-blend-scaling-ref.yaml skip_on(android,device) == filter-mix-blend-scaling.yaml filter-mix-blend-scaling-ref.yaml