Invalidate when PendingLayer effect node changes.
This is needed because, when the result of DecompositeEffect changes, it
can change the effect node on the PendingLayer without changing the
effect node on any of the paint chunks.
Both added tests fail reliably without this change and pass with it.
Fixed: 1330438
Change-Id: I1fd5a92dbf582d888dac04751c915c1049f7e659
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3692324
Reviewed-by: Philip Rogers <pdr@chromium.org>
Commit-Queue: David Baron <dbaron@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1012030}
diff --git a/css/css-color/animation/opacity-animation-ending-correctly-001-ref.html b/css/css-color/animation/opacity-animation-ending-correctly-001-ref.html
new file mode 100644
index 0000000..ca55dc6
--- /dev/null
+++ b/css/css-color/animation/opacity-animation-ending-correctly-001-ref.html
@@ -0,0 +1,24 @@
+<!DOCTYPE HTML>
+<html>
+<title>CSS Test Reference (Color): ending of opacity animation</title>
+<link rel="author" title="L. David Baron" href="https://dbaron.org/">
+<link rel="author" title="Google" href="https://www.google.com/">
+
+<style>
+#test {
+ position: sticky;
+ top: 0;
+ height: 50px;
+ background: blue;
+ opacity: 0.2;
+}
+
+.tall {
+ height: 5000px;
+}
+</style>
+
+<div id="test">
+</div>
+<div class="tall">
+</div>
diff --git a/css/css-color/animation/opacity-animation-ending-correctly-001.html b/css/css-color/animation/opacity-animation-ending-correctly-001.html
new file mode 100644
index 0000000..1fb36cd
--- /dev/null
+++ b/css/css-color/animation/opacity-animation-ending-correctly-001.html
@@ -0,0 +1,48 @@
+<!DOCTYPE HTML>
+<html class="reftest-wait">
+<title>CSS Test (Color): ending of opacity animation</title>
+<link rel="author" title="L. David Baron" href="https://dbaron.org/">
+<link rel="author" title="Google" href="https://www.google.com/">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1330438">
+<link rel="help" href="https://www.w3.org/TR/css-color-3/#transparency">
+<link rel="match" href="opacity-animation-ending-correctly-001-ref.html">
+
+<style>
+#test {
+ position: sticky;
+ top: 0;
+ height: 50px;
+ background: blue;
+ transition: opacity 50ms step-start;
+}
+
+#test.fade {
+ opacity: 0.2;
+}
+
+.tall {
+ height: 5000px;
+}
+</style>
+
+<div id="test">
+</div>
+<div class="tall">
+</div>
+
+<script>
+function flushStyleLayoutAndPrePaint() {
+ document.elementFromPoint(10, 10);
+}
+
+document.getElementById("test").addEventListener("transitionend", function(e) {
+ document.documentElement.classList.remove("reftest-wait");
+});
+requestAnimationFrame(function() {
+ flushStyleLayoutAndPrePaint();
+ requestAnimationFrame(function() {
+ document.getElementById("test").classList.add("fade");
+ flushStyleLayoutAndPrePaint();
+ });
+});
+</script>
diff --git a/css/css-color/animation/opacity-animation-ending-correctly-002.html b/css/css-color/animation/opacity-animation-ending-correctly-002.html
new file mode 100644
index 0000000..7ba097f
--- /dev/null
+++ b/css/css-color/animation/opacity-animation-ending-correctly-002.html
@@ -0,0 +1,50 @@
+<!DOCTYPE HTML>
+<html class="reftest-wait">
+<title>CSS Test (Color): ending of opacity animation</title>
+<link rel="author" title="L. David Baron" href="https://dbaron.org/">
+<link rel="author" title="Google" href="https://www.google.com/">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1330438">
+<link rel="help" href="https://www.w3.org/TR/css-color-3/#transparency">
+<link rel="match" href="opacity-animation-ending-correctly-001-ref.html">
+
+<style>
+#test {
+ position: sticky;
+ top: 0;
+ height: 50px;
+ background: blue;
+ transform: translate(0);
+ filter: grayscale(0%);
+ transition: opacity 50ms step-start;
+}
+
+#test.fade {
+ opacity: 0.2;
+}
+
+.tall {
+ height: 5000px;
+}
+</style>
+
+<div id="test">
+</div>
+<div class="tall">
+</div>
+
+<script>
+function flushStyleLayoutAndPrePaint() {
+ document.elementFromPoint(10, 10);
+}
+
+document.getElementById("test").addEventListener("transitionend", function(e) {
+ document.documentElement.classList.remove("reftest-wait");
+});
+requestAnimationFrame(function() {
+ flushStyleLayoutAndPrePaint();
+ requestAnimationFrame(function() {
+ document.getElementById("test").classList.add("fade");
+ flushStyleLayoutAndPrePaint();
+ });
+});
+</script>
