OverrideComponent with TestBed

Question

У меня MainComponent, который использует ChildComponentA как @ViewChild. MainComponent вызывает метод на ChildComponentA.

Я хочу написать единичный тестовый корпус, издевательский ChildComponentA. Как я могу это сделать, используя TestBed (в Angular 2 RC5)?

Раньше я использовал overrideDirective(MainComponentName, ChildComponentA, MockChildComponentA); Есть ли эквивалент с использованием TestBed?

Я попытался с помощью

TestBed.overrideComponent(ChildComponentA,{ 
     set: { 
      template: '<div></div>' 
     } 
     }); 

который просто задает шаблон, но я хочу, чтобы дразнить методы в компоненте, а также.

Answer 1

Я думаю, что в этом случае вы можете попробовать и заменить дочерний компонент макетным компонентом. Просто создайте макет с тем же селектором и используйте TestBed, чтобы удалить объявление реального дочернего компонента и добавить объявление к вашему макету.

@Component({ 
    selector: 'child', 
    template: '<div></div>' 
}) 
class MockComponent { 

} 

И в тесте делают это, чтобы использовать фиктивный компонент:

TestBed.configureTestingModule({ 
     imports: [MyModule], 
     declarations: [ParentComponent, MockComponent] 
    }); 

    TestBed.overrideModule(MyModule, { 
     remove: { 
      declarations: [ParentComponent, ChildComponent], 
      exports: [ParentComponent, ChildComponent] 
     } 
    }); 

Подробнее здесь: https://github.com/angular/angular/issues/10689. Обязательно повторно объявите ParentComponent, он не работает в противном случае (не знаете почему).

Если вы используете @ViewChild для получения ссылки на дочерний компонент, вам нужно будет изменить его, чтобы не использовать тип компонента, а идентификатор. Используйте @ViewChild ('child') вместо @ViewChild (ChildComponent). См. Второй пример отсюда: http://learnangular2.com/viewChild/