Changeset 289732 in webkit

Timestamp:

Feb 14, 2022 6:03:06 AM (5 months ago)

Author:

Martin Robinson

Message:

Animation from "scale()" to "scale() translate()" does not yield the expected result
​https://bugs.webkit.org/show_bug.cgi?id=222595
<rdar://problem/74926700>

Reviewed by Simon Fraser.

LayoutTests/imported/w3c:

• web-platform-tests/css/css-transforms/animation/list-interpolation-expected.txt: Mark tests as passing.
• web-platform-tests/css/css-transforms/animation/transform-interpolation-001-expected.txt:
• web-platform-tests/css/css-transforms/animation/transform-interpolation-003-expected.txt:

Source/WebCore:

No new tests. This is covered by existing WPT tests.

When blending two transform lists, where one list is longer than the other, extending the
shorter list with identity transform functions. This is the behavior specified in the
CSS Transforms Module Level 2 specification.

• animation/KeyframeEffect.cpp:

(WebCore::KeyframeEffect::checkForMatchingTransformFunctionLists): Instead of checking each frame
against the first keyframe, collect a list of shared transform primitives and check that each
list has the same number of compatible primitives or a prefix of compatible primitives and is
shorter.

• platform/graphics/GraphicsLayer.cpp:

(WebCore::GraphicsLayer::getSharedPrimitivesForTransformKeyframes): When the transform operation
lists have different sizes, don't always return false. Instead check that the parts that do exist
have matching primitives.

• platform/graphics/transforms/TransformOperations.cpp:

(WebCore::TransformOperations::operationsMatch const): Only check the transformations in
the shared list size.
(WebCore::TransformOperations::blendByMatchingOperations const): Properly handle when one of the
two operations is null instead of just the toOperation.

LayoutTests:

• compositing/layer-creation/multiple-keyframes-animation-overlap-expected.txt:
• compositing/layer-creation/translate-scale-animation-overlap-expected.txt:

Location:

trunk

Files:

• LayoutTests/ChangeLog (modified) (1 diff)
• LayoutTests/compositing/layer-creation/multiple-keyframes-animation-overlap-expected.txt (modified) (19 diffs)
• LayoutTests/compositing/layer-creation/translate-scale-animation-overlap-expected.txt (modified) (19 diffs)
• LayoutTests/imported/w3c/ChangeLog (modified) (1 diff)
• LayoutTests/imported/w3c/web-platform-tests/css/css-transforms/animation/list-interpolation-expected.txt (modified) (1 diff)
• LayoutTests/imported/w3c/web-platform-tests/css/css-transforms/animation/transform-interpolation-001-expected.txt (modified) (1 diff)
• LayoutTests/imported/w3c/web-platform-tests/css/css-transforms/animation/transform-interpolation-003-expected.txt (modified) (1 diff)
• LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-002-expected.txt (modified) (1 diff)
• Source/WebCore/ChangeLog (modified) (1 diff)
• Source/WebCore/animation/KeyframeEffect.cpp (modified) (1 diff)
• Source/WebCore/platform/graphics/GraphicsLayer.cpp (modified) (1 diff)
• Source/WebCore/platform/graphics/transforms/TransformOperations.cpp (modified) (2 diffs)
• Source/WebCore/platform/graphics/transforms/TransformOperations.h (modified) (1 diff)

trunk/LayoutTests/ChangeLog

@@ +1 @@
+2022-02-14  Martin Robinson  <mrobinson@webkit.org>
+
+        Animation from "scale()" to "scale() translate()" does not yield the expected result
+        https://bugs.webkit.org/show_bug.cgi?id=222595
+        <rdar://problem/74926700>
+
+        Reviewed by Simon Fraser.
+
+        * compositing/layer-creation/multiple-keyframes-animation-overlap-expected.txt:
+        * compositing/layer-creation/translate-scale-animation-overlap-expected.txt:
+
 2022-02-13  Fujii Hironori  <Hironori.Fujii@sony.com>
 

trunk/LayoutTests/compositing/layer-creation/multiple-keyframes-animation-overlap-expected.txt

@@ -6 +6 @@
       (bounds 800.00 600.00)
       (contentsOpaque 1)
-      (children 783
+      (children 800
         (GraphicsLayer
           (offsetFromRenderer width=-14 height=-14)
@@ -15 +15 @@
         )
         (GraphicsLayer
-          (position 20.00 30.00)
-          (bounds 4.00 4.00)
-          (contentsOpaque 1)
-        )
-        (GraphicsLayer
           (position 30.00 30.00)
           (bounds 4.00 4.00)
@@ -245 +240 @@
         )
         (GraphicsLayer
-          (position 20.00 40.00)
+          (position 480.00 30.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 30.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -475 +475 @@
         )
         (GraphicsLayer
-          (position 20.00 50.00)
+          (position 480.00 40.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 40.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -705 +710 @@
         )
         (GraphicsLayer
-          (position 20.00 60.00)
+          (position 480.00 50.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 50.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -935 +945 @@
         )
         (GraphicsLayer
-          (position 20.00 70.00)
+          (position 480.00 60.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 60.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -1165 +1180 @@
         )
         (GraphicsLayer
-          (position 20.00 80.00)
+          (position 480.00 70.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 70.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -1395 +1415 @@
         )
         (GraphicsLayer
-          (position 20.00 90.00)
+          (position 480.00 80.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 80.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -1625 +1650 @@
         )
         (GraphicsLayer
-          (position 20.00 100.00)
+          (position 480.00 90.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 90.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -1855 +1885 @@
         )
         (GraphicsLayer
-          (position 20.00 110.00)
+          (position 480.00 100.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 100.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -2085 +2120 @@
         )
         (GraphicsLayer
-          (position 20.00 120.00)
+          (position 480.00 110.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 110.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -2315 +2355 @@
         )
         (GraphicsLayer
-          (position 20.00 130.00)
+          (position 480.00 120.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 120.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -2545 +2590 @@
         )
         (GraphicsLayer
-          (position 20.00 140.00)
+          (position 480.00 130.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 130.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -2775 +2825 @@
         )
         (GraphicsLayer
-          (position 20.00 150.00)
+          (position 480.00 140.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 140.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -3005 +3060 @@
         )
         (GraphicsLayer
-          (position 20.00 160.00)
+          (position 480.00 150.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 150.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -3235 +3295 @@
         )
         (GraphicsLayer
-          (position 20.00 170.00)
+          (position 480.00 160.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 160.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -3465 +3530 @@
         )
         (GraphicsLayer
-          (position 20.00 180.00)
+          (position 480.00 170.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 170.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -3695 +3765 @@
         )
         (GraphicsLayer
-          (position 20.00 190.00)
+          (position 480.00 180.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 180.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)
@@ -3921 +3996 @@
         (GraphicsLayer
           (position 470.00 190.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 480.00 190.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 490.00 190.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)

trunk/LayoutTests/compositing/layer-creation/translate-scale-animation-overlap-expected.txt

@@ -6 +6 @@
       (bounds 800.00 600.00)
       (contentsOpaque 1)
-      (children 685
+      (children 739
         (GraphicsLayer
           (offsetFromRenderer width=-14 height=-14)
@@ -205 +205 @@
         )
         (GraphicsLayer
+          (position 420.00 30.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 30.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 30.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 40.00)
           (bounds 4.00 4.00)
@@ -395 +410 @@
         )
         (GraphicsLayer
+          (position 420.00 40.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 40.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 40.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 50.00)
           (bounds 4.00 4.00)
@@ -585 +615 @@
         )
         (GraphicsLayer
+          (position 420.00 50.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 50.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 50.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 60.00)
           (bounds 4.00 4.00)
@@ -775 +820 @@
         )
         (GraphicsLayer
+          (position 420.00 60.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 60.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 60.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 70.00)
           (bounds 4.00 4.00)
@@ -965 +1025 @@
         )
         (GraphicsLayer
+          (position 420.00 70.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 70.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 70.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 80.00)
           (bounds 4.00 4.00)
@@ -1155 +1230 @@
         )
         (GraphicsLayer
+          (position 420.00 80.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 80.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 80.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 90.00)
           (bounds 4.00 4.00)
@@ -1345 +1435 @@
         )
         (GraphicsLayer
+          (position 420.00 90.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 90.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 90.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 100.00)
           (bounds 4.00 4.00)
@@ -1535 +1640 @@
         )
         (GraphicsLayer
+          (position 420.00 100.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 100.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 100.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 110.00)
           (bounds 4.00 4.00)
@@ -1725 +1845 @@
         )
         (GraphicsLayer
+          (position 420.00 110.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 110.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 110.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 120.00)
           (bounds 4.00 4.00)
@@ -1915 +2050 @@
         )
         (GraphicsLayer
+          (position 420.00 120.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 120.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 120.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 130.00)
           (bounds 4.00 4.00)
@@ -2105 +2255 @@
         )
         (GraphicsLayer
+          (position 420.00 130.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 130.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 130.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 140.00)
           (bounds 4.00 4.00)
@@ -2295 +2460 @@
         )
         (GraphicsLayer
+          (position 420.00 140.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 140.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 140.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 150.00)
           (bounds 4.00 4.00)
@@ -2485 +2665 @@
         )
         (GraphicsLayer
+          (position 420.00 150.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 150.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 150.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 160.00)
           (bounds 4.00 4.00)
@@ -2675 +2870 @@
         )
         (GraphicsLayer
+          (position 420.00 160.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 160.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 160.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 170.00)
           (bounds 4.00 4.00)
@@ -2865 +3075 @@
         )
         (GraphicsLayer
+          (position 420.00 170.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 170.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 170.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 180.00)
           (bounds 4.00 4.00)
@@ -3055 +3280 @@
         )
         (GraphicsLayer
+          (position 420.00 180.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 180.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 180.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 190.00)
           (bounds 4.00 4.00)
@@ -3245 +3485 @@
         )
         (GraphicsLayer
+          (position 420.00 190.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 190.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 190.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
           (position 40.00 200.00)
           (bounds 4.00 4.00)
@@ -3431 +3686 @@
         (GraphicsLayer
           (position 410.00 200.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 420.00 200.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 430.00 200.00)
+          (bounds 4.00 4.00)
+          (contentsOpaque 1)
+        )
+        (GraphicsLayer
+          (position 440.00 200.00)
           (bounds 4.00 4.00)
           (contentsOpaque 1)

trunk/LayoutTests/imported/w3c/ChangeLog

@@ +1 @@
+2022-02-14  Martin Robinson  <mrobinson@webkit.org>
+
+        Animation from "scale()" to "scale() translate()" does not yield the expected result
+        https://bugs.webkit.org/show_bug.cgi?id=222595
+        <rdar://problem/74926700>
+
+        Reviewed by Simon Fraser.
+
+        * web-platform-tests/css/css-transforms/animation/list-interpolation-expected.txt: Mark tests as passing.
+        * web-platform-tests/css/css-transforms/animation/transform-interpolation-001-expected.txt:
+        * web-platform-tests/css/css-transforms/animation/transform-interpolation-003-expected.txt:
+
 2022-02-13  Matt Woodrow  <mattwoodrow@apple.com>
 

trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-transforms/animation/list-interpolation-expected.txt

@@ -12 +12 @@
 PASS CSS Animations: property <transform> from [translate(200px) rotate(720deg)] to [none] at (0.25) should be [translate(150px) rotate(540deg)]
 PASS Web Animations: property <transform> from [translate(200px) rotate(720deg)] to [none] at (0.25) should be [translate(150px) rotate(540deg)]
-FAIL CSS Transitions: property <transform> from [translate(100px)] to [translate(200px) rotate(720deg)] at (0.25) should be [translate(125px) rotate(180deg)] assert_equals: expected "matrix ( - 1 , 0 , 0 , - 1 , 125 , 0 ) " but got "matrix ( 1 , 0 , 0 , 1 , 125 , 0 ) "
-FAIL CSS Transitions with transition: all: property <transform> from [translate(100px)] to [translate(200px) rotate(720deg)] at (0.25) should be [translate(125px) rotate(180deg)] assert_equals: expected "matrix ( - 1 , 0 , 0 , - 1 , 125 , 0 ) " but got "matrix ( 1 , 0 , 0 , 1 , 125 , 0 ) "
-FAIL CSS Animations: property <transform> from [translate(100px)] to [translate(200px) rotate(720deg)] at (0.25) should be [translate(125px) rotate(180deg)] assert_equals: expected "matrix ( - 1 , 0 , 0 , - 1 , 125 , 0 ) " but got "matrix ( 1 , 0 , 0 , 1 , 125 , 0 ) "
-FAIL Web Animations: property <transform> from [translate(100px)] to [translate(200px) rotate(720deg)] at (0.25) should be [translate(125px) rotate(180deg)] assert_equals: expected "matrix ( - 1 , 0 , 0 , - 1 , 125 , 0 ) " but got "matrix ( 1 , 0 , 0 , 1 , 125 , 0 ) "
-FAIL CSS Transitions: property <transform> from [translate(100px) rotate(720deg)] to [translate(200px)] at (0.25) should be [translate(125px) rotate(540deg)] assert_equals: expected "matrix ( - 1 , 0 , 0 , - 1 , 125 , 0 ) " but got "matrix ( 1 , 0 , 0 , 1 , 125 , 0 ) "
-FAIL CSS Transitions with transition: all: property <transform> from [translate(100px) rotate(720deg)] to [translate(200px)] at (0.25) should be [translate(125px) rotate(540deg)] assert_equals: expected "matrix ( - 1 , 0 , 0 , - 1 , 125 , 0 ) " but got "matrix ( 1 , 0 , 0 , 1 , 125 , 0 ) "
-FAIL CSS Animations: property <transform> from [translate(100px) rotate(720deg)] to [translate(200px)] at (0.25) should be [translate(125px) rotate(540deg)] assert_equals: expected "matrix ( - 1 , 0 , 0 , - 1 , 125 , 0 ) " but got "matrix ( 1 , 0 , 0 , 1 , 125 , 0 ) "
-FAIL Web Animations: property <transform> from [translate(100px) rotate(720deg)] to [translate(200px)] at (0.25) should be [translate(125px) rotate(540deg)] assert_equals: expected "matrix ( - 1 , 0 , 0 , - 1 , 125 , 0 ) " but got "matrix ( 1 , 0 , 0 , 1 , 125 , 0 ) "
+PASS CSS Transitions: property <transform> from [translate(100px)] to [translate(200px) rotate(720deg)] at (0.25) should be [translate(125px) rotate(180deg)]
+PASS CSS Transitions with transition: all: property <transform> from [translate(100px)] to [translate(200px) rotate(720deg)] at (0.25) should be [translate(125px) rotate(180deg)]
+PASS CSS Animations: property <transform> from [translate(100px)] to [translate(200px) rotate(720deg)] at (0.25) should be [translate(125px) rotate(180deg)]
+PASS Web Animations: property <transform> from [translate(100px)] to [translate(200px) rotate(720deg)] at (0.25) should be [translate(125px) rotate(180deg)]
+PASS CSS Transitions: property <transform> from [translate(100px) rotate(720deg)] to [translate(200px)] at (0.25) should be [translate(125px) rotate(540deg)]
+PASS CSS Transitions with transition: all: property <transform> from [translate(100px) rotate(720deg)] to [translate(200px)] at (0.25) should be [translate(125px) rotate(540deg)]
+PASS CSS Animations: property <transform> from [translate(100px) rotate(720deg)] to [translate(200px)] at (0.25) should be [translate(125px) rotate(540deg)]
+PASS Web Animations: property <transform> from [translate(100px) rotate(720deg)] to [translate(200px)] at (0.25) should be [translate(125px) rotate(540deg)]
 PASS CSS Transitions: property <transform> from [scale(2) rotate(360deg) translate(100px) matrix(1, 0, 0, 1, 100, 0) skew(0deg)] to [scale(3) rotate(1080deg) translate(200px) matrix(1, 0, 0, 1, 0, 200) skew(720deg)] at (0.25) should be [scale(2.25) rotate(540deg) translate(125px) matrix(1, 0, 0, 1, 75, 50) skew(180deg)]
 PASS CSS Transitions with transition: all: property <transform> from [scale(2) rotate(360deg) translate(100px) matrix(1, 0, 0, 1, 100, 0) skew(0deg)] to [scale(3) rotate(1080deg) translate(200px) matrix(1, 0, 0, 1, 0, 200) skew(720deg)] at (0.25) should be [scale(2.25) rotate(540deg) translate(125px) matrix(1, 0, 0, 1, 75, 50) skew(180deg)]

trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-transforms/animation/transform-interpolation-001-expected.txt

@@ -72 +72 @@
 PASS Web Animations: property <transform> from [scaleZ(1) perspective(400px)] to [scaleZ(2) perspective(500px)] at (1) should be [scaleZ(2) perspective(500px)]
 PASS Web Animations: property <transform> from [scaleZ(1) perspective(400px)] to [scaleZ(2) perspective(500px)] at (2) should be [scaleZ(3) perspective(666.6666666666666px)]
-FAIL CSS Transitions: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (-1) should be [scaleZ(2)] assert_less_than: comparing (at index 11 actual value "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0.002, 0, 0, 0, 1)" [0.002] and expected value "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1)" [0] expected a number less than 0.00001 but got 2000.0000000000002
+PASS CSS Transitions: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (-1) should be [scaleZ(2)]
 PASS CSS Transitions: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (0) should be [scaleZ(2)]
 PASS CSS Transitions: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (0.5) should be [scaleZ(2) perspective(1000px)]
 PASS CSS Transitions: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (1) should be [scaleZ(2) perspective(500px)]
 PASS CSS Transitions: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (2) should be [scaleZ(2) perspective(250px)]
-FAIL CSS Transitions with transition: all: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (-1) should be [scaleZ(2)] assert_less_than: comparing (at index 11 actual value "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0.002, 0, 0, 0, 1)" [0.002] and expected value "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1)" [0] expected a number less than 0.00001 but got 2000.0000000000002
+PASS CSS Transitions with transition: all: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (-1) should be [scaleZ(2)]
 PASS CSS Transitions with transition: all: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (0) should be [scaleZ(2)]
 PASS CSS Transitions with transition: all: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (0.5) should be [scaleZ(2) perspective(1000px)]
 PASS CSS Transitions with transition: all: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (1) should be [scaleZ(2) perspective(500px)]
 PASS CSS Transitions with transition: all: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (2) should be [scaleZ(2) perspective(250px)]
-FAIL CSS Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (-1) should be [scaleZ(2)] assert_less_than: comparing (at index 11 actual value "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0.002, 0, 0, 0, 1)" [0.002] and expected value "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1)" [0] expected a number less than 0.00001 but got 2000.0000000000002
+PASS CSS Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (-1) should be [scaleZ(2)]
 PASS CSS Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (0) should be [scaleZ(2)]
 PASS CSS Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (0.5) should be [scaleZ(2) perspective(1000px)]
 PASS CSS Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (1) should be [scaleZ(2) perspective(500px)]
 PASS CSS Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (2) should be [scaleZ(2) perspective(250px)]
-FAIL Web Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (-1) should be [scaleZ(2)] assert_less_than: comparing (at index 11 actual value "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0.002, 0, 0, 0, 1)" [0.002] and expected value "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1)" [0] expected a number less than 0.00001 but got 2000.0000000000002
+PASS Web Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (-1) should be [scaleZ(2)]
 PASS Web Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (0) should be [scaleZ(2)]
 PASS Web Animations: property <transform> from [scaleZ(2)] to [scaleZ(2) perspective(500px)] at (0.5) should be [scaleZ(2) perspective(1000px)]

trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-transforms/animation/transform-interpolation-003-expected.txt

@@ -24 +24 @@
 PASS Web Animations: property <transform> from [skewX(10rad) scaleZ(1)] to [skewX(20rad) scaleZ(2)] at (1) should be [skewX(20rad) scaleZ(2)]
 PASS Web Animations: property <transform> from [skewX(10rad) scaleZ(1)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)]
-FAIL CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (-1) should be [skewX(0rad) scaleZ(0)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , 0 , 1 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , - 0.94 , 1 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 1 ) "
+PASS CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (-1) should be [skewX(0rad) scaleZ(0)]
 PASS CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0) should be [skewX(10rad) scaleZ(1)]
-FAIL CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.25) should be [skewX(12.5rad) scaleZ(1.25)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 0.07 , 1 , 0 , 0 , 0 , 0 , 1.25 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 1.05 , 1 , 0 , 0 , 0 , 0 , 1.25 , 0 , 0 , 0 , 0 , 1 ) "
-FAIL CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.75) should be [skewX(17.5rad) scaleZ(1.75)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 4.45 , 1 , 0 , 0 , 0 , 0 , 1.75 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 1.84 , 1 , 0 , 0 , 0 , 0 , 1.75 , 0 , 0 , 0 , 0 , 1 ) "
+PASS CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.25) should be [skewX(12.5rad) scaleZ(1.25)]
+PASS CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.75) should be [skewX(17.5rad) scaleZ(1.75)]
 PASS CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (1) should be [skewX(20rad) scaleZ(2)]
-FAIL CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 6.41 , 1 , 0 , 0 , 0 , 0 , 3 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 3.83 , 1 , 0 , 0 , 0 , 0 , 3 , 0 , 0 , 0 , 0 , 1 ) "
-FAIL CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (-1) should be [skewX(0rad) scaleZ(0)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , 0 , 1 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , - 0.94 , 1 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 1 ) "
+PASS CSS Transitions: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)]
+PASS CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (-1) should be [skewX(0rad) scaleZ(0)]
 PASS CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0) should be [skewX(10rad) scaleZ(1)]
-FAIL CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.25) should be [skewX(12.5rad) scaleZ(1.25)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 0.07 , 1 , 0 , 0 , 0 , 0 , 1.25 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 1.05 , 1 , 0 , 0 , 0 , 0 , 1.25 , 0 , 0 , 0 , 0 , 1 ) "
-FAIL CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.75) should be [skewX(17.5rad) scaleZ(1.75)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 4.45 , 1 , 0 , 0 , 0 , 0 , 1.75 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 1.84 , 1 , 0 , 0 , 0 , 0 , 1.75 , 0 , 0 , 0 , 0 , 1 ) "
+PASS CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.25) should be [skewX(12.5rad) scaleZ(1.25)]
+PASS CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.75) should be [skewX(17.5rad) scaleZ(1.75)]
 PASS CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (1) should be [skewX(20rad) scaleZ(2)]
-FAIL CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 6.41 , 1 , 0 , 0 , 0 , 0 , 3 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 3.83 , 1 , 0 , 0 , 0 , 0 , 3 , 0 , 0 , 0 , 0 , 1 ) "
-FAIL CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (-1) should be [skewX(0rad) scaleZ(0)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , 0 , 1 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , - 0.94 , 1 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 1 ) "
+PASS CSS Transitions with transition: all: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)]
+PASS CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (-1) should be [skewX(0rad) scaleZ(0)]
 PASS CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0) should be [skewX(10rad) scaleZ(1)]
-FAIL CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.25) should be [skewX(12.5rad) scaleZ(1.25)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 0.07 , 1 , 0 , 0 , 0 , 0 , 1.25 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 1.05 , 1 , 0 , 0 , 0 , 0 , 1.25 , 0 , 0 , 0 , 0 , 1 ) "
-FAIL CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.75) should be [skewX(17.5rad) scaleZ(1.75)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 4.45 , 1 , 0 , 0 , 0 , 0 , 1.75 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 1.84 , 1 , 0 , 0 , 0 , 0 , 1.75 , 0 , 0 , 0 , 0 , 1 ) "
+PASS CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.25) should be [skewX(12.5rad) scaleZ(1.25)]
+PASS CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.75) should be [skewX(17.5rad) scaleZ(1.75)]
 PASS CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (1) should be [skewX(20rad) scaleZ(2)]
-FAIL CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 6.41 , 1 , 0 , 0 , 0 , 0 , 3 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 3.83 , 1 , 0 , 0 , 0 , 0 , 3 , 0 , 0 , 0 , 0 , 1 ) "
-FAIL Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (-1) should be [skewX(0rad) scaleZ(0)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , 0 , 1 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , - 0.94 , 1 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 , 1 ) "
+PASS CSS Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)]
+PASS Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (-1) should be [skewX(0rad) scaleZ(0)]
 PASS Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0) should be [skewX(10rad) scaleZ(1)]
-FAIL Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.25) should be [skewX(12.5rad) scaleZ(1.25)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 0.07 , 1 , 0 , 0 , 0 , 0 , 1.25 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 1.05 , 1 , 0 , 0 , 0 , 0 , 1.25 , 0 , 0 , 0 , 0 , 1 ) "
-FAIL Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.75) should be [skewX(17.5rad) scaleZ(1.75)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 4.45 , 1 , 0 , 0 , 0 , 0 , 1.75 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 1.84 , 1 , 0 , 0 , 0 , 0 , 1.75 , 0 , 0 , 0 , 0 , 1 ) "
+PASS Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.25) should be [skewX(12.5rad) scaleZ(1.25)]
+PASS Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (0.75) should be [skewX(17.5rad) scaleZ(1.75)]
 PASS Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (1) should be [skewX(20rad) scaleZ(2)]
-FAIL Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)] assert_equals: expected "matrix3d ( 1 , 0 , 0 , 0 , - 6.41 , 1 , 0 , 0 , 0 , 0 , 3 , 0 , 0 , 0 , 0 , 1 ) " but got "matrix3d ( 1 , 0 , 0 , 0 , 3.83 , 1 , 0 , 0 , 0 , 0 , 3 , 0 , 0 , 0 , 0 , 1 ) "
+PASS Web Animations: property <transform> from [skewX(10rad)] to [skewX(20rad) scaleZ(2)] at (2) should be [skewX(30rad) scaleZ(3)]
 PASS CSS Transitions: property <transform> from [scaleZ(3) perspective(400px)] to [scaleZ(4) skewX(1rad) perspective(500px)] at (-1) should be [scaleZ(2) matrix3d(1, 0, 0, 0, -1.55741, 1, 0, 0, 0, 0, 1, -0.003, 0, 0, 0, 1)]
 PASS CSS Transitions: property <transform> from [scaleZ(3) perspective(400px)] to [scaleZ(4) skewX(1rad) perspective(500px)] at (0) should be [scaleZ(3) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.0025, 0, 0, 0, 1)]

trunk/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-002-expected.txt

@@ -217 +217 @@
 PASS transform: rotate and translate
 PASS transform: translate and rotate
