Created attachment 364765 [details] testcase Steps to reproduce: 1. open the attached testcase 2. click the "toggle" button and observe 3. click it again Actual result: The rectangle animates when it shows and hides. Expected result: The rectangle should just show and hide without any animation. Explanation: Here I use `transform: matrix(0, 0, 0, 0, 0, 0)` to hide the rectangle. This is a matrix which cannot be decomposed. Based on the spec, this value should not be interpolated with other values. It works as expected on Firefox and Chrome.
<rdar://problem/48955191>
I am able to reproduce this bug in Safari 16.1 and Safari Technology Preview 156 where the toggling back leads to animations while Chrome Canary 109 and Firefox Nightly 108 does not animate. I know there are fixes around transform matrix in Webkit ToT but since they are not in STP, I cannot verify whether those fixes would result in fixing this or not. Thanks!
This persists on ToT as well.
The relevant spec text here is at the end of https://w3c.github.io/csswg-drafts/css-transforms-1/#matrix-interpolation: "If one of the matrices for interpolation is non-invertible, the used animation function must fall-back to a discrete animation according to the rules of the respective animation specification."
We seem to have the necessary logic to handle this in TransformOperations::shouldFallBackToDiscreteAnimation() and TransformOperations::blend(), but I wonder if we're running animations with acceleration here and thus not going through this code path.