在测试环境中,将vue-test-utils
更新到1.0.0-beta.26
或更高版本后,keydown事件不再由keyCode触发,例如:
Vue
<div @keydown="onKeydown"></div>
脚本
public onKeydown (event: KeyboardEvent) {
if(event.keyCode === 13) {
this.keyName = 'enter'
} else if(event.keyCode === 67) {
this.keyName = 'c'
}
}
之前的版本,都是以keyCode为参数测试PASS。
// version 1.0.0-beta.25
const wrapper = shallowMount(HelloWorld)
wrapper.find('div').trigger('keydown', { keyCode: 13 })
expect(wrapper.vm.keyName).toBe('enter') // PASS
wrapper.find('div').trigger('keydown', { keyCode: '67' })
expect(wrapper.vm.keyName).toBe('c') // PASS
版本更新后,我的测试现在失败了。
尝试使用keydown.enter
,它适用于enter
键,但不适用于“c”键。
// version 1.0.0-beta.26
wrapper.find('div').trigger('keydown.enter')
expect(wrapper.vm.keyName).toBe('enter') // PASS
wrapper.find('div').trigger('keydown.c')
expect(wrapper.vm.keyName).toBe('c') // FAILED
有什么建议如何使用 a-z
键触发 keydown 事件吗?
最佳答案
您应该将key
作为选项传递。来自 official docs
it('Magic character "a" sets quantity to 13', () => {
const wrapper = mount(QuantityComponent)
wrapper.trigger('keydown', {
key: 'a'
})
expect(wrapper.vm.quantity).toBe(13)
})
关于keydown - Vue Test Utils,测试中的 keyCode 不再触发 Keydown 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56018576/