Я пытался проверить кнопку подтверждения, используя jest и vue -test-utils. Я использую метод debounce для обработки случайного двойного щелчка.
Я пытался использовать jest.useFakeTimers () и jest.runOnlyPendingTimers (), но я до сих пор не вижу изменения текста моей кнопки в моем тесты. Я создал отдельный тестовый файл ниже - любой совет о том, что я делаю здесь, будет с благодарностью!
import { shallowMount, createLocalVue } from '@vue/test-utils'
import _ from 'lodash'
jest.useFakeTimers()
const myComponent = {
data(){
return {
confirming: false
}
},
computed: {
state(){
return this.confirming ? 'are you sure?' : 'default'
}
},
template: `<div @click="changeState">{{ state }}</div>`,
methods: {
changeState(){
this.doConfirm()
},
doConfirm: _.debounce(function(){
if(!this.confirming){
this.confirming = true
}else{
this.confirming = false
}
}, 500)
}
}
describe('Testing debounce methods', () => {
let $wrapper
beforeEach(() => {
$wrapper = shallowMount(myComponent)
})
test('Check default state', () => {
expect($wrapper.text()).toContain('default')
})
test('Check state changes with click', () => {
$wrapper.trigger('click')
jest.runOnlyPendingTimers()
expect($wrapper.text()).toContain('are you sure?')
})
})