Do not skip compositing update for non-animation transform changes
Properties like "will-change: transform" are direct compositing reasons
which let us skip raster when properties change. Usually, we still need
to update compositing when directly-composited transforms change because
overlap can change. An exception to this is animations which assume
worst-case overlap in |PendingLayer::VisualRectForOverlapTesting|. This
patch stops skipping the compositing update for non-animation transform
changes.
An alternative approach of assuming worst-case overlap for will-change
transform was investigated in https://crrev.com/c/3280439 but this has
two downsides: complexity and compositing memory (a good example is
composited-scroll-overlap-test.html). Before CompositeAfterPaint, we
would need to run compositing as well, so the approach in this patch
has precedent. We may want to expand the visual rect for
will-change: transform in the future, for performance parity with
animations.
Bug: 1267689
Change-Id: I9812426e9a159bdbe44476390e10fe53478f9ccc
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3282945
Reviewed-by: Xianzhu Wang <wangxianzhu@chromium.org>
Commit-Queue: Philip Rogers <pdr@chromium.org>
Cr-Commit-Position: refs/heads/main@{#941904}
diff --git a/css/css-transforms/paint-order-with-transform-change-ref.html b/css/css-transforms/paint-order-with-transform-change-ref.html
new file mode 100644
index 0000000..fcead1e
--- /dev/null
+++ b/css/css-transforms/paint-order-with-transform-change-ref.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<div style="position: absolute; top: 0; left: 0; width: 100px; height: 100px; background: green;"></div>
diff --git a/css/css-transforms/paint-order-with-transform-change.html b/css/css-transforms/paint-order-with-transform-change.html
new file mode 100644
index 0000000..c3f280d
--- /dev/null
+++ b/css/css-transforms/paint-order-with-transform-change.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<title>Changes to transform should not affect paint order</title>
+<link rel="author" title="Philip Rogers" href="mailto:pdr@chromium.org">
+<link rel="help" href="https://crbug.com/1267689">
+<link rel="match" href="paint-order-with-transform-change-ref.html">
+<style>
+ #bottom {
+ will-change: transform;
+ position: absolute;
+ top: 0;
+ left: 100px;
+ width: 100px;
+ height: 100px;
+ background: red;
+ }
+ #top {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100px;
+ height: 100px;
+ background: green;
+ }
+</style>
+<div id="bottom"></div>
+<div id="top"></div>
+<script>
+requestAnimationFrame(() => {
+ requestAnimationFrame(() => {
+ bottom.style.transform = 'translate(-100px, 0px)';
+ document.documentElement.removeAttribute('class');
+ });
+});
+</script>
