Question

15

Jest mocking default exports - require vs import

rated 0 times [ 22] [ 7] / answers: 1 / hits: 83653 / 7 Years ago, wed, november 1, 2017, 12:00:00

I have seen questions referring to the mocking of default exports with jest around here, but I don't think this has already been asked:

When mocking the default export of a dependency of a module that is being tested, the tests suite fails to run if the module imports the dependency with the ES6 import statement, stating TypeError: (0 , _dependency.default) is not a function It succeeds, however, if the module uses a require().default call instead.

In my understanding, import module from location directly translates to const module = require(location).default, so I am very confused why this is happening. I'd rather keep my code style consistent and not use the require call in the original module.

Is there a way to do it?

Test file with mock:

import './modules.js';

import dependency from './dependency';



jest.mock('./dependency', () => {

   return {

      default: jest.fn()

   };

});



// This is what I would eventually like to call

it('calls the mocked function', () => {

   expect(dependency).toHaveBeenCalled();

});

Dependency.js

export default () => console.log('do something');

module.js (not working)

import dependency from './dependency.js';

dependency();

module.js (working)

const dependency = require('./dependency.js').default;

dependency();

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

dayanaracolleeng

Add To Favorites

Follow

Total Points: 7

Total Questions: 96

Total Answers: 104

Location: Mayotte

Member since Mon, Sep 12, 2022

2 Years ago

dayanaracolleeng questions

1 How to Upload file in a directory to minIO bucket

Wed, Jul 20, 22, 00:00, 2 Years ago

1 NextJs router push unknown key passed via urlObject

Sat, Dec 11, 21, 00:00, 3 Years ago

1 Next.js catch-all / as routing

Sun, Jun 27, 21, 00:00, 3 Years ago

1 Getting `Cannot find module '.next\server\pages-manifest.json'` error when trying to add `babel.config.js` in nextjs app

Sun, Mar 14, 21, 00:00, 3 Years ago

1 document.querySelector in Angular

Wed, Jan 27, 21, 00:00, 3 Years ago

View All

answered 7 Years ago deving · Accepted Answer

You can use either es6 import or require js to import your js files in your jest tests.

When using es6 import you should know that jest is trying to resolve all the dependencies and also calls the constructor for the class that you are importing. During this step, you cannot mock it. The dependency has to be successfully resolved, and then you can proceed with mocks.

I should also add that as can be seen here jest by default hoists any jest.mocks to the top of the file so the order in which you place your imports does not really matter.

Your problem though is different. Your mock function assumes that you have included your js file using require js.

jest.mock('./dependecy', () => {

   return {

      default: jest.fn()

   };

});

When you import a file using require js, this is the structure it has:

So assuming I have imported my class called Test using require js, and it has method called doSomething I could call it in my test by doing something like:

const test = require('../Test');

test.default.doSomething();

When importing it using es6 import, you should do it differently though. Using the same example:

import Test from '../Test';

Test.doSomething();

EDIT: If you want to use es6 import change your mock function to:

jest.mock('./dependecy', () => jest.fn());