Vee-validate: Only valid and invalid change if use model.prop: selected in custom component select

[KaliaJS]

Versions

• vee-validate: 3.3.0
• vue: 2.6.6

Describe the bug
I'm using select custom component with v-model. When I add model.prop to change the like this :

  model: {
    prop: 'selected',
    event: 'update:selected'
  },

Only the valid and invalid change on vee-validation. Dirty, pristine, etc never change.

Desktop:

• OS: Mac Catalina
• Browser Chrome
• Version 81

[logaretm]

Can you please create an example for it, you can use codesandbox

[KaliaJS]

@logaretm Yes no problem, I'll do it when I've some time.

[KaliaJS]

@logaretm I think I found the problem. I took a codesandbox that you posted here and focused it on the radios (because I also have the problem with the radios). I found that there is the same problem from your code.

Reproduce : If you click on coke or coffe (never the first one). You'll see that "passed" stays false all the time. If on the other hand you click on the first, in our case tea, you will see that Passed returns true. I have the same thing on my project. I did not understand why.

https://codesandbox.io/s/vue-template-52hw0?file=/src/register-vee-validation.js

Is this a bug or did I miss something with passed ?

[logaretm]

Looks like a bug, I will investigate further and see if I can fix it.

[isokosan]

I'm running into the same issue. The changed and dirty fields are not updating unless the first element in the model value is changing. And once changed changes to true it doesn't change back to false when reverting to the initial state.

I forked the sandbox if you'd like to see it in action:
https://codesandbox.io/s/vue-template-forked-c4ok6