如何使用Jest模拟ES6模块导入？ [英] How can I mock an ES6 module import using Jest?

问题描述

我开始认为这是不可能的，但是我还是要问。

我想测试一下我的ES6模块调用另一个ES6模块以特定的方式。茉莉花这是非常简单的 -

应用程序代码：

  // myModule.js 
从'./dependency'导入依赖; 
 
 export default（x）=> {
 dependency.doSomething（x * 2）; 
} 
  

而测试代码：

  // myModule-test.js 
从'../myModule'导入myModule; 
从../dependency导入依赖; 
 
 describe（'myModule'，（）=> {
 it（'用相同的输入'调用依赖项'，（）=> {
 spyOn 'doSomething'）; 
 
 myModule（2）; 
 
 expect（dependency.doSomething）.toHaveBeenCalledWith（4）; 
}）; 
} ）; 
  

与Jest相当的是什么？我觉得这是一件很简单的事情，但是我一直在撕裂我的头发，试图弄清楚。

最近我来了通过用 require 替换 import s，并将它们移动到测试/函数内。这两个都不是我想做的事情。

  // myModule.js 
 export default（x）=> ; {
 const dependency = require（'./ dependency'）; // yuck 
 dependency.doSomething（x * 2）; 
} 
 
 //myModule-test.js 
 describe（'myModule'，（）=> {
 it '，（）=> {
 jest.mock（'../ dependency'）; 
 
 myModule（2）; 
 
 const dependency = '../dependency'）; //还有yuck 
 expect（dependency.doSomething）.toBeCalledWith（4）; 
}）; 
}）; 
  

对于积分，我希望使< $ c> dependency.js 是默认导出。然而，我知道，默认出口的监视在茉莉花中不起作用（或至少我永远不会让它工作），所以我不希望在Jest中也有可能。

解决方案

我已经能够通过使用涉及 import * 的黑客来解决这个问题。它甚至适用于命名和默认导出！

对于命名导出：

  // dependency.js 
 export const doSomething =（y）=> console.log（y）
 
 // myModule.js 
 import {doSomething} from'./dependency'; 
 
 export default（x）=> {
 doSomething（x * 2）; 
} 
 
 // myModule-test.js 
从'../myModule'导入myModule; 
 import *作为依赖从../dependency; 
 
 describe（'myModule'，（）=> {
 it（'用相同的输入调用依赖项'，（）=> {
 dependency.doSomething = jest.fn（）; //突变命名导出
 
 myModule（2）; 
 
 expect（dependency.doSomething）.toBeCalledWith（4）; 
} ）; 
}）; 
  

或默认导出：

  // dependency.js 
 export default（y）=> console.log（y）
 
 // myModule.js 
从'./dependency'导入依赖; //注意缺少curlies 
 
 export default（x）=> {
依赖（x * 2）; 
} 
 
 // myModule-test.js 
从'../myModule'导入myModule; 
 import *作为依赖从../dependency; 
 
 describe（'myModule'，（）=> {
 it（'用相同的输入调用依赖关系'，（）=> {
 dependency.default = jest.fn（）; //突变默认导出
 
 myModule（2）; 
 
 expect（dependency.default）.toBeCalledWith（4）; //断言默认
}）; 
}）; 
  

I'm beginning to think this isn't possible, but I want to ask anyway.

I want to test that one of my ES6 modules calls another ES6 module in a particular way. With Jasmine this is super easy --

The app code:

// myModule.js
import dependency from './dependency';

export default (x) => {
  dependency.doSomething(x * 2);
}

And the test code:

//myModule-test.js
import myModule from '../myModule';
import dependency from '../dependency';

describe('myModule', () => {
  it('calls the dependency with double the input', () => {
    spyOn(dependency, 'doSomething');

    myModule(2);

    expect(dependency.doSomething).toHaveBeenCalledWith(4);
  });
});

What's the equivalent with Jest? I feel like this is such a simple thing to want to do, but I've been tearing my hair out trying to figure it out.

The closest I've come is by replacing the imports with requires, and moving them inside the tests/functions. Neither of which are things I want to do.

// myModule.js
export default (x) => {
  const dependency = require('./dependency'); // yuck
  dependency.doSomething(x * 2);
}

//myModule-test.js
describe('myModule', () => {
  it('calls the dependency with double the input', () => {
    jest.mock('../dependency');

    myModule(2);

    const dependency = require('../dependency'); // also yuck
    expect(dependency.doSomething).toBeCalledWith(4);
  });
});

For bonus points, I'd love to make the whole thing work when the function inside dependency.js is a default export. However, I know that spying on default exports doesn't work in Jasmine (or at least I could never get it to work), so I'm not holding out hope that it's possible in Jest either.

解决方案

I've been able to solve this by using a hack involving import *. It even works for both named and default exports!

For a named export:

// dependency.js
export const doSomething = (y) => console.log(y)

// myModule.js
import { doSomething } from './dependency';

export default (x) => {
  doSomething(x * 2);
}

// myModule-test.js
import myModule from '../myModule';
import * as dependency from '../dependency';

describe('myModule', () => {
  it('calls the dependency with double the input', () => {
    dependency.doSomething = jest.fn(); // Mutate the named export

    myModule(2);

    expect(dependency.doSomething).toBeCalledWith(4);
  });
});

Or for a default export:

// dependency.js
export default (y) => console.log(y)

// myModule.js
import dependency from './dependency'; // Note lack of curlies

export default (x) => {
  dependency(x * 2);
}

// myModule-test.js
import myModule from '../myModule';
import * as dependency from '../dependency';

describe('myModule', () => {
  it('calls the dependency with double the input', () => {
    dependency.default = jest.fn(); // Mutate the default export

    myModule(2);

    expect(dependency.default).toBeCalledWith(4); // Assert against the default
  });
});

这篇关于如何使用Jest模拟ES6模块导入？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！