Jest：Mock ES6模块，包含默认导出和命名导出(Jest: Mock ES6 Module with both default and named export)

我有一个带有默认和命名导出的ES6模块：

/** /src/dependency.js **/ export function utilityFunction() { return false; } export default function mainFunction() { return 'foo'; }

它被第二个ES6模块使用：

/** /src/myModule.js **/ import mainFunction, { utilityFunction } from './dependency'; // EDIT: Fixed syntax error in code sample // export default myModule() { export default function myModule() { if (!utilityFunction()) return 2; return mainFunction(); }

我正在尝试使用Jest为myModule.js编写单元测试。但是当我尝试模拟命名和默认导入时，Jest似乎只模拟命名导入。它继续使用默认导入的实际实现，并且即使在我调用.mockImplementation（）之后也不允许我模拟它。这是我正在尝试使用的代码：

/** * Trying to mock both named and default import. * THIS DOESN'T WORK. */ /** /tests/myModule.test.js **/ import mainFunction, { utilityFunction } from '../src/dependency'; import myModule from '../src/myModule'; jest.mock('../src/dependency'); mainFunction.mockImplementation(() => 1); utilityFunction.mockImplementation(() => true); describe('myModule', () => { it('should return the return value of mainFunction when the result of utilityFunction is true', () => { expect(myModule()).toEqual(1); // FAILS - actual result is 'foo' }); });

这种行为对我来说似乎很奇怪，因为在模拟JUST默认导入或JUST命名导入时，此API工作正常。例如，在myModule.js仅导入默认导入的情况下，这很容易完成：

/** * Trying to mock just the default import. * THIS WORKS. */ /** /src/myModule.js **/ import mainFunction from './dependency'; // EDIT: Fixed syntax error in code sample // export default myModule() { export default function myModule() { return mainFunction(); } /** /tests/myModule.test.js **/ // If only mainFunction is used by myModule.js import mainFunction from '../src/dependency'; import myModule from '../src/myModule'; jest.mock('../src/dependency'); mainFunction.mockImplementation(() => 1); describe('myModule', () => { it('should return the return value of mainFunction', () => { expect(myModule()).toEqual(1); // Passes }); });

在仅使用命名的'utilityFunction'导出的情况下，它也很容易模拟导入：

/** * Trying to mock both named and default import. * THIS WORKS. */ /** /src/myModule.js **/ import { utililtyFunction } from './dependency'; // EDIT: Fixed syntax error in code sample // export default myModule() export default function myModule() { return utilityFunction(); } /** /tests/myModule.test.js **/ // If only utilityFunction is used by myModule.js import { utilityFunction } from '../src/dependency'; import myModule from '../src/myModule'; jest.mock('../src/dependency); utilityFunction.mockImplementation(() => 'bar'); describe('myModule', () => { it('should return the return value of utilityFunction', () => { expect(myModule()).toEqual('bar'); // Passes }); });

是否可以使用Jest模拟命名和默认导入？是否有不同的语法可用于实现我想要的结果，我从模块中导入命名和默认值并且能够同时模拟它们？

I have an ES6 module with both a default and a named export:

/** /src/dependency.js **/ export function utilityFunction() { return false; } export default function mainFunction() { return 'foo'; }

Its being used by a second ES6 module:

/** /src/myModule.js **/ import mainFunction, { utilityFunction } from './dependency'; // EDIT: Fixed syntax error in code sample // export default myModule() { export default function myModule() { if (!utilityFunction()) return 2; return mainFunction(); }

I'm trying to write a unit test for myModule.js using Jest. But when I try to mock both the named and the default import, Jest appears to only mock the named import. It continues to use the actual implementation of the default import, and doesn't allow me to mock it, even after I call .mockImplementation(). Here's the code I'm trying to use:

/** * Trying to mock both named and default import. * THIS DOESN'T WORK. */ /** /tests/myModule.test.js **/ import mainFunction, { utilityFunction } from '../src/dependency'; import myModule from '../src/myModule'; jest.mock('../src/dependency'); mainFunction.mockImplementation(() => 1); utilityFunction.mockImplementation(() => true); describe('myModule', () => { it('should return the return value of mainFunction when the result of utilityFunction is true', () => { expect(myModule()).toEqual(1); // FAILS - actual result is 'foo' }); });

This behavior seems really strange to me, because when mocking JUST default imports or JUST named imports, this API works fine. For example, in the case where myModule.js only imports a default import, this is pretty easily done:

/** * Trying to mock just the default import. * THIS WORKS. */ /** /src/myModule.js **/ import mainFunction from './dependency'; // EDIT: Fixed syntax error in code sample // export default myModule() { export default function myModule() { return mainFunction(); } /** /tests/myModule.test.js **/ // If only mainFunction is used by myModule.js import mainFunction from '../src/dependency'; import myModule from '../src/myModule'; jest.mock('../src/dependency'); mainFunction.mockImplementation(() => 1); describe('myModule', () => { it('should return the return value of mainFunction', () => { expect(myModule()).toEqual(1); // Passes }); });

In the case where only the named 'utilityFunction' export is used, its also pretty easy to mock the import:

/** * Trying to mock both named and default import. * THIS WORKS. */ /** /src/myModule.js **/ import { utililtyFunction } from './dependency'; // EDIT: Fixed syntax error in code sample // export default myModule() export default function myModule() { return utilityFunction(); } /** /tests/myModule.test.js **/ // If only utilityFunction is used by myModule.js import { utilityFunction } from '../src/dependency'; import myModule from '../src/myModule'; jest.mock('../src/dependency); utilityFunction.mockImplementation(() => 'bar'); describe('myModule', () => { it('should return the return value of utilityFunction', () => { expect(myModule()).toEqual('bar'); // Passes }); });

Is it possible to mock both the named and default import using Jest? Is there a different syntax that I can use to achieve the result I want, where I import both named and default values from a module and am able to mock them both?

最满意答案

您有语法错误... myModule.js中的默认导出中省略了function关键字。应该是这样的：

import mainFunction, { utilityFunction } from './dependency'; export default function myModule() { if (!utilityFunction()) return 2; return mainFunction(); }

我不确定你是如何通过其他方式进行测试的，但我只是在本地尝试了它并且它通过了。

You have a syntax error ... the function keyword is omitted from the default export in myModule.js. Should look like this:

import mainFunction, { utilityFunction } from './dependency'; export default function myModule() { if (!utilityFunction()) return 2; return mainFunction(); }

I'm not sure how you got the test to run otherwise, but I just tried this out locally and it passed.

更多推荐