jestjs - 笑话：模拟 observable 和模板

Question

我有一个基于 observable 有 2 种不同状态的组件，所以我准备了这个：

describe('Has not ID', () => {
   fixture.detectChanges();
   expect(fixture).toMatchSnapshot();
});

describe('Has ID', () => {
    beforeEach(() => {
      component.getData$ = of({
        label: 'B',
      });
    });

    it('B', async () => {
      fixture.detectChanges();

      fixture.whenStable().then(() => {
        fixture.detectChanges();
        expect(fixture).toMatchSnapshot();
      });
    });
  });

对于测试 A 工作正常，它加载标签“A”，这是在组件中返回真实服务的内容：

  getData$ = this.getTemplateOptionById(this.id);

服务（模拟）：

getTemplateOptionById(id: number | null): Observable<myClass> {
    return this.select((s) => {
      if (id) {
        return A;
      } else {
        return B;
      }
    });
  }

该模板非常基本：

<div
  *ngIf="getData$ | async as data">
  {{ data.label }}
</div>

当我运行测试时，生成的快照有 2 个场景，但都是 A.

我究竟做错了什么？