Ana içeriğe geç

Şablon ayrıştırma hatalarının nasıl düzeltileceği: bilinen bir öğe değil

Bu hata, bir testte bir test bileşeninin bağımlı olduğu modülün sahte modülü olduğunda meydana gelebilir, ancak bildirimleri dışa aktarılmamıştır.

@NgModule({
declarations: [DependencyComponent],
})
class MyModule {}
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [
MyComponent, // <- önemli olan tek bildirim.
],
imports: [MockModule(MyModule)],
});
return TestBed.compileComponents();
});
tehlike

Bu durumda, bir test Template parse errors: <DependencyComponent> bilinen bir öğe değil hatası verecektir.

Buradaki sorun, DependencyComponent'ın dışa aktarılmamış olmasıdır ve sahte bir DependencyComponent'a erişmek için ya MyComponent'ın bildirildiği aynı seviyede bildirim yapmamız ya da DependencyComponent'ı dışa aktarmamız gerekir.

Bunu yapmanın 3 çözümü vardır:

  1. MockComponent çağrısını doğrudan TestBed'de yaparak

    beforeEach(() => {
    TestBed.configureTestingModule({
    declarations: [MyComponent, MockComponent(DependencyComponent)],
    });
    return TestBed.compileComponents();
    });
  2. ngMocks.guts kullanarak,
    bu, ilk çözümle aynı şeyleri yapar,
    ancak MyModule'dan tüm ithalatlar ve bildirimler için sahte bileşenler sağlar.

    beforeEach(() => {
    TestBed.configureTestingModule(ngMocks.guts(MyComponent, MyModule));
    return TestBed.compileComponents();
    });
  3. MockBuilder kullanarak,
    davranışı yukarıdaki çözümlerden farklıdır. Bir sahte MyModule oluşturur, bu da tüm ithalatları ve bildirimleri, sahte bir DependencyComponent dahil olmak üzere dışa aktarır.

    // MockBuilder'in vaatini döndürmeyi unutmayın.
    beforeEach(() => MockBuilder(MyComponent, MyModule));
not

Her yaklaşımın artıları ve eksileri hakkında daha fazla detaylı bilgiyi
ng-mocks'dan motivasyon ve hızlı başlangıç bölümünde okuyabilirsiniz.