Триггерное событие в Jest Test не вызывает метод

Question

В настоящее время я пишу тесты для моего приложения Vue. У меня есть кнопка, которая вызывает функцию выхода из системы. Я просто хочу проверить, вызывается ли функция при нажатии кнопки.

Я пытался смоделировать функцию с помощью jest.fn (), но не могу заставить ее работать. Я также попытался вызвать метод и поместить в него console.log, но этот журнал не вызывался. Что я делаю не так?

это мои настройки оболочки:

let wrapper;

beforeEach(() => {
    Vue.use(Vuetify);
    Vue.prototype.$router = new VueRouter();
    wrapper = shallowMount(Navigation);
});

afterEach(() => {
    wrapper.destroy();
});

it('should call logout function on button click', function() {
        let submitLogoutMock = jest.fn();
        wrapper.vm.submitLogout = submitLogoutMock;

        wrapper
            .find('#logout-button')
            .trigger('click');

        expect(submitLogoutMock).toHaveBeenCalled();
    });

Я ожидаю вызова вызываемого метода, но на самом деле я получаю сообщение об ошибке:

Error: expect(jest.fn()).toHaveBeenCalled()

Expected mock function to have been called, but it was not called.

Answer 1

При использовании shallowMount методы компонента должны быть заглушены. Вы можете достичь этого при создании оболочки или с помощью setMethods().

. Вам нужно только изменить свой юнит-тест:

  it('should call logout function on button click', () => {
    const submitLogoutMock = jest.fn();
    wrapper.setMethods({ submitLogout: submitLogoutMock });

    wrapper.find('#logout-button').trigger('click');

    expect(submitLogoutMock).toHaveBeenCalled();
  });