vee-validate: [Vue warn]: Error in directive validate bind hook: "TypeError: Cannot read property '$scopedSlots' of undefined"
Essentially, I’m just mounting a component that has children with v-validate
prop on a test.
Once I remove the v-validate
prop from the children, the test passes just fine.
Any idea why that happens?
Edit:
Reproducing is possible here: https://github.com/jourdanrodrigues/v-validate-issue. I’m having this issue on a MacOS Mohave and Ubuntu/Alpine (Docker) and VeeValidate 2.2.x.
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Reactions: 8
- Comments: 28 (4 by maintainers)
Use
sync: false
property in options, while mounting component.Hi, are there any updates on this issue? I am seeing a similar error using Vuetify. If I have a form like this …
<v-form v-model="isFormValid"> <!-- Layout and inputs removed for brevity --> </v-form>
… where
isFormValid
is just a Boolean property then I get the following error in my unit tests:[Vue warn]: Error in v-on handler: "TypeError: Cannot read property '$scopedSlots' of undefined"
If I remove the
v-model="isFormValid"
directive the test starts passing.In previous versions of vue-jest, they were trying to handle component syncing themselves, if you wanted to disable it you added the
sync: false
option, but that had many inconsistences (like the issues with the $scopedSlots).In recent versions of vue-jest they no longer sync actions, that means that we, the developers, need to make sure to await any async functions now like clicking or setting a field value, also waiting for $nextTick if necessary.
Hope it helps.
Hope it helps. Had same issue and it blown my mind.
First I tried to debug my code but it wasn’t possible so I removed code one by one and tested it one by one and found that there is some issue with the concatenation. Following code is many places so it’s hard to get the exact issue.
Buggy code:
Corrected code: