为什么 jest 不嘲笑这个模块?

4 javascript mocking jestjs

我有一个应该调用本地获取包装器的模块。为了检查 get 模块是否正确调用 fetch 包装器,我模拟它并返回一个间谍,如下所示:

// get.js
import fetch from '../fetch'

const get = (endpoint, token) => {
  const headers = new Headers()

  if (token) {
    headers.append('Authorization', `Bearer ${token}`)
  }

  const init = {
    headers,
    method: 'GET'
  }

  return fetch(new Request(endpoint, init))
}

export default get
Run Code Online (Sandbox Code Playgroud)
// get.test.js
import 'isomorphic-fetch'
import get from './get'

describe('get', () => {
  it('calls fetch with a request', () => {
    // I'm expecting this spy to be called by get
    const mockFetch = jest.fn()
    jest.mock('../fetch', () => jest.fn(mockFetch))

    get('endpoint', 'token')

    expect(mockFetch).toHaveBeenCalled()
  })
})
Run Code Online (Sandbox Code Playgroud)

但是当我运行它时,笑话失败了:

expect(jest.fn()).toHaveBeenCalled()

Expected mock function to have been called.
Run Code Online (Sandbox Code Playgroud)

那么为什么它不调用模拟呢?

And*_*rle 7

问题是所有jest.mock语句都被提升到代码块的顶部。因此,即使您将其写入测试中间,它也会作为测试的第一个语句运行,并且无法获得特定的返回值。那么如何解决这个问题呢?首先将模拟语句放在导入语句之后,以明确测试中没有发生模拟。然后在测试中导入该模块。所以这将是你的模拟语句中的结果jest.fn()。作为fetch一个间谍,你现在可以测试这个fetch被称为的东西。

import 'isomorphic-fetch'
import get from './get'
import fetch from '../fetch'
jest.mock('../fetch', () => jest.fn())

describe('get', () => {
  it('calls fetch with a request', () => {
    get('endpoint', 'token')
    expect(fetch).toHaveBeenCalled()
  })
})
Run Code Online (Sandbox Code Playgroud)