Angular测试：如何测试subscribe回调内包含局部变量的方法？

错误原因 #

你的问题和方法内的局部变量没有关系，是两个问题导致报错：

• mock返回的数据结构和loadUsers方法预期的结构不匹配：你现在spy返回的是包含对象的数组，但方法内部直接取Data.User，预期getAllUser返回的是单个包含User属性的对象，不是数组，所以Data.User取值为undefined，后续赋值给component.users自然也是undefined。
• 部分Angular测试环境下需要确保异步流回调执行完成后再断言，不过你用of返回同步流的话只要结构正确就可以同步拿到结果，不属于本次的核心报错原因。

修正方案 #

方案1：调整mock数据结构（优先选，适配你现有业务代码） #

如果实际接口返回的是单个包含User属性的对象，直接去掉mock数据外层的数组即可，修正后的测试代码如下：

describe('#loadUsers', () => {
  // 去掉外层数组，和接口实际返回结构对齐
  const mockResponse = {
    Company: 'Test',
    User: [
      { name: 'Link', idc_situacao: 'A' },
      { name: 'Zelda', idc_situacao: 'I' },
    ],
  };
  it('should filter users with idc_situacao equal to A', () => {
    spyOn(secService, 'getAllUser').and.returnValue(of(mockResponse));
    component.loadUsers();
    // of是同步流，订阅回调会立即执行，可直接断言
    expect(component.users).toEqual([{ name: 'Link', idc_situacao: 'A' }]);
  });
});

方案2：调整业务代码取值逻辑 #

如果确认实际接口返回的就是数组结构，修改loadUsers里的取值逻辑即可：

loadUsers() {
  this.secService.getAllUser().subscribe(
    (data: any) => {
      let Data = data;
      // 取数组第一个元素的User属性
      let user = <Array<any>>Data[0].User;
      this.users = user.filter(f => f.idc_situacao == 'A');
    },
    error => {
      this.util.showError(error);
    }
  );
}

内容的提问来源于stack exchange，提问作者user17489771