javascript - Jest mock 获取响应 blob 的 fetch() 函数

Question

我想通过额外的 blob 提取来模拟 fetch 函数使用 jest.fn().mockimplementation() 和不使用 fetch-mock 或 jest-fetch-mock

fetch(url)
.then((response) => response.blob)
.then((data) => imageHandler(data))

Answer 1

这是解决方案，我使用 jest.mock() 模拟 node-fetch 模块。

import fetch from 'node-fetch';

function fetchBlobImage() {
  const url = '';
  return fetch(url)
    .then(response => response.blob)
    .then(blob => processImage(blob));
}

function processImage(blob) {
  return JSON.stringify(blob);
}

export { fetchBlobImage };

单元测试:

import { fetchBlobImage } from './';

jest.mock('node-fetch', () => {
  const context = {
    then: jest.fn().mockImplementationOnce(() => {
      const blob = {};
      const response = { blob };
      return Promise.resolve(response);
    })
  };
  return jest.fn(() => context);
});

describe('node-fetch', () => {
  it('should be mock correctly', async () => {
    const actualValue = await fetchBlobImage();
    expect(actualValue).toBe(JSON.stringify({ blob: {} }));
  });
});

测试结果:

 PASS  src/mock-module/node-fetch/index.spec.ts
  node-fetch
    ✓ should be mock correctly (5ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        2.25s, estimated 3s