How to mock a function/method in Vue 3 with Vue Test Utils 2?

Question

I am in the process of converting my project from Vue 2 to 3 and also testing library to Vue test utils 2. Before, mocking methods works like magic:

export default {
  methods: {
    greet(text) {
      sayHello('hello world')
    },
    sayHello(text) {
      console.log(text)
    }
  }
}

test('should sample', async () => {
  const spy = jest.spyOn(wrapper.vm, 'sayHello')
  wrapper.vm.greet('hello world')
  expect(spy).toHaveBeenCalledWith('hello world')
})

I tried converting it to composition api:

export default defineComponent({
  setup() {
    function greet(text) {
      sayHello(text)
    }

    function sayHello(text) {
      console.log(text)
    }

    return {
      greet,
      sayHello
    }
  }
})

and now testing is not working at all

expect(jest.fn()).toHaveBeenCalledWith(...expected)

Expected: "hello world"

Number of calls: 0

How do I mock functions that call another functions in Vue 3 + Vue test utils 2?

Koulgar · Accepted Answer · 2022-08-09 22:39:10Z

0

you should create your spy functions before the wrapper instance is created (where you use mount or shallowMount). Creating spies before creating instance and using

beforeEach(() => {
  jest.resetAllMocks();
})

in order to reset mocks for following cases should do the trick.

answered Aug 9, 2022 at 22:39

Koulgar

11 bronze badge

Sign up to request clarification or add additional context in comments.

Comments

Kevin Mendez · Accepted Answer · 2023-02-06 17:22:14Z

0

Read this: https://github.com/vuejs/vue-test-utils/issues/1951#issuecomment-1019091217

lmiller1990 says that we don't possibly modify values inside of the setup.

answered Feb 6, 2023 at 17:22

Kevin Mendez

6685 silver badges11 bronze badges

Collectives™ on Stack Overflow

How to mock a function/method in Vue 3 with Vue Test Utils 2?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related