Skip to content
This repository has been archived by the owner on Nov 12, 2024. It is now read-only.

[Bug] On Safari, animating transform to a matrix3d with skew and translation fails #249

Open
anxpara opened this issue Mar 9, 2024 · 1 comment
Labels
Bug Bug report

Comments

@anxpara
Copy link

anxpara commented Mar 9, 2024

1. Describe the bug

When animating the transform to a matrix3d that contains a skew and a translation

e.g. transform: 'matrix3d(1, 0, 0, 0, 0.26, 1, 0, 0, 0, 0, 1, 0, 200, 100, 0, 1)'

the element animates to an incorrect destination, and then snaps to the correct destination at the end of the animation.

2. IMPORTANT: Provide a CodeSandbox reproduction of the bug

https://codepen.io/anxpara/pen/OJGMdJK

3. Steps to reproduce

Steps to reproduce the behavior:

  1. go to https://codepen.io/anxpara/pen/OJGMdJK on latest Safari (17.4)
  2. see animation fail

4. Expected behavior

should animate smoothly to the proper destination

6. Browser details

Safari 17.4

@anxpara anxpara added the Bug Bug report label Mar 9, 2024
@anxpara anxpara changed the title [Bug] On Safari, animating transform a matrix3d with skew and translation fails [Bug] On Safari, animating transform to a matrix3d with skew and translation fails Mar 9, 2024
@anxpara
Copy link
Author

anxpara commented Mar 27, 2024

I made an identical codepen but using waapi instead of motion one, and it works fine in safari.

So the bug only exists in motion one

@mattgperry

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Bug Bug report
Projects
None yet
Development

No branches or pull requests

1 participant