[Vuejs]-Why is my Jest mockReturnValue function not invoking? (Using Vue3 and Vue-Test-Utils-Next)

by

0👍

items: jest.fn() makes items a spy. Console output is the one that should be expected, it shows that it’s a function. mockReturnValue has no chance to be not invoked if the test continues. Its result can be seen as:

module.property.items.mockReturnValue([{}, {}, {}])
expect(module.property.items()).toEqual([{}, {}, {}])

Since items is supposed to be an array and not a function, it was mocked the wrong way. This is commonly done by mocking properties directly with no jest.mock performed on this module:

module.property = [{}, {}, {}]

It should be additionally guaranteed that changed value won’t affect other tests, e.g. by doing this in jest.isolateModules to reimport a hierarchy of affected modules.

This can be done with Jest spies as well but requires to keep a reference to getter function to access it easily:

export const property = {
  items: null,
};

export const mockPropertyItems = jest.spyOn(property, 'items', 'get');

And used as:

module.mockPropertyItems.mockReturnValue([{}, {}, {}])
expect(module.property.items).toEqual([{}, {}, {}])

Also importing directly from __mocks__ is wrong, mocked module should be imported from its regular location.

Leave a comment