angular-animations icon indicating copy to clipboard operation
angular-animations copied to clipboard

Published 20 hours ago • verified publisher icon filipows

iOS 15 - The provided animation property "backface-visibility" is not a supported CSS property for animations

Open madmacc opened this issue 3 years ago • 4 comments

Upgrading to iOS 15 causes this error and breaks my app. Works fine in iOS 14 and below. Also seems to work ok in desktop safari for big Sur.

iOS 15 using an Ionic / Angular app.

⚡️ [error] - ERROR Error: Uncaught (in promise): Error: The animation trigger "flipOnEnter" has failed to build due to the following errors:

  • The provided animation property "backface-visibility" is not a supported CSS property for animations

May be related to: https://stackoverflow.com/questions/42744573/backface-visibility-not-working-in-safari

madmacc avatar Oct 04 '21 23:10 madmacc

Same here. Doesn't work on IOS 15. App is completely broken. Applicable for certain animations only such as flipOn...

ahimik avatar Oct 05 '21 13:10 ahimik

Same problem for me. Please provide a fix for it, thank you.

brune83 avatar Oct 07 '21 07:10 brune83

Same here, simply open the demo using safari of iOS 15 and the whole site is broken (I use flip)

animate.css works fine, its only here? Any work around?

Et3rnal avatar Dec 09 '21 05:12 Et3rnal

Adding the prefix -webkit- seems to solve the issue! so make it -webkit-backface-visibility The previous version of safari seems to be fine with that as well (tried 12.4), not sure if there is a way to add both into the library? https://github.com/filipows/angular-animations/blob/master/lib/flippers/flip.animation.ts Do you want a PR?

Et3rnal avatar Dec 09 '21 05:12 Et3rnal