前端测试

Jest单元测试mock函数

2021-05-14  本文已影响0人  雷雨leiyu

在编写单元测试过程中经常遇到需要依赖外部数据的情况,比如异步请求就需要依赖网络,但我们在测试过程中又不允许发起实际请求,这种情况下就需要mock函数替代真实请求结果。

测试中用到mock函数的三种情况

1. 函数的调用捕获

用于测试回调函数时可以捕获函数有没被调用,参数是什么,返回值是什么等。

// 被测试代码
const processProducts = (products, callback) => {
  products.forEach(product => {
    callback(product)
  })
}
// 测试代码
const mockFunc = jest.fn()
processProducts([{...}], mockFunc)
expect(mockFunc.mock.calls.length).toBe(2)
// mockFunc有calls,results等属性

2. 设置函数返回值

可以通过mock函数的mockReturnValue()方法定制返回值,它的参数就是返回值。

// 同1中的processProducts案例,如果此函数有返回值
processProducts = jest.fn()
processProducts.mockReturnValue({name: "dennis"})
// 当测试代码调用processProducts的时候就会返回{name: "dennis"}

3. 改变原函数的实现

jest.fn()是默认的mock函数,如果不想使用默认或者提供函数实现则可以加上参数。

const mockFunc = jest.fn(x => x + 1)

4. mock模块

以上三种实现都是通过jest.fn()mock函数,而jest.mock()则可以mock模块。

// 第一种
jest.mock('request');
const request = require('request');
// mock math 对象上的add方法
const addMock = jest.spyOn(math, "add"); 
addMock.mockImplementation(() => "mock"); // 提供一个实现
// 第二种
jest.mock('request', () => {
    return (url, callback) => {
        callback(null, 'ok', {name: 'sam'})
    }
});
const fetchData = require('./func').fetchData;
test('should return data when fetchData request success', () => {
   return fetchData().then(res => {
       expect(res).toEqual({name: 'sam'})
   })
})

5. 钩子函数

describe('method called', () => {
    beforeEach(() => {
        window.unicode = false;
        window.local = false;
        window.isEnable = false
    })
})
上一篇 下一篇

猜你喜欢

热点阅读