Не удалось выполнить jHest toHaveBeenCalled () в компоненте Vue

Question

Не работает вызов функции с триггером «щелчка» в тесте.

1. Я вызвал функцию - она ​​работает

2. Я нажал кнопку, но проверка не прошла.

   describe("Message.test.js", () => {
       let wrapper;
       const createWrapper = propsData => mount(Message, { propsData 
   
       describe("Events", () => {
           beforeEach(() => {
            wrapper = createWrapper({ message: "Cat" });
       }); 
   
       //Working
       it("calls handleClick", () => {
           const spy = jest.spyOn(wrapper.vm, 'handleClick');
           wrapper.vm.handleClick();
           expect(spy).toHaveBeenCalled();
       });
   
       //NOT WORKING. WHY?
   
       it("calls handleClick when click on message", () => {
           wrapper.vm.handleClick = jest.fn();
           //It is Ok
           expect(wrapper.contains('.message')).toBe(true);
           // @click="handleClick" on element
           wrapper.find('.message').trigger('click');
           expect(wrapper.vm.handleClick).toHaveBeenCalledTimes(1);
       })
   });
   

Я добавил console.log к функции.Во время теста я вижу, какая функция была вызвана.

Answer 1

 it('calls handleClick when click on message', () => {
            const handleClick = jest.fn()
            wrapper.setMethods({ handleClick })
            const el = wrapper.find('.message').trigger('click')
            expect(handleClick).toBeCalled()
        })
// stub
        it('triggers a message-clicked event when a handleClick method is called', () => {
            const stub = jest.fn()
            wrapper.vm.$on('message-clicked', stub)
            wrapper.vm.handleClick()
            expect(stub).toBeCalledWith('Cat')
        })