Question

我想监视一个注入角度组件的服务方法。

我要测试的组件中的方法是：

validateLogin() {
    console.log("Before calling validateLogin method,", this.form.value.Username, this.form.value.Password);
    this.loginService.validateLogin(this.form.value.Username, this.form.value.Password)
        .then(response => {
          console.log("Response,", response);
            if(response.SkipWelcomePage) {
                this.router.navigateByUrl("/");
            }
            else this.router.navigateByUrl("/welcome");
        })
        .catch(err => {
           this.errorMessage = err;
        });
}

我对上述方法的测试用例是：

it('should validate login', async(() => {

    const loginService = fixture.debugElement.injector.get(LoginService);
    spyOn(loginService,'validateLogin').and.returnValue(function (username, password) {
      return {SkipWelcomePage: false}
    });
    fixture.componentInstance.form.controls['Username'].setValue("test");
    fixture.componentInstance.form.controls['Password'].setValue("test");
    fixture.detectChanges();
   fixture.debugElement.query(By.css('.loginButton')).nativeElement.click();
    expect(routerStub.navigate).toHaveBeenCalledWith(['/welcome']);
  }));

测试用例失败，控制台日志：console.log("Response,", response);未显示，控制台也没有错误。

我该如何解决这个问题？

Answer 1

首先是一些更干净的代码。看起来你想要完全删除登录服务，而不是使用真实的和模拟函数。

在初始设置中定义一个名为＆＃39; loginServiceMock＆＃39;：

的对象

const loginServiceMock = jasmine.createSpyObj('LoginService', ['validateLogin']);

然后，在您的提供者列表中，添加：

{provide: LoginService, useValue: loginServiceMock}

然后你遇到的问题。 LoginService应该返回一个Promise对象，而不是一个普通的Typescript对象，因为你正在调用＆＃39; .then（）＆＃39;在结果上。你想要做的是：

loginServiceMock.validateLogin.and.returnValue(Promise.resolve({SkipWelcomePage: false});

如何在4角茉莉花测试案例中窥探服务方法

1 个答案: