在 Jest JS 中返回一个 double答案

【问题标题】：Return a double in Jest JS在 Jest JS 中返回一个 double
【发布时间】：2019-04-11 12:15:12
【问题描述】：

我想测试一个像这样的简单函数：

const saveAs = (fileName, content, contentType) => {
 const a = createDownloadLink(fileName, content, contentType)
 a.click()
}

export const createDownloadLink = (fileName, content, contentType) => {
 ...
 const a = document.createElement('a')
 ...
 return a
}

export default saveAs

我想测试一下，当我调用saveAs时，会调用createDownloadLink，并在结果上调用click。

我尝试过嘲笑createDownloadLink 并在上面创建一个间谍。但是，我找不到如何测试点击结果：

Jest JS 测试：

  const createDownloadLink = jest.fn()
  saveAs('file.html', '<h1>hello</h1>', 'test/plain;UTF-8')
  expect(createDownloadLink).toBeCalled() // And return a double
  // expect(double.click).toBeCalled
})

【问题讨论】：

标签： javascript unit-testing testing jestjs

【解决方案1】：

我知道您已经回答了您自己的问题，但是既然您已经说过您不喜欢将您的功能分开在两个文件中，那么我可能有一个替代解决方案。既然您无论如何都要导出这两个函数，我可以建议您实际上将这两个函数都作为同一个对象的一部分吗？这将允许您轻松地模拟或监视模块功能。例如，假设您有 saver.js:

class Saver {
  saveAs(fileName, content, contentType) {
    const a = this.createDownloadLink(fileName, content, contentType)
    a.click()
  }

  createDownloadLink(fileName, content, contentType) {
    const a = document.createElement('a')
    return a
  }
}

const saver = new Saver();
export default saver;

那么您的测试将如下所示：

import saver from './saver'

describe('saveAs', () => {
  it("calls click on download link", () => {
    const click = jest.fn()
    saver.createDownloadLink = jest.fn(() => ({ click }));
    saver.saveAs('file.html', '<h1>hello</h1>', 'test/plain;UTF-8')
    expect(click).toHaveBeenCalled();
  })
})

【讨论】：

【解决方案2】：

我最终通过创建一个用作双精度的中间对象来解决这个问题。

不幸的是，我不得不将我的功能分成 2 个文件才能使用 `jest.mock。

import saveAs from './index'
import createDownloadLink from './utils'
jest.mock("./utils");

describe('saveAs', () => {
  it("calls click on download link", () => {
    const downloadLinkDouble = {}
    const clickMock = jest.fn()
    downloadLinkDouble.click = clickMock
    createDownloadLink.mockImplementation(() => downloadLinkDouble)

    saveAs('file.html', '<h1>hello</h1>', 'test/plain;UTF-8')

    expect(clickMock).toHaveBeenCalled()
  })
})

【讨论】：