mozilla
/
gecko-dev
зеркало из https://github.com/mozilla/gecko-dev.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Bug 1526604 [wpt PR 15194] - Fix BGPT backdrop-filter with opacity<1 parent, a=testonly 

Automatic update from web-platform-tests
Fix BGPT backdrop-filter with opacity<1 parent

Previous to this CL, a layer with opacity<1 that contained a single compositing
child with backdrop-filter would not be properly rendered, due to an
optimization that removed the render surface for the opacity<1 layer. That
would cause the backdrop-filter to filter elements higher up the tree than it
should, due to the lack of isolation imposed by the opacity<1 layer. With this
CL, this situation is properly detected and a render surface is assigned to the
opacity<1 layer.

As part of this CL, backdrop-filter was moved from the Filter node to the
Effect node. This is required, because a single element with both opacity
and backdrop-filter need to be contained in the same node, so that the
render surface created for the backdrop filter also sees the opacity.

Bug: 497522, 836885
Change-Id: Ie6ad38231ddfda02fae8d574ca8f30d075c673e5
Reviewed-on: https://chromium-review.googlesource.com/c/1399467
Commit-Queue: Mason Freed <masonfreed@chromium.org>
Reviewed-by: Chris Harrelson <chrishtr@chromium.org>
Cr-Commit-Position: refs/heads/master@{#629835}

--

wpt-commits: 7c61bbcbdaebae56e093017387b21b473070bd8d
wpt-pr: 15194
This commit is contained in:
Mason Freed 2019-02-18 19:25:34 +00:00 коммит произвёл James Graham
Родитель 89de5c740b
Коммит 50f19061a6
2 изменённых файлов: 0 добавлений и 68 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

36
testing/web-platform/tests/css/filter-effects/backdrop-filter-border-radius-ref.html
Просмотреть файл

@ -1,36 +0,0 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>backdrop-filter: Should clip using border radius.</title>
<link rel="author" title="Mason Freed" href="mailto:masonfreed@chromium.org">
<div>
<div class="circle outside"></div>
<div class="circle inside"></div>
</div>
<style>
div {
position: absolute;
width: 100px;
height: 100px;
top: 10px;
left: 10px;
background: green;
}
.circle {
top: 30px;
left: 30px;
border-radius: 50px;
background: #ffff0060;
}
.inside {
background: #ffaf9f;
clip-path: inset(0px 30px 30px 0px);
}
.outside {
background: #ffff9f;
}
</style>

32
testing/web-platform/tests/css/filter-effects/backdrop-filter-border-radius.html
Просмотреть файл

@ -1,32 +0,0 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>backdrop-filter: Should clip using border radius.</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="match" href="backdrop-filter-border-radius-ref.html">
<div style="opacity: 0.9999;">
<div class="circle filter"></div>
</div>
<style>
div {
position: absolute;
width: 100px;
height: 100px;
top: 10px;
left: 10px;
background: green;
}
.circle {
top: 30px;
left: 30px;
border-radius: 50px;
background: #ffff0060;
}
.filter {
backdrop-filter: invert(1);
}
</style>