什么时候必须用异步包装规范的回调函数？答案

【问题标题】：When do you have to wrap callback function of a spec with Async?什么时候必须用异步包装规范的回调函数？
【发布时间】：2018-07-16 21:17:08
【问题描述】：

出于某种原因，这两个规范正在通过，但是第二个规范正在模板内测试插值，使用来自服务的异步数据。为什么不用异步封装回调函数？

describe('SaangComponent', () => {
  let component: SaangComponent;
  let fixture: ComponentFixture<SaangComponent>;
  let compiled: HTMLElement;
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ SaangComponent ],
      providers: [
        {provide: GetSomeService, useValue: getSomeServiceMock}
      ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(SaangComponent);
    component = fixture.componentInstance;
    compiled = fixture.debugElement.query(By.css('h1')).nativeElement;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });

  it('should update the h1 attribute with the title', () => {

    fixture.detectChanges();
    const expectedText = compiled.innerHTML;
    expect(expectedText).toEqual('lord');
  });
});

const getSomeServiceMock = {
  getSomeData() {
    return Observable.of({title: 'lord'});
  }
};

【问题讨论】：

标签： javascript angular angular-services angular-test angular-unit-test

【解决方案1】：

如果期望函数是异步的，则必须使用 async 或 fakeAsync Angular 助手将回调函数包装在测试块中。

getSomeServiceMock 使用Observable.of 并且是同步的。这就是为什么async 是可选的。

如果此测试套件中涉及的组件不包含异步加载的组件，beforeEach 中的async 也是可选的。

根据经验，所有测试块都可以用fakeAsync 包装。它比async 更快，并且会通知您它是否不合适（当真正的异步操作发生在一个块中时）。

【讨论】：

【解决方案2】：

我假设在组件的 ngOnInit 生命周期挂钩中调用了“getSomeData”。如果是这样，您正在使用的模拟响应在您创建组件时已被使用。

【讨论】：