一、介紹

• Mocks可以捕獲對(duì)函數(shù)的調(diào)用（以下用法一）
  • 使用mock function，可以查看函數(shù)的調(diào)用次數(shù)，以及入?yún)⑶闆r
• Mocks可以擦除函數(shù)的實(shí)際實(shí)現(xiàn)來測(cè)試代碼之間的鏈接（以下用法二）
  • manual_mocks用來mock依賴的模塊，放置在相應(yīng)__mocks__的目錄下
    
    

二、用法

（一）Mock Function

• 主要使用let mockFunc = jest.fn()來模擬function(),可測(cè)試調(diào)用的次數(shù)和傳入的參數(shù)

function forEach(items,callback) {
  for(let index = 0;index<items.length;index++){
    callback(items[index])
  }
}
test('forEach',()=>{
  // mockFunc模擬函數(shù)
  let mockFunc = jest.fn()

  forEach([1,2,3],mockFunc)
  // 調(diào)用了多少次
  expect(mockFunc.mock.calls.length).toBe(3)
   // 參數(shù)
  expect(mockFunc.mock.calls[0]).toEqual([1])
  expect(mockFunc.mock.calls[0][0]).toBe(1)
})

• 使用npx jest測(cè)試執(zhí)行，結(jié)果為passed
  
  

（二）manual_mock

• 用于手動(dòng)模擬測(cè)試模塊，覆蓋模塊依賴。如無法調(diào)用Ajax、jQuery進(jìn)行測(cè)試的情況下，自己手動(dòng)寫一個(gè)有相同邏輯的"Ajax"、"jQuery"進(jìn)行模塊覆蓋，以此達(dá)到正常測(cè)試的目的

• 用法：應(yīng)在相應(yīng)的目錄下新建__mock__文件夾，并在文件夾里新建manual_mock.js

  • 若模擬本地模塊，則在同目錄下新建__mock__文件夾，并在文件夾里新建manual_mock.js
  • 若模擬node_modules文件夾里的模塊，則在node_modules文件夾相應(yīng)目錄（一般是根目錄）下新建__mock__文件夾，并在文件夾里新建manual_mock.js。例如本文章新建一個(gè)jquery.js為例。

• /__mock__/jquery.js

module.exports = (selector) => document.querySelector(selector)

• /test/mocks.js

jest.mock('jquery')
const $ = require('jquery')

test('jquery',()=>{
  document.body.innerHTML = '<div id="jquery">jquery</div>'
  expect($('#jquery').innerHTML).toBe('jquery')
})

• 使用npx jest測(cè)試執(zhí)行，結(jié)果為passed