Angular 5:单元测试getter和setter

Question

我无法使用Karma在Angular 5中测试getter和setter函数.关于我哪里出错的任何想法？

设置该值,然后测试等待较短的持续时间,以便在调用getter函数之前解析setter函数.这是代码:

service.ts

set header(h: string) {
    this.zone.run(() => {
        this._header = h;
    });
}

get header(): string {
    return this._header;
}

test.ts

before(() => {
    service = new Service()
});

it('updates header', (done) => {
    const header = 'test header';
    service.header = header;

    // Give header time to update
    return Promise.delay(200)
    .then(() => {
         expect(service.header).to.equal(header);
    })
});

我希望断言成功解决,但是我收到错误

AssertionError:预期未定义为等于'test header'

Answer 1

您将设置的内容包装到区域中是否有原因？

对于 99% 的异步活动，我喜欢 Angular 的“fakeAsync”和“tick”方法。

it('should update header', fakeAsync( ()=>{
  const header = 'test header';
  service.header = header;
  tick() // <= Will wait for for all microtransactions to finish
  expect(service.header).to.equal(header);
}))

有很多关于 JavaScript 中的宏交易和微交易的好文章。简而言之，可观察发射的承诺和订阅是微交易。

“setTimeout”是宏事务的示例。

fakeAsync-UnitTest 中的“tick()”最好的一点是，您不必建议代码需要等待多长时间。“tick()”只是排空微交易队列，因此在测试继续之前所有等待的微交易都将得到解决。

您也可以在等待 Angular 组件的changeDetection 时使用它们。:-)

我希望这能有所帮助。

温暖的问候