Description
Which @angular/* package(s) are the source of the bug?
Don't known / other
Is this a regression?
Yes
Description
The gist:
When in dev environment (ng serve or ng build --configuration=development) the animations (@Keyframes) work fine. When the project is built in production mode, some animations are missing.
How to reproduce:
Clone and run in different configurations igokul1973/blog.didgibot.com@e478057. You will see the header animation in both cases but in production mode the subheader line 'blog about making the blog' will be hidden because the animation responsible for changing opacity to 1 is missing.
What I tried:
Changing optimization to 'false' in production mode helps, changing to encapsulation: ViewEncapsulation.None works too, but both are suboptimal and should not be used.
Similar issues:
I read the closed issue - #53038 - and it is very similar as far as the issue description is concerned. In my case, however, while experimenting I even moved all @Keyframes styling to the same component stylesheet (which is recommended on the issue 53038 but in my case adds to redundancy and is also suboptimal), but it did not help.
Another similar issue - #60878.
Environment:
I use Angular 19, Angular Material 19, etc. Please let me know if you have any questions.
For now I will resort to setting encapsulation to None.
Please provide a link to a minimal reproduction of the bug
igokul1973/blog.didgibot.com@e478057
Please provide the exception or error you saw
No errors
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 19.2.10
Node: 22.4.1
Package Manager: yarn 1.22.22
OS: darwin arm64
Angular: 19.2.9
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1902.10
@angular-devkit/build-angular 19.2.10
@angular-devkit/core 19.2.10
@angular-devkit/schematics 19.2.10
@angular/cdk 19.2.14
@angular/cli 19.2.10
@angular/material 19.2.14
@schematics/angular 19.2.10
rxjs 7.8.2
typescript 5.8.3
zone.js 0.15.0
Anything else?
