Исходная ошибка, которую я получил, была
"Свойство или метод ANALYTICS
не определены в экземпляре, но на него ссылаются во время рендеринга. Убедитесь, что это свойство является реактивным, либо в параметре данных, либо для компонентов на основе классов, инициализируя свойство."
и
"Uncaught TypeError: Невозможно прочитать свойство ITEM
из неопределенного при событии щелчка ...."
По сути это означает, что я не определял ANALYTICS ни в PageFooter (потому что это тупой компонент, я не хотел добавлять объект данных к нему, я хотел сохранить его строго презентационным), либо в экземпляре vue в корне уровень. Поскольку ANALYTICS не определена, ITEM затем выдает еще одну ошибку, поскольку она не может быть свойством undefined.
Это мое решение, я использовал регистр переключателей в добавленном теге и в шаблоне @ click = "selectLink ('asd') "
methods: {
selectLink (str) {
switch (true) {
case str === 'asd':
this.logButtonClick(ANALYTICS.ITEM)
break
case str === 'efg':
this.logButtonClick(ANALYTICS.ITEM2)
break
case str === 'hij':
this.logButtonClick(ANALYTICS.ITEM3)
break
}
}
}
и модульный тест:
it('[positive] should track analytics if `asd` is passed to selectLink()', () => {
const str = 'asd'
const mockFn = jest.fn()
jest.spyOn(wrapper.vm, 'logButtonClick')
wrapper.find('a').trigger('click')
mockFn(str)
expect(wrapper.vm.logButtonClick).toHaveBeenCalledWith(ANALYTICS.COOKIE_CONSENT)
})
https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties
Мораль истории, вопросы, когда старшие инженеры советуют вам сделать что-то забавное в обзоре кода.