In what order vee-validate works with validator? (Sync and Async)

Question

Beeing new to Vue.js and VeeValidate I was wondering in what order validator functions (rules) associated to a field were validated? (as the doc doesn't really mention it)

I was used to Angular docs about validator function and want to know if sync validator are called before async ones.

Answer 1

After looking at VeeValidate 2.0.9 source code about validator.js starting line 649 we can note a _validate method that will (roughly):

1. Create an Array with the field rules using Object.keys then do a some on it

2. Use the _test method and store the result (that is directly the result of the validation or a Promise)

3. Stack async (and sync if a fastExit property is false on this Validator instance) validators (Promise) in an array with a push

4. Exit if an error occur on a sync validator (with the fastExit property)

5. reduce the Array containing all of the results to return a final result with errors stacked

So quoting MDN about the Object.keys method:

The Object.keys() method returns an array of a given object's property names, in the same order as we get with a normal loop.

And to quote another stackoverflow answer:

Quoting John Resig:

Currently all major browsers loop over the properties of an object in the order in which they were defined. Chrome does this as well, except for a couple cases. [...] This behavior is explicitly left undefined by the ECMAScript specification. In ECMA-262, section 12.6.4:

The mechanics of enumerating the properties ... is implementation dependent.

However, specification is quite different from implementation. All modern implementations of ECMAScript iterate through object properties in the order in which they were defined. Because of this the Chrome team has deemed this to be a bug and will be fixing it.

Conclusion

The final order will be dependent of the browser implementation of Object.keys, so mostly by the order of definition of the validators but could also be alphabetically!

By default the fastExit property is false but could be overwritten in the validator options. This option will take the first false result from sync validators and return it's errors. If not set the result will be a compilation of all errors after the verification of every validators.