Safari ignores angular animations timing function

Question

I'm trying to build a animation with angular animations, but if I choose a custom cubic-bezier timing function, it sometimes gets ignored in safari.

Here is my example code of the problem: https://stackblitz.com/edit/angular-ivy-qyj9rv

You can see what I mean here:

In Chrome:

In Safari:

I'm having this same issue :(, have anyone created an issue on the angular animations github? — Andreas Hald, Jul 10 '20 at 06:54

score 1 · Answer 1 · answered Jun 18 '20 at 18:32

1

@SlateDave my colleague and I have also found this issue while building a toast-like widget using Angular animations. We are on latest Angular 9. Animations work fine in Chrome and Firefox, but the easing in Safari is completely broken and looks terrible. I think it may be wise for us to file this as an Angular animations github issue.

answered Jun 18 '20 at 18:32

elesueur

59
3

I thought so too and created this one here a while ago: https://github.com/angular/angular/issues/37440 – David van der Sluijs Jul 14 '20 at 08:58

Safari ignores angular animations timing function

1 Answers1