使用vue/test-utils測驗表單輸入域與data的系結,通過wrapper.vm 獲取data form物件,并修改, 但是通過wrapper.find().element.value得到的值還是初始值
<input id="username" type="text" class="form-control" v-model="form.username">
.
.
export default {
name: 'RegisterPage',
data: function () {
return {
form: {
username: '',
emailAddress: '',
password: ''
},
errorMessage: ''
}
}
}
</script>
import { mount } from '@vue/test-utils'
import RegisterPage from '../../src/views/RegisterPage'
describe('RegisterPage.vue', () => {
let wrapper
let fieldUsername
let fieldEmailAddress
let fieldPassword
let submitButton
beforeEach(() => {
wrapper = mount(RegisterPage)
fieldPassword = wrapper.find('#password')
fieldUsername = wrapper.find('#username')
fieldEmailAddress = wrapper.find('#emailAddress')
submitButton = wrapper.find('form button[type="submit"]')
})
it('should have form inputs bound with the data model ', () => {
const username = 'username'
const password = 'password'
const email = 'email'
wrapper.vm.form.username = username
wrapper.vm.form.password = password
wrapper.vm.form.emailAddress = email
expect(fieldEmailAddress.element.value).toEqual(email)
expect(fieldUsername.element.value).toEqual(username)
expect(fieldPassword.element.value).toEqual(password)
})
})
expect(received).toEqual(expected) // deep equality
Expected: "email"
Received: ""
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/10602.html
標籤:JavaScript
上一篇:Antv g2在多個view并存的情況下啟用view-zoom縮放
下一篇:敲DOM編程藝術沒反應 求查錯
