Commit 665ac4cb authored by L. David Baron's avatar L. David Baron Committed by moz-wptsync-bot
Browse files

Bug 1762656 [wpt PR 33475] - Use separate transform tree nodes for... 

Bug 1762656 [wpt PR 33475] - Use separate transform tree nodes for translate/rotate/scale/offset/transform., a=testonly

Automatic update from web-platform-tests
Use separate transform tree nodes for translate/rotate/scale/offset/transform.

Rather than using a single node in the transform tree, use separate
nodes for the CSS 'translate', 'rotate', 'scale', 'offset-*', and
'transform' properties.

This is needed to animate these properties simultaneously on the
compositor.

It only increases the number of nodes when more than one of these
features are in use on the same element.

https://docs.google.com/document/d/18Kf6gwMX3-4D8eLBcGFn2fQpxG31vkDcq1nESFQHB9U/edit
documents a few of the design decisions that went into this change.

This makes the following minor behavior change:

 * This distinguishes will-change: scale, will-change: rotate,
   will-change: translate from the other properties (transform,
   transform-style, perspective) that are transform-related compositing
   triggers and ensure creation of transform nodes, since they now
   ensure the creation *different* transform nodes.  In other words,
   they now trigger a slightly different optimization rather than
   exactly the same one.  Likewise, will-change: offset-path and
   will-change: offset-position continue to force compositing but no
   longer have any effect on the cc transform tree.

Bug: 696374
Change-Id: I21ea753d14216d46fddcebc253b6a196525ad55e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3329127


Reviewed-by: default avatarPhilip Rogers <pdr@chromium.org>
Commit-Queue: David Baron <dbaron@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1006069}

--

wpt-commits: b0c18e11e09bf0d47d04bec1766a5d8f4c5d636a
wpt-pr: 33475
parent 79da7cba

testing/web-platform/tests/css/css-transforms/animation/rotate-animation-with-will-change-transform-001-ref.html

0 → 100644
+19 −0
Original line number Diff line number Diff line 
<!DOCTYPE html>

<title>CSS Test (Transforms): Transform and perspective with w negative</title>

<link rel="author" title="L. David Baron" href="https://dbaron.org/">

<link rel="author" title="Google" href="http://www.google.com/">



<style>



div {

  width: 100px;

  height: 100px;

  transform: rotateY(44deg);

  background: fuchsia;

  transform-origin: 100px 0;

  will-change: transform;

}



</style>



<div></div>

testing/web-platform/tests/css/css-transforms/animation/rotate-animation-with-will-change-transform-001.html

0 → 100644
+38 −0
Original line number Diff line number Diff line 
<!DOCTYPE html>

<title>CSS Test (Transforms): Transform and perspective with w negative</title>

<link rel="author" title="L. David Baron" href="https://dbaron.org/">

<link rel="author" title="Google" href="http://www.google.com/">

<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=696374">

<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">

<link rel="match" href="rotate-animation-with-will-change-transform-001-ref.html">



<!--



This is a simplified version of one case within the Blink web test

virtual/threaded-no-composited-antialiasing/animations/composited-animations-rotate-zero-degrees.html

but with will-change: transform added, so that it fails with the bug

that is introduced in the intermediate state of fixing

https://bugs.chromium.org/p/chromium/issues/detail?id=696374



-->



<style>



@keyframes a {

  from { rotate: 0 1 0 44deg; }

  to { rotate: 0 1 0 44deg; }

}



div {

  width: 100px;

  height: 100px;

  animation: a linear 10s infinite;

  /* rotate: 0 1 0 44deg; */

  background: fuchsia;

  transform-origin: 100px 0;

  will-change: transform;

}



</style>



<div></div>