在 javascript fetch.then 块中测试代码时，预期失败

Question

我尝试验证 window.open() 是在 then 块中调用的。这是一个最小的例子。

import { fakeAsync, tick } from '@angular/core/testing';

function openWindow() {
  const linksource = `data:application/pdf;base64,somePDF`;
  fetch(linksource).then(() => {
    window.open();
  });
}

describe('Asynchronus Testing', () => {
  it('opens a window', fakeAsync(() => {
    // Dont actually open a window
    window.open = () => window;
    spyOn(window, 'open');

    openWindow();
    tick();

    expect(window.open).toHaveBeenCalled();
  }));
});

window.open()实际被调用，但期望失败：

Error: Expected spy open to have been called.

tick() 即使我给它更多的时间也无济于事。我猜这是 fetch 特有的，因为 Promise.resolve().then() 块有效。

Answer 1

我注意到 fakeAsync/tick 也有同样的事情，其中 tick 无法控制某些承诺。

我会监视 fetch 并使其成为 return 随机承诺。

describe('Asynchronus Testing', () => {
  it('opens a window', fakeAsync(() => {
    // Dont actually open a window
    window.open = () => window;
    spyOn(window, 'open');
    // !! spy on window fetch and return a random promise
    spyOn(window, 'fetch').and.returnValue(Promise.resolve({}));

    openWindow();
    tick();

    expect(window.open).toHaveBeenCalled();
  }));
});

它应该有望与该修改一起使用。您也不应该在单元测试中进行 Http 调用（一般规则）。

在 javascript fetch.then 块中测试代码时，预期失败

Expectation fails, when testing code in javascript fetch.then block

fetch

jasmine

karma-runner

angular