Home > front end >  Vue v - model test
Vue v - model test

Time:11-29

using the vue/test - utils test form input field and the data binding, through the wrapper. The vm to obtain data, the form object, and modify, but through the wrapper. The find (). Get the value of the element. The value is the initial value

.
.
Export the default {
Name: 'RegisterPage'
Data: the function () {
Return {
Form: {
The username: '
EmailAddress: "'
Password: "'
},
ErrorMessage: "'
}
}
}
</script>

Import {mount} from '@ vue/test - utils'
The import RegisterPage from '../../SRC/views/RegisterPage '
Describe (' RegisterPage. Vue '()=& gt; {
Let wrapper
Let fieldUsername
Let fieldEmailAddress
Let fieldPassword
Let submitButton
BeforeEach (()=& gt; {
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 the form inputs bound with the data model ', ()=& gt; {
Const username='username'
Const password='password'
Const email='email'
Wrapper. Vm. Form. The username=username
Wrapper. Vm. Form. The password=password
Wrapper. Vm. Form. EmailAddress=email
Expect (fieldEmailAddress. Element. The value). ToEqual (email)
Expect (fieldUsername. Element. The value). ToEqual (username)
Expect (fieldPassword. Element. The value). ToEqual (password)
})
})


Expect (received). ToEqual (expected)//deep equality,

Expected, "email"
Received: ""
  • Related