Vee-validate: Initial value validation (.initial) not working on select element

[ThomHurks]

Versions:

• VueJs: 2.4.2
• Vee-Validate: 2.0.0-rc.14

Description:

Initial value validation (the .initial modifier) does not seem to work on select elements.

Steps To Reproduce:

Observe this very simple numeric input box: https://jsfiddle.net/o1env7mq/2/
It has an initial value, and a validation rule using the .initial modifier. The field is correctly validated and no error is shown as a value is present.

Now observe this almost identical example that instead uses a select element: https://jsfiddle.net/kcuL61vk/8/
It has the same initial value as before and the validation rule is the same as before. The field is not correctly validated and an error is shown even though a value is present.

[logaretm]

This was a tricky one to fix, for whatever reason the select input value isn't ready until sometime after the bind cycle for the directive. So .value and selectedOptions weren't accurate that early. It only happens with select inputs with v-model that isn't watchable by the $watch API (simple dot expressions) as far as I have tested.

I have patched this by attempting the get the model value from the v-model directive present on the vnode which should have the value ready, this is ideal as the validator will try to look for that first and if it cannot find it then it will fallback to how it used to resolve things.

[ThomHurks]

Nice! I tried to debug this issue for a bit, and I also noticed that the input value wasn't present during the phase where it's attached; I figured this would be tricky to fix. Great job that you did it! Can confirm that it works now :)