feat(validator): add 'initial' option

Closes #58

src/directives/validate.js

@@ -190,7 +190,8 @@ export default function (Vue) {
         if (_.isPlainObject(val)) {
           if ('rule' in val) {
             let msg = 'message' in val ? val.message : null
-            this.validation.setValidation(key, val.rule, msg)
+            let initial = 'initial' in val ? val.initial : null
+            this.validation.setValidation(key, val.rule, msg, initial)
           }
         } else {
           this.validation.setValidation(key, val)

src/validations/base.js

@@ -61,7 +61,7 @@ export default class BaseValidation {
     this._unwatch && this._unwatch()
   }
 
-  setValidation (name, arg, msg) {
+  setValidation (name, arg, msg, initial) {
     let validator = this._validators[name]
     if (!validator) {
       validator = this._validators[name] = {}
@@ -72,6 +72,11 @@ export default class BaseValidation {
     if (msg) {
       validator.msg = msg
     }
+
+    if (initial) {
+      validator.initial = initial
+      validator._isNoopable = true
+    }
   }
 
   willUpdateFlags (touched = false) {
@@ -150,6 +155,12 @@ export default class BaseValidation {
         return done()
       }
 
+      if (descriptor._isNoopable) {
+        results[name] = false
+        descriptor._isNoopable = null
+        return done()
+      }
+
       if (validator) {
         let value = this._getValue(this._el)
         this._invokeValidator(this._vm, validator, value, descriptor.arg, (ret, err) => {
@@ -206,6 +217,11 @@ export default class BaseValidation {
   }
 
   reset () {
+    each(this._validators, (descriptor, key) => {
+      if (descriptor.initial && !descriptor._isNoopable) {
+        descriptor._isNoopable = true
+      }
+    })
     this.resetFlags()
     this._init = this._getValue(this._el)
   }

test/specs/directives/validate.js

@@ -817,7 +817,7 @@ describe('validate directive', () => {
         vm.$nextTick(done)
       })
 
-      it('should not run validation', (done) => {
+      it('should be validated', (done) => {
         let field = el.getElementsByTagName('input')[0]
 
         // default

test/specs/index.js

@@ -31,4 +31,5 @@ require('./radio')
 require('./select')
 require('./reset')
 require('./validate')
+require('./initial')
 require('./async')

test/specs/initial.js

@@ -0,0 +1,83 @@
+import assert from 'power-assert'
+import Vue from 'vue'
+import { trigger } from '../../src/util'
+
+
+describe('initial', () => {
+  let el, vm
+
+  beforeEach((done) => {
+    el = document.createElement('div')
+    el.innerHTML = '<validator name="validator1">'
+      + '<form novalidate>'
+      + '<input type="number" v-validate:field1="{ required: { rule: true, initial: \'off\' }, min: 0, max: 10 }">'
+      + '<input type="text" value="hello" v-validate:field2="{ minlength: 4 }">'
+      + '</form>'
+      + '</validator>'
+    vm = new Vue({ el: el })
+    vm.$nextTick(done)
+  })
+
+  it('should be validated', (done) => {
+    assert(vm.$validator1.field1.required === false)
+    assert(vm.$validator1.field1.min === false)
+    assert(vm.$validator1.field1.max === false)
+    assert(vm.$validator1.field1.valid === true)
+    assert(vm.$validator1.field1.dirty === false)
+    assert(vm.$validator1.field1.modified === false)
+    assert(vm.$validator1.field1.touched === false)
+    assert(vm.$validator1.field2.minlength === false)
+    assert(vm.$validator1.field2.valid === true)
+    assert(vm.$validator1.field2.dirty === false)
+    assert(vm.$validator1.field2.modified === false)
+    assert(vm.$validator1.field2.touched === false)
+    assert(vm.$validator1.valid === true)
+    assert(vm.$validator1.dirty === false)
+    assert(vm.$validator1.modified === false)
+    assert(vm.$validator1.touched === false)
+
+    let field1 = el.getElementsByTagName('input')[0]
+    trigger(field1, 'blur')
+    vm.$nextTick(() => {
+      assert(vm.$validator1.field1.required)
+      assert(vm.$validator1.field1.min === false)
+      assert(vm.$validator1.field1.max === false)
+      assert(vm.$validator1.field1.valid === false)
+      assert(vm.$validator1.field1.dirty === false)
+      assert(vm.$validator1.field1.modified === false)
+      assert(vm.$validator1.field1.touched === true)
+      assert(vm.$validator1.field2.minlength === false)
+      assert(vm.$validator1.field2.valid === true)
+      assert(vm.$validator1.field2.dirty === false)
+      assert(vm.$validator1.field2.modified === false)
+      assert(vm.$validator1.field2.touched === false)
+      assert(vm.$validator1.valid === false)
+      assert(vm.$validator1.dirty === false)
+      assert(vm.$validator1.modified === false)
+      assert(vm.$validator1.touched === true)
+
+      field1.value = '11'
+      trigger(field1, 'input')
+      vm.$nextTick(() => {
+        assert(vm.$validator1.field1.required === false)
+        assert(vm.$validator1.field1.min === false)
+        assert(vm.$validator1.field1.max === true)
+        assert(vm.$validator1.field1.valid === false)
+        assert(vm.$validator1.field1.dirty === true)
+        assert(vm.$validator1.field1.modified === true)
+        assert(vm.$validator1.field1.touched === true)
+        assert(vm.$validator1.field2.minlength === false)
+        assert(vm.$validator1.field2.valid === true)
+        assert(vm.$validator1.field2.dirty === false)
+        assert(vm.$validator1.field2.modified === false)
+        assert(vm.$validator1.field2.touched === false)
+        assert(vm.$validator1.valid === false)
+        assert(vm.$validator1.dirty === true)
+        assert(vm.$validator1.modified === true)
+        assert(vm.$validator1.touched === true)
+
+        done()
+      })
+    })
+  })
+})