Question

我想用茉莉花对组件中存在的函数进行单元测试。在函数内部存在subscribe函数。我想测试函数id用户获得响应，而不是导航到/user组件。

功能

 onSubmit(val) {
    console.log(val);
    this.signupService.signUpHandler(val).subscribe((res:SignUpModel) => {
      if (res.token !== '') {
        this.router.navigate(['/users']);
      }
    }, (err) => {
      console.log(err);
    });
  }

这是我的代码 https://stackblitz.com/edit/angular-testing-kdb8ka?file=app%2Fapp.component.ts

我可以检查我的service功能是否按下了按钮

 it('should called service method on button click', inject([SignupserviceService], (signupserviceService: SignupserviceService) => {
      spyOn(signupserviceService, 'signUpHandler');
      let button = fixture.nativeElement.querySelector('.btn')
      button.click();
      expect(signupserviceService.signUpHandler).toHaveBeenCalled();
    }));

现在我想检查一下我是否收到服务回复，而不是重定向到\user组件。

Answer 1

您只需要监视您订阅的功能并返回您期望的响应，假设成功：

it('should call the router's navigate method if a non-empty string token property is on the response', inject([SignupserviceService, Router], (signupserviceService: SignupserviceService, router: Router) => {
      spyOn(signupserviceService, 'signUpHandler').and.returnValue(Observable.of({token: 'not empty'}));
      spyOn(router, 'navigate');
      let button = fixture.nativeElement.querySelector('.btn');

      button.click();
      expect(router.navigate).toHaveBeenCalledWith(['/users']);
    })
);

将其视为伪代码，因为我没有检查错误，但是你明白了。

如何检查订阅功能是否有角度？

1 个答案: