Ana içeriğe geç

Tarayıcı Animasyonu Modülü ile Test Etme

Varsayılan olarak, Angular birim testlerinde BrowserAnimationsModule yerine NoopAnimationsModule kullanmanızı önerir.

bilgi

Bunu küresel olarak yapmak için ngMocks.globalReplace kullanabilirsiniz:

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

Artık ng-mocks her BrowserAnimationsModule gördüğünde, bunu NoopAnimationsModule ile değiştirecektir.

MockBuilder

Bu durumda MockBuilder'ın nasıl davrandığına bakınız:

// BrowserAnimationsModule, NoopAnimationsModule ile değiştirilir.
MockBuilder(MyComponent, MyModule);

// BrowserAnimationsModule olduğu gibi kalacaktır.
MockBuilder(MyComponent, MyModule).keep(BrowserAnimationsModule);

// BrowserAnimationsModule taklit edilecektir, değiştirilmez.
MockBuilder(MyComponent, MyModule).mock(BrowserAnimationsModule);

// BrowserAnimationsModule tanımlamalardan hariç tutulacaktır.
MockBuilder(MyComponent, MyModule).exclude(BrowserAnimationsModule);

ngMocks.guts

Bu durumda ngMocks.guts'ın nasıl davrandığına bakınız:

// BrowserAnimationsModule, NoopAnimationsModule ile değiştirilir.
ngMocks.guts(MyComponent, MyModule);

// BrowserAnimationsModule olduğu gibi kalacaktır.
ngMocks.guts([MyComponent, BrowserAnimationsModule], MyModule);

// BrowserAnimationsModule taklit edilecektir, değiştirilmez.
ngMocks.guts([MyComponent, MyModule], BrowserAnimationsModule);

// BrowserAnimationsModule tanımlamalardan hariç tutulacaktır.
ngMocks.guts(MyComponent, MyModule, BrowserAnimationsModule);

fakeAsync

Bir kept / mock BrowserAnimationsModule, fakeAsync ile sorunlara neden olur.
Eğer NoopAnimationsModule'ün bir çözüm olmadığı bir durumla karşılaşırsanız, lütfen GitHub'da bir sorun açın.

tehlike

Normal testlerin aksine, fixture.detectChanges() sonrasında fixture.whenStable()'ı beklemelisiniz noop animasyonları doğru bir şekilde render etmek için.

Çünkü fixture.whenStable() bir promise döndürdüğünden, tüm testi async yapmak zorundasınız.

it('should see all elements', async () => { // <-- async
// ... konfigurasyon
fixture.detectChanges(); // <-- değişiklikleri algılama
await fixture.whenStable(); // <-- animasyonları bekleme
// ... doğrulama
});