test angular if else block and subscribe(response => {} block in jasmine

Question

我在编写组件方法测试用例时遇到问题。

如何在 subscribe((res) => { ///block} 和 ToasterService 中测试 Angular 组件方法 if else 块。

我在 component.ts 文件中调用了 Angular 服务方法。在服务调用中 subscribe(response=>{}.

我已经验证了 if else 块中的响应值，并根据结果显示了烤面包机消息，但我的业力报告说：response=> function not covered 和 if else 块内部未包含声明。

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}));    
  });

希望下面的代码块也能被 jasmine 测试：

subscribe((res) => {
      if(res.Success){
        this.userService.users = res.Data as User[];
      }else{
        this.toastr.error(res.Message);
      }
      
    });

业力报告：

Karma report

Answer 1

尝试

constructor(
    public userService: UserService,
    public toastr: ToastrService) { 
}

在规范文件中：

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')  
  });

由于您是 karama 的新手，我强烈建议您阅读 read this article，其中包含处理 Angular 单元测试的文章集，位于底部页面。

test angular if else block and subscribe(response => {} block in jasmine

test angular if else block and subscribe(response => {} block in jasmine

jasmine

typescript

karma-jasmine

angular

angular-unit-test