Angular Jasmine测试中如何等待对象Promise解析后执行异步方法？

咱们一步一步拆解你遇到的两个问题，再结合你写的hasID方法来修正和说明。

1. 如何在异步方法中等待对象上的Promise解析后再继续执行？ #

你已经用到了正确的核心方式——await关键字，但你的hasID方法里有几个逻辑问题，导致this.info可能没被正确赋值，而且最终总是返回false：

你的原方法问题分析： #

• 即使await item.promise成功解析，你只是赋值了this.info，但没有检查是否符合“有ID”的条件，直接进入下一次循环
• response.json()本身也是异步的（返回Promise），如果不用await，this.info会是一个未解析的Promise对象，而非实际的JSON数据
• 无论循环内是否有成功的情况，方法最后固定返回false

修正后的方法： #

private async hasID(items: Items[]): Promise<boolean> { 
  for (const item of items) { 
    try { 
      // 等待item上的Promise解析
      const response = await item.promise;
      // 等待json()方法的Promise解析，拿到实际数据
      this.info = await response.json(); 
      // 检查是否存在ID属性（根据你的需求调整判断逻辑）
      if (this.info?.id) {
        return true; // 找到符合条件的item，直接返回true
      }
    } catch (err) { 
      // 当前item的Promise失败，跳过继续检查下一个
      continue; 
    } 
  } 
  // 所有item都检查完，没有符合条件的，返回false
  return false; 
}

核心说明： #

• 在异步函数中，await item.promise会暂停当前函数执行，直到这个Promise被resolve或reject：
  • 若resolve，会拿到Promise的返回值，继续执行后续代码
  • 若reject，会进入catch块处理错误
• 别忘了如果Promise的返回值还有异步操作（比如json()），必须再加一层await，否则你拿到的只是另一个Promise，不是最终数据

2. Jasmine框架进行Angular测试时，能否等待对象的某个属性？ #

当然可以！Jasmine结合Angular测试工具，提供了多种方式等待异步操作完成，确保对象属性被赋值后再做断言：

方式一：用async/await直接等待异步方法完成 #

describe('YourComponent', () => {
  let component: YourComponent;
  let fixture: ComponentFixture<YourComponent>;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [YourComponent]
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(YourComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should return true and set info when an item has ID', async () => {
    // 模拟带有成功Promise的测试数据
    const mockItems: Items[] = [
      {
        promise: Promise.resolve({
          json: () => Promise.resolve({ id: 123 })
        })
      }
    ];

    // 等待hasID方法执行完成
    const result = await component.hasID(mockItems);
    
    // 此时this.info已经被赋值，可以安全断言
    expect(result).toBeTrue();
    expect(component.info).toEqual({ id: 123 });
  });
});

方式二：用fakeAsync/tick模拟时间流逝 #

这是Angular测试中常用的异步处理方式，适合测试那些无法直接await的场景：

it('should wait for info property to be set', fakeAsync(() => {
  const mockItems: Items[] = [
    {
      promise: Promise.resolve({
        json: () => Promise.resolve({ id: 456 })
      })
    }
  ];

  let methodResult: boolean | undefined;
  // 启动异步方法但不直接await
  component.hasID(mockItems).then(res => methodResult = res);
  
  // tick()会模拟时间前进，等待所有pending的Promise完成
  tick();
  // 触发变更检测，确保组件属性更新
  fixture.detectChanges();

  // 现在可以断言属性和方法结果
  expect(methodResult).toBeTrue();
  expect(component.info).toEqual({ id: 456 });
}));

关于你遇到的this.connectorInfo返回undefined的可能原因： #

• 你没有等待hasID方法完成就直接访问该属性
• item.promise解析后的json()没有用await，导致属性值是未解析的Promise
• 所有item的Promise都失败了，进入catch块后this.info从未被赋值

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