SpyOn一個沒有正確間諜的模擬開玩笑模塊

Question

我有簡單的服務，我需要使用jest進行單元測試：

代碼的關鍵是：

 domtoimage.toBlob(node, {filter: filter})
    .then(function (blob) {
      FileSaver.saveAs(blob, fileName);
 });

我已經編寫了我的單元測試模塊：

import FileSaver from "file-saver";
import domtoimage from "dom-to-image";


jest.mock('dom-to-image', () => {
  return {
    toBlob: (arg)=>{
      let promise = new Promise((resolve, reject) => {
        resolve('myblob')
      });
      return promise;
    }
  }
});
jest.mock('file-saver', ()=>{
  return {
    saveAs: (blob, filename) =>{
      return filename;
    }
  }
});

在我的測試中，我有以下間諜設置

const spy = jest.spyOn(FileSaver, 'saveAs');

並調用我的測試功能。

但是，expect語句： expect(spy).toBeCalled()返回false：

expect(jest.fn()).toBeCalled()

但是，在webstorm中，當我調試單元測試時，我可以清楚地看到我的模擬函數被調用（在函數內部達到了斷點）。

我錯過了什么？

Answer 1

建議1

也許spyOn和模塊模擬不能很好地結合在一起。 您可以嘗試直接在模塊mock中使用jest.fn()

jest.mock('file-saver', ()=>{
  return {
    saveAs: jest.fn((blob, filename) => {
      return filename;
    })
  }
});

然后

expect(FileSaver.saveAs).toBeCalled()

記得在測試之間調用jest.clearAllMocks()或類似的東西。

建議2我遇到了jest.mock使用jest模塊緩存以意外方式工作的問題，尤其是在使用單例導入時。 也許你有這個問題。 如果file-saver和dom-to-image沒有任何狀態初始化或導入時間的副作用，你應該能夠交換jest.mock來覆蓋你需要模擬的函數。

beforeEach(() => {
  FileSaver.saveAs = jest.fn(...);
  domtoimage.toBlob = jest.fn(...);
})

Answer 2

所以對於那些你想要類似的東西...我的問題（我懷疑）是domtoimage.toBlob(node, {filter: filter}).then()的承諾domtoimage.toBlob(node, {filter: filter}).then()

基本上，承諾是在我的期望被召喚之后解決的。

為了解決這個問題，我將我的expect放在了setTimeout之后，因此在解決了promise之后迫使它被激活。

 DownloadImage('x', 'name');
  //small timeout to resolve the promise inside downldimage function
  setTimeout(()=>{
    expect(FileSaver.saveAs).toHaveBeenCalledWith('myblob', fileName);
    done();
  }, 100);