Created attachment 451425 [details] matrix-transform-jump-demo using animate on svg <g> with matrix transform keyframes. It completes the animation to the wrong position - and then instantaneously jumps to the correct position.
<rdar://problem/88758676>
Created attachment 451558 [details] Slight reduced test I've reduced the test a bit to not visibly interpolate.
RenderStyle::applyTransform() gets called once at the beginning of the animation and once at the end. Logging transformOperations shows that it differs between the two calls while originTranslate is a zero point.
The first set of transformOperations doesn't match what is being provided to the animate() call.
The call to CSSPropertyAnimation::blendProperties() in KeyframeEffect::setAnimatedPropertiesInStyle() takes two identical transforms which are correct and generates an incorrect one.
This simple diff fixes the bug: diff --git a/Source/WebCore/animation/CSSPropertyAnimation.cpp b/Source/WebCore/animation/CSSPropertyAnimation.cpp index 217e768c131d..f7338e6ccc40 100644 --- a/Source/WebCore/animation/CSSPropertyAnimation.cpp +++ b/Source/WebCore/animation/CSSPropertyAnimation.cpp @@ -171,6 +171,9 @@ static inline TransformOperations blendFunc(const TransformOperations& from, con return resultOperations; } + if (from == to) + return from; + if (context.client->transformFunctionListsMatch()) return to.blendByMatchingOperations(from, context); return to.blendByUsingMatrixInterpolation(from, context, is<RenderBox>(context.client->renderer()) ? downcast<RenderBox>(*context.client->renderer()).borderBoxRect().size() : LayoutSize()); But I'm not sure if this is the best fix. On the one hand, this is probably a good thing to do in general, but it also feels like this might be hiding an issue further down in the blending code where we would also yield an incorrect result with non-equal matrices.
Also, this doesn't fix the original test.