angular: Animations not working on Firefox 53, error
I’m submitting a … (check one with “x”)
[ x ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
Current behavior
Trying to use the Angular 4 animations on Firefox returns an error. This behavior is not present on Chrome, Safari (MacOS)
Expected behavior
The same behavior that Chrome. I need that the animations works. Minimal reproduction of the problem with instructions
Please check this plnkr that i made for this: http://plnkr.co/edit/K2NxOn?p=preview
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Mac OS Sierra, Windows 10, NPM, NodeJS
- Angular version: 4.0.1
- Browser: Chrome 56 | Firefox 53
Firefox 52, 53
- Language: [all | TypeScript X.X | ES6/7 | ES5] all
- Node (for AoT issues):
node --version
=
6
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Reactions: 10
- Comments: 15 (6 by maintainers)
It looks like the animation code in Angular needs to break up
margin
andpadding
intomarginTop, marginLeft, marginRight, marginBottom
andpaddingLeft, paddingRight, paddingTop, paddingBottom
.Problem still exists with:
FF: 64.0 (64-bit) @angular/animations: 7.2.0
I fixed it as suggested by explicitly declaring all my paddings (paddingLeft, paddingRight, paddingTop, paddingBottom) instead of using
padding: 0
We discovered that Firefox 96 addresses this issue. So we can call this issue resolved. Thanks for reporting it!
I know it’s only been almost 4 years so I don’t want to be too pushy, but is this still on anyones TODO?
Well… then it is a bug my friend…