Начал изучать тему unit тестирования Vue компонентов. Использую Jest.
Появился затык с одни тестом, никак не могу понять в чем дело.
Хочу протестировать вызов функции в компоненте, при клике на определенный элемент.
<template>
<li
class="message"
style="margin-top: 10px"
@click="handleClick"
>
{{ message }}
</li>
</template>
При прямом вызове функции тест срабатывает, но при клике - падает, так как функция почему то не вызывается. При этом во время реального клика - все ок.
import { mount } from "@vue/test-utils";
import Message from "@/components/Message.vue";
describe("Message.test.js", () => {
let wrapper;
const createWrapper = propsData => mount(Message, { propsData });
describe("Events", () => {
beforeEach(() => {
wrapper = createWrapper({ message: "Cat" });
});
//Работает -функция вызывается напрямую
it("calls handleClick", () => {
const spy = jest.spyOn(wrapper.vm, 'handleClick');
wrapper.vm.handleClick();
expect(spy).toHaveBeenCalled();
});
//Падает
it("calls handleClick when click on message", () => {
const spy = jest.spyOn(wrapper.vm, 'handleClick');
expect(wrapper.contains('.message')).toBe(true);
wrapper.find('.message').trigger('click');
expect(spy).toHaveBeenCalledTimes(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')
})
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
Я написал кусочек js скрипта, чтобы добавлять теги по нажатию, с проверкой на существующие элементы, а теперь хочу удалять по отжатию, но не понимаю...
Можно ли найти объект в памяти, если я его никуда (например в массив) не сохраняюКод: