I am facing an issue in writing test case on component method.
How to test a Angular component method if else
block inside subscribe((res) => { ///block}
and ToasterService
inside it.
I have called the Angular service method in my component.ts file.
within the service call subscribe(response=>{}
.
I have validated the response value in if else
block, and show toaster message according to result but my karma report says: response=> function not covered
and inside if else
block not statement not covered.
component.ts
constructor(private userService: UserService,
private toastr: ToastrService) { }
sortUsers(sortKey: string) {
this.userService.getSortUserList(sortKey).subscribe((res) => {
if(res.Success){
this.userService.users = res.Data as User[];
}else{
this.toastr.error(res.Message);
}
});
}
component.spec.ts
it('call sortUser when users are sorted', () => {
const users: User[] = [{
User_Id: 1,
First_Name: 'Madhu Ranjan',
Last_Name: 'Vannia Rajan',
Employee_Id: 12345,
Project_Id: 1,
Task_Id:1,
_id: 'xcv'
}];
component.sortUsers('First_Name');
const res = {Success: true, Data: users}
spyOn(service, 'getSortUserList').and.returnValue(of({Success: true, Data: users}));
});
expecting the below block also to be tested by jasmine:
subscribe((res) => {
if(res.Success){
this.userService.users = res.Data as User[];
}else{
this.toastr.error(res.Message);
}
});
karma report:
Try
constructor(
public userService: UserService,
public toastr: ToastrService) {
}
and in spec file:
it('call sortUser when users are sorted with success', () => {
const users: User[] = [{
User_Id: 1,
First_Name: 'Madhu Ranjan',
Last_Name: 'Vannia Rajan',
Employee_Id: 12345,
Project_Id: 1,
Task_Id:1,
_id: 'xcv'
}];
const res = {Success: true, Data: users}
spyOn(component.userService, 'getSortUserList').and.returnValue(of(res));
spyOn(component.toastr,'error').and.callThrough();
component.userService.users = undefined;
component.sortUsers('First_Name');
expect(component.userService.users).toBeDefined()
expect(component.toastr.error).not.toHaveBeenCalled()
});
it('call Error Toaster in sortUser() when users are sorted', () => {
const res = {Message: 'error_msg'}
spyOn(component.userService, 'getSortUserList').and.returnValue(of(res));
spyOn(component.toastr,'error').and.callThrough();
component.userService.users = undefined;
component.sortUsers('First_Name');
expect(component.userService.users).not.toBeDefined()
expect(component.toastr.error).toHaveBeenCalledWith('error_msg')
});
Since you are new to karama
I would strongly suggest you to read this article which contains a collection of articles to handle Angular Unit testing at the bottom page.