Единичный тест Angular2 с Karma и Jasmin - «встретил исключение для объявления»

Question

Я создал угловой компонент 2, и теперь я пытаюсь создать единичный тест для своего компонента с использованием Karma и Jasmin, но когда я выполняю свой модульный тест Я получаю excption, как encountered a declaration exception

Мой файл Spec как ниже

import { ComponentFixture, TestBed } from '@angular/core/testing'; 
import { By }    from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 
import { PageTitle } from '../../../components/title/title.component'; 

it('true is true Out ',() => expect(true).toBe(true)); 


describe('PageTitle (inline template)',() => { 

    let comp: PageTitle; 
    let fixture: ComponentFixture<PageTitle>; 
    let de: DebugElement; 
    let el: HTMLElement; 

    TestBed.configureTestingModule({ 
     declarations: [PageTitle], 
    }); 

    fixture = TestBed.createComponent(PageTitle); 

    comp = fixture.componentInstance; 

    de = fixture.debugElement.query(By.css('h1')); 

    el = de.nativeElement; 

    it('true is true in',() => expect(true).toBe(true)); 
}); 

Где я буду неправильно?

Answer 1

Содержит ли компонент страницы Title связанный шаблон html и/или файл css? Если да, это проблема. Angular загружает их через асинхронные вызовы, и ваши тесты запускаются в режиме синхронизации прямо сейчас. Правильная настройка для тестирования компонента должна быть примерно такой:

describe('PageTitle',() => { 
beforeEach(() => { 
    TestBed.configureTestingModule(({ 
     imports: [], 
     providers: [], 
     declarations: [ 
      PageTitle 
     ] 
    })); 
}); 

it('should render component', async(() => { 
    TestBed.compileComponents().then(() => { 
     let fixture = TestBed.createComponent(PageTitle); 
     let nativeElement = fixture.debugElement.nativeElement; 

     fixture.detectChanges(); 
    }); 
});