-FAIL transform: extend shorter list (from) assert_approx_equals: expected matrix(-1, 0, 0, -1, -50, 0) but got matrix(1, 0, 0, 1, 50, 0): The value should be matrix(-1, 0, 0, -1, -50, 0) at 500ms but got matrix(1, 0, 0, 1, 50, 0) expected -1 +/- 0.0001 but got 1
-FAIL transform: extend shorter list (to) assert_approx_equals: expected matrix(-1, 0, 0, -1, -50, 0) but got matrix(1, 0, 0, 1, 50, 0): The value should be matrix(-1, 0, 0, -1, -50, 0) at 500ms but got matrix(1, 0, 0, 1, 50, 0) expected -1 +/- 0.0001 but got 1
+PASS transform: extend shorter list (from)
+PASS transform: extend shorter list (to)
 PASS transform: mismatch order of translate and rotate
 PASS transform: matrix

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2022-02-14  Martin Robinson  <mrobinson@webkit.org>
+
+        Animation from "scale()" to "scale() translate()" does not yield the expected result
+        https://bugs.webkit.org/show_bug.cgi?id=222595
+        <rdar://problem/74926700>
+
+        Reviewed by Simon Fraser.
+
+        No new tests. This is covered by existing WPT tests.
+
+        When blending two transform lists, where one list is longer than the other, extending the
+        shorter list with identity transform functions. This is the behavior specified in the
+        CSS Transforms Module Level 2 specification.
+
+        * animation/KeyframeEffect.cpp:
+        (WebCore::KeyframeEffect::checkForMatchingTransformFunctionLists): Instead of checking each frame
+        against the first keyframe, collect a list of shared transform primitives and check that each
+        list has the same number of compatible primitives or a prefix of compatible primitives and is
+        shorter.
+        * platform/graphics/GraphicsLayer.cpp:
+        (WebCore::GraphicsLayer::getSharedPrimitivesForTransformKeyframes): When the transform operation
+        lists have different sizes, don't always return false. Instead check that the parts that do exist
+        have matching primitives.
+        * platform/graphics/transforms/TransformOperations.cpp:
+        (WebCore::TransformOperations::operationsMatch const):  Only check the transformations in
+        the shared list size.
+        (WebCore::TransformOperations::blendByMatchingOperations const): Properly handle when one of the
+        two operations is null instead of just the toOperation.
+
 2022-02-14  Alejandro G. Castro  <alex@igalia.com>
 

trunk/Source/WebCore/animation/KeyframeEffect.cpp

@@ -939 +939 @@
         return;
 
-    // Empty transforms match anything, so find the first non-empty entry as the reference.
-    size_t numKeyframes = m_blendingKeyframes.size();
-    size_t firstNonEmptyTransformKeyframeIndex = numKeyframes;
-
-    for (size_t i = 0; i < numKeyframes; ++i) {
-        const KeyframeValue& currentKeyframe = m_blendingKeyframes[i];
-        if (currentKeyframe.style()->transform().operations().size()) {
-            firstNonEmptyTransformKeyframeIndex = i;
-            break;
-        }
-    }
-
-    // All of the frames have an empty list of transform operations, so they match.
-    if (firstNonEmptyTransformKeyframeIndex == numKeyframes) {
-        m_transformFunctionListsMatch = true;
-        return;
-    }
-
-    const TransformOperations* firstVal = &m_blendingKeyframes[firstNonEmptyTransformKeyframeIndex].style()->transform();
-    for (size_t i = firstNonEmptyTransformKeyframeIndex + 1; i < numKeyframes; ++i) {
-        const KeyframeValue& currentKeyframe = m_blendingKeyframes[i];
-        const TransformOperations* val = &currentKeyframe.style()->transform();
-
-        // An empty transform list matches anything.
-        if (val->operations().isEmpty())
-            continue;
-
-        if (!firstVal->operationsMatch(*val))
+    Vector<TransformOperation::OperationType> sharedPrimitives;
+    sharedPrimitives.reserveInitialCapacity(m_blendingKeyframes[0].style()->transform().operations().size());
+
+    for (const auto& keyframe : m_blendingKeyframes) {
+        if (!keyframe.style()->transform().updateSharedPrimitives(sharedPrimitives))
             return;
     }

trunk/Source/WebCore/platform/graphics/GraphicsLayer.cpp

@@ -734 +734 @@
     sharedPrimitives.reserveInitialCapacity(operationsAt(valueList, 0).size());
 
-    // Find a list of transform primitives for the given TransformOperations which are compatible with the primitives
-    // stored in sharedPrimitives. The results are written back into sharedPrimitives. This returns false if any element
-    // of TransformOperation does not have a shared primitive, otherwise it returns true.
-    auto updateSharedPrimitives = [&](const TransformOperations& operations) {
-        // Empty transform lists are implicitly a list of identity transforms.
-        if (!operations.size())
-            return true;
-
-        // If we have seen a non-empty list already and this list's size doesn't match, then we can't use shared
-        // primitives. FIXME: This should handle prefix matches and then fall back to matrix interpolation for the rest
-        // of the list.
-        // See: https://bugs.webkit.org/show_bug.cgi?id=235757
-        if (sharedPrimitives.size() && sharedPrimitives.size() != operations.size())
-            return false;
-
-        for (size_t i = 0; i < operations.size(); ++i) {
-            const auto* operation = operations.at(i);
-
-            // If we haven't seen an operation at this index before, we can simply use our primitive type.
-            if (i >= sharedPrimitives.size()) {
-                ASSERT(i == sharedPrimitives.size());
-                sharedPrimitives.append(operation->primitiveType());
-                continue;
-            }
-
-            if (auto sharedPrimitive = operation->sharedPrimitiveType(sharedPrimitives[i]))
-                sharedPrimitives[i] = *sharedPrimitive;
-            else
-                return false;
-        }
-
-        return true;
-    };
-
     for (size_t i = 0; i < valueList.size(); ++i) {
-        const TransformOperations& operations = operationsAt(valueList, i);
-        if (!updateSharedPrimitives(operations))
+        if (!operationsAt(valueList, i).updateSharedPrimitives(sharedPrimitives))
             return false;
     }

trunk/Source/WebCore/platform/graphics/transforms/TransformOperations.cpp

@@ -53 +53 @@
 bool TransformOperations::operationsMatch(const TransformOperations& other) const
 {
-    size_t numOperations = operations().size();
-    // If the sizes of the function lists don't match, the lists don't match
-    if (numOperations != other.operations().size())
-        return false;
-    
-    // If the types of each function are not the same, the lists don't match
-    for (size_t i = 0; i < numOperations; ++i) {
+    // If functions at the same index don't share a blending primitive, the lists don't match.
+    // When the lists are different sizes, the missing functions in the shorter list are treated
+    // as identity functions.
+    size_t minimumLength = std::min(operations().size(), other.operations().size());
+    for (size_t i = 0; i < minimumLength; ++i) {
         if (!operations()[i]->sharedPrimitiveType(other.operations()[i].get()))
             return false;
     }
+    return true;
+}
+
+bool TransformOperations::updateSharedPrimitives(Vector<TransformOperation::OperationType>& sharedPrimitives) const
+{
+    for (size_t i = 0; i < operations().size(); ++i) {
+        const auto* operation = at(i);
+
+        // If we haven't seen an operation at this index before, we can simply use our primitive type.
+        if (i >= sharedPrimitives.size()) {
+            ASSERT(i == sharedPrimitives.size());
+            sharedPrimitives.append(operation->primitiveType());
+            continue;
+        }
+
+        if (auto sharedPrimitive = operation->sharedPrimitiveType(sharedPrimitives[i]))
+            sharedPrimitives[i] = *sharedPrimitive;
+        else {
+            // FIXME: This should handle prefix matches and then fall back to matrix interpolation for the rest
+            // of the list. See: https://bugs.webkit.org/show_bug.cgi?id=235757
+            return false;
+        }
+    }
+
     return true;
 }
@@ -91 +113 @@
         if (fromOperation && toOperation && !fromOperation->sharedPrimitiveType(toOperation.get()))
             return blendByUsingMatrixInterpolation(from, context, boxSize);
-        RefPtr<TransformOperation> blendedOperation = toOperation ? toOperation->blend(fromOperation.get(), context) : (fromOperation ? RefPtr<TransformOperation>(fromOperation->blend(nullptr, context, true)) : nullptr);
-        if (blendedOperation)
-            result.operations().append(blendedOperation);
-        else {
-            auto identityOperation = IdentityTransformOperation::create();
-            if (context.progress > 0.5)
-                result.operations().append(toOperation ? toOperation : WTFMove(identityOperation));
-            else
-                result.operations().append(fromOperation ? fromOperation : WTFMove(identityOperation));
-        }
+
+        RefPtr<TransformOperation> blendedOperation;
+        if (fromOperation && toOperation)
+            blendedOperation = toOperation->blend(fromOperation.get(), context);
+        else if (!fromOperation)
+            blendedOperation = toOperation->blend(nullptr, 1 - context.progress, true);
+        else if (!toOperation)
+            blendedOperation = fromOperation->blend(nullptr, context, true);
+
+        // We should have exited early above if the fromOperation and toOperation didn't share a transform
+        // function primitive, so blending the two operations should always yield a result.
+        ASSERT(blendedOperation);
+        result.operations().append(blendedOperation);
     }
 

trunk/Source/WebCore/platform/graphics/transforms/TransformOperations.h

@@ -72 +72 @@
 
     bool operationsMatch(const TransformOperations&) const;
+
+    // Find a list of transform primitives for the given TransformOperations which are compatible with the primitives
+    // stored in sharedPrimitives. The results are written back into sharedPrimitives. This returns false if any element
+    // of TransformOperation does not have a shared primitive, otherwise it returns true.
+    bool updateSharedPrimitives(Vector<TransformOperation::OperationType>& sharedPrimitives) const;
     
     void clear()