我正在为组件中的vuelidate
个验证编写单元测试.我发现$touch()
方法是异步调用的,所以expect()
需要使用$nextTick()
.当我需要两个nextTick()s
换两个expect()s
时,问题就出现了.
describe('Validations', () => {
let data
let myComponent
beforeEach(() => {
data = () => {
propertyABC = 'not allowed value'
}
myComponent = localVue.component('dummy', {template: '<div></div>', validations, data})
it('Properly validates propertyABC', (done) => {
Vue.config.errorHandler = done
let wrapper = mount(myComponent, {localVue})
wrapper.vm.$v.$touch()
wrapper.vm.$nextTick(() => {
expect(wrapper.vm.$v.propertyABC.$error).to.be.true
# fails, because propertyABC === 'allowed value', adn thus $error is false
done()
}
wrapper.vm.propertyABC = 'allowed value'
wrapper.vm.$v.propertyABC.$touch()
wrapper.vm.$nextTick(() => {
expect(wrapper.vm.$v.proprtyABC.$error).to.be.false
done()
}
})
})
如何运行此测试而不将其拆分为两个单独的测试?我认为嵌套$nextTick()
可能有效,但对于更大量的测试来说,这是不灵活的.