3

在我的 TypeScript 项目中设置jest-test-mock非常困难。我想知道是否有人可以指出我正确的方向？

我有一个看起来像这样的函数：

检索数据.ts

import fetch from 'cross-fetch'; 

export async function retrieveData({
  endpoint,
  configuration,
  auth
}: dataInterface): Promise<object> {
  try {
    console.log('Fetching the requested data... ')

    const settings = configuration
      ? JSON.parse(render(configuration || '', auth))
      : {}

    if (settings.body) {
      // Ensures the body is stringified in the case of a post request being made.
      settings.body = JSON.stringify(settings.body)
    }

    const response = await fetch(endpoint, settings)
    return await response.json()
  } catch (error) {
    throw new Error(`There was an error fetching from the API: ${error}`)
  }
}

我在fetch.test.ts中像这样测试它

// Enable the mocks
import { enableFetchMocks } from 'jest-fetch-mock'
enableFetchMocks()
import fetchMock from 'jest-fetch-mock';

import {retrieveData, generateExport} from '../src/fetch'

describe('fetch', () => {
  describe('retrieveData', () => {
    it('should return some data', async () => {
      fetchMock.mockResponseOnce(JSON.stringify({ data: '12345' }))
      const data = await retrieveData({
        endpoint: 'https://example.com'
      })

      expect(data).toEqual({ data: '12345' })
    })
  })
})

我遇到的问题是这个库似乎没有接管对fetch. 将完全限定的 URL 放入我的函数将导致返回实际数据。我希望它检索data: '12345'对象。我在哪里错了？

更新：

以下模式在导入时有效，import 'cross-fetch/polyfill';但如果我使用import fetch from 'cross-fetch';它则无效。使用第一个 import 语句的问题是它错误我的 linter 说fetch没有定义。如果我在 fetch 导入之前控制台日志，它会显示正确的模拟构造函数。我尝试过使用模拟的导入顺序，但仍然存在同样的问题：

import fetchMock, {enableFetchMocks} from 'jest-fetch-mock'
import {retrieveData, generateExport} from '../src/fetch'
enableFetchMocks()

这显然是某种进口订单问题，但我不确定用 Jest 解决这个问题的正确方法。将 a 添加fetch到 eslint 中的全局对象是否是一个合适的解决方案？

4

1 回答 1

0

你能试试这个代码吗，拜托。

describe('retrieveData', () => {
  it('should return some data', () => {
    fetchMock.mockResponseOnce(JSON.stringify({ data: '12345' }))
    retrieveData({
      endpoint: 'https://example.com'
    }).then(res => {
       expect(res).toEqual({ data: '12345' })
    })
  })
})
于 2020-03-06T14:53:10.767 回答