【问题标题】:How to unit test a function that returns a promise in angular如何对以角度返回承诺的函数进行单元测试
【发布时间】:2021-09-07 20:18:25
【问题描述】:

我在组件中有一个函数,它将调用一个带有 3 个参数的服务方法并返回一个承诺。我想使用 karma jasmine 对函数进行单元测试。我在这里犯了什么错误吗?

组件代码

getHeaderData() {
 return this.service.getList({
    id: this.id,
    name: this.name,
    pageName: constants.PAGE_NAME
  });
}

服务代码

getList(param): Promise<any> {
 const params = new HttpParams()
    .set('cId',param.id)
    .set('cName',param.name)
    .set('cPageName',param.pageName);
  return new Promise((resolve, reject) => {
   try {
       this.httpService.get('getHeader', {params}).subscribe(data => {
         resolve(data);
        });
   }catch (err){
     reject(err);      
    }
 });
}

规范文件代码

it('test getHeaderData()', async () => {
  const serviceSpy: Service = TestBed.get(Service);
  SpyOn(serviceSpy, 'getList').and.ReturnValue(Promise.resolve(constants.response));
  expect(serviceSpy.getList).toHaveBeenCalled();
  expect(component.getHeaderData()).toBe(constants.response);
});

服务的实际返回值是一个对象数组,与我在常量文件中创建的响应相同,并且使用上面的代码,我遇到了错误。我不确定这是不是正确的做法。

类型参数缺少以下属性形式的 ' { then: ExpectedRecursive

【问题讨论】:

    标签: angular promise jasmine karma-jasmine


    【解决方案1】:

    一切看起来都不错,您只是错过了 await 关键字,因为您返回的是 Promiseconstants.response (Promise&lt;constants.response&gt;)。因此,您必须在验证之前await

    it('test getHeaderData()', async () => {
      const serviceSpy: Service = TestBed.get(Service);
      SpyOn(serviceSpy, 'getList').and.ReturnValue(Promise.resolve(constants.response));
      expect(serviceSpy.getList).toHaveBeenCalled();
    
      // Added missed `await` keyword
      expect(await component.getHeaderData()).toBe(constants.response);
    });
    

    【讨论】:

    • 我添加了您提到的等待,但现在我收到以下两个错误 1. 预期的间谍 getList 到 HaveBeenCalled 2. 无法读取 null 的属性“id”。我需要在这里传递实际参数吗?如果可以,这里怎么做?
    猜你喜欢
    • 2017-01-03
    • 2016-10-04
    • 2017-05-08
    • 2018-07-27
    • 2018-01-21
    • 1970-01-01
    • 2020-09-28
    • 1970-01-01
    • 2016-09-26
    相关资源
    最近更新 更多