Bug 1395151 - Don't apply ancestors' opacity if the opacity item has an async opacity animation. r?birtles,mattwoodrow
MozReview-Commit-ID: KsxukpGrH6P
--- a/layout/painting/nsDisplayList.cpp
+++ b/layout/painting/nsDisplayList.cpp
@@ -6044,17 +6044,18 @@ nsDisplayOpacity::ApplyOpacity(nsDisplay
NS_ASSERTION(CanApplyOpacity(), "ApplyOpacity should be allowed");
mOpacity = mOpacity * aOpacity;
IntersectClip(aBuilder, aClip);
}
bool
nsDisplayOpacity::CanApplyOpacity() const
{
- return true;
+ return !EffectCompositor::HasAnimationsForCompositor(mFrame,
+ eCSSProperty_opacity);
}
/**
* Recursively iterates through |aList| and collects at most |aMaxChildCount|
* display item pointers to items that return true for CanApplyOpacity().
* The item pointers are added to |aArray|.
*
* LayerEventRegions and WrapList items are ignored.
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-animations/opacity-animation-in-fixed-opacity-parent-ref.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+ <title>Testcase, bug 1395151</title>
+ <style type="text/css">
+.ok {
+ background : #0f0;
+ height : 40px;
+ width : 40px;
+}
+.error {
+ opacity : .001;
+ height : 100%;
+ width : 100%;
+}
+.error > span {
+ background : #f00;
+ content : "";
+ display : block;
+ height : 100%;
+ width : 100%;
+}
+ </style>
+</head>
+<body>
+<div class="ok">
+ <div class="error"><span></span></div>
+</div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-animations/opacity-animation-in-fixed-opacity-parent.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html class="reftest-wait reftest-no-flush">
+<head>
+ <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+ <title>Testcase, bug 1395151</title>
+ <style type="text/css">
+@keyframes test-anim {
+ from { opacity : 1 }
+ to { opacity : 1 }
+}
+
+.ok {
+ background : #0f0;
+ height : 40px;
+ width : 40px;
+}
+
+.error {
+ opacity : .001;
+ height : 100%;
+ width : 100%;
+}
+
+.error > span {
+ animation : test-anim 1s linear infinite;
+ background : #f00;
+ content : "";
+ display : block;
+ height : 100%;
+ width : 100%;
+}
+ </style>
+</head>
+<body>
+<div class="ok">
+ <div class="error"><span></span></div>
+</div>
+<script>
+document.addEventListener('MozReftestInvalidate', () => {
+ requestAnimationFrame(() => {
+ requestAnimationFrame(() => {
+ document.documentElement.classList.remove('reftest-wait');
+ });
+ });
+}, false);
+</script>
+</body>
+</html>
--- a/layout/reftests/css-animations/reftest.list
+++ b/layout/reftests/css-animations/reftest.list
@@ -61,8 +61,10 @@ fails-if(layerChecksEnabled) == backgrou
== reframe-and-animation-starts-at-the-same-time.html reframe-and-animation-starts-at-the-same-time-ref.html
== change-animation-name-to-none-in-rule.html change-animation-name-in-rule-ref.html
== change-animation-name-to-other-in-rule.html change-animation-name-in-rule-ref.html
== change-animation-name-to-non-existent-in-rule.html change-animation-name-in-rule-ref.html
== no-style-sharing-with-animations.html no-style-sharing-with-animations-ref.html
== continuation-opacity.html continuation-opacity-ref.html
== ib-split-sibling-opacity.html about:blank
+
+== opacity-animation-in-fixed-opacity-parent.html opacity-animation-in-fixed-opacity-parent-ref.html
