Test a method which calls another method from the viewChild using Jasmine
@DanielDrozzel answer may solve your problem, but essentially it is flawed and not a good practice. I would like to offer an alternative.
In Daniel's answer, when you use declarations: [ TestedComponent, ChildComp]
you create a tight coupling in your unit tests between TestedComponent
and ChildComp
. If the child component stops working your tests will fail, if it changes behaviour, the tests may fail.
It's not always a bad thing, but it can sometimes bite you.
It's better to use Component Stubs as mentioned in official Angular Docs
https://angular.io/guide/testing#nested-component-tests or a very useful ng-mocks library. The third option mentioned in the Angular docks above is NO_ERRORS_SCHEMA
but you can't use it if you want to test if child component's methods are called from parent.
Using ng-mocks library all you need to do is to swap
declarations: [ TestedComponent, ChildComp]
in Daniel's answer for
declarations: [ TestedComponent, MockComponent(ChildComp)]
and the parent component can be tested without creating a hard dependency on a child component.
If you have for example
class TestedComponent() {
@ViewChild('ChildComp') public variableChildComponent: ChildComp;
}
In testing spec file declare child component and tested component:
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [ TestedComponent, ChildComp]
})
fixture = TestBed.createComponent(TestedComponent);
comp = fixture.componentInstance;
spyOn(comp.variableChildComponent, 'someMethod').and.returnValue(true);
});
This should work.