Skip to main content

Testing Modules with BrowserAnimationsModule

By default, Angular recommends replacing BrowserAnimationsModule with NoopAnimationsModule in unit tests.

In order to do so globally, you can use ngMocks.globalReplace:

src/test.ts
ngMocks.globalReplace(BrowserAnimationsModule, NoopAnimationsModule);

Now, every time ng-mocks sees BrowserAnimationsModule, it will substitute it with NoopAnimationsModule.

MockBuilder​

Please check how MockBuilder behaves in this case: 

// BrowserAnimationsModule is replaced by NoopAnimationsModule.
MockBuilder(MyComponent, MyModule);

// BrowserAnimationsModule will be kept as it is.
MockBuilder(MyComponent, MyModule).keep(BrowserAnimationsModule);

// BrowserAnimationsModule will be mocked, not replaced.
MockBuilder(MyComponent, MyModule).mock(BrowserAnimationsModule);

// BrowserAnimationsModule will be excluded from declarations.
MockBuilder(MyComponent, MyModule).exclude(BrowserAnimationsModule);

ngMocks.guts​

Please check how ngMocks.guts behaves in this case:

// BrowserAnimationsModule is replaced by NoopAnimationsModule.
ngMocks.guts(MyComponent, MyModule);

// BrowserAnimationsModule will be kept as it is.
ngMocks.guts([MyComponent, BrowserAnimationsModule], MyModule);

// BrowserAnimationsModule will be mocked, not replaced.
ngMocks.guts([MyComponent, MyModule], BrowserAnimationsModule);

// BrowserAnimationsModule will be excluded from declarations.
ngMocks.guts(MyComponent, MyModule, BrowserAnimationsModule);

fakeAsync​

A kept / mock BrowserAnimationsModule causes issues with fakeAsync. Please open an issue on github, if you have a case where NoopAnimationsModule isn't a solution.