Upgrade to Angular 19 makes tests fail

After upgrading to Angular, my tests are failing. The project is large and modular, so standalone components should not influence the testing process.

When running ng test --watch, the tests execute until test 1096 of 2158. Then, I encounter the following error:

Chrome Headless 131.0.0.0 (Windows 10) ERROR
An error was thrown in afterAll
Error: NG05105: Unexpected synthetic property @flyInOut found. Please make sure that:
- Make sure `provideAnimationsAsync()`, `provideAnimations()` or `provideNoopAnimations()` call was added to a list of providers used to bootstrap an application.
- There is a corresponding animation configuration named `@flyInOut` defined in the `animations` field of the `@Component` decorator (see https://angular.dev/api/core/Component#animations).
error properties: Object({ code: 5105 })
at checkNoSyntheticProp (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/platform-browser/fesm2022/platform-browser.mjs:760:15)
at NoneEncapsulationDomRenderer.setProperty (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/platform-browser/fesm2022/platform-browser.mjs:713:13)
at elementPropertyInternal (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:13677:18)
at Module.ɵɵsyntheticHostProperty (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:28127:9)
at hostBindingFn (http://localhost:9876/_karma_webpack_/webpack:/node_modules/ngx-toastr/fesm2022/ngx-toastr.mjs:16:96)
at processHostBindingOpCodes (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:13085:17)
at refreshView (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:14932:9)
at detectChangesInView (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:15098:9)
at detectChangesInViewWhileDirty (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:14793:9)
at detectChangesInternal (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:14775:9)
at detectChangesInViewIfRequired (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:23652:5)
at ApplicationRef.synchronizeOnce (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:23483:17)
at ApplicationRef.synchronize (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:23450:18)
at ApplicationRef._tick (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:23420:18)
at apply (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2022/core.mjs:35125:29)
at _ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/fesm2015/zone.js:369:28)


I use @flyInOut only in one specific component, but the mentioned modules are imported correctly. The tests usually run without issue, but this error causes the test suite to stop after it occurs. Other similar warnings appear in the logs, but only this instance results in failure.

• I turned off random test order in karma.config.
• I ensured that necessary animation modules are imported in the test setup, such as BrowserAnimationsModule.

How can I identify which component or module is causing this error? Why does it stop further tests from running, while similar warnings do not?

Continue reading...