Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[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 join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug Bug report
Projects
None yet
Development

No branches or pull requests

1 participant