fix autoclasses always disabled closes #680

logaretm · Jul 30, 2017 · 7216273 · 7216273
1 parent 340c6ae
commit 7216273
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 15 deletions.
diff --git a/dist/vee-validate.js b/dist/vee-validate.js
@@ -2085,7 +2085,8 @@ Field.prototype.update = function update (options) {
   this.rules = options.rules ? normalizeRules(options.rules) : this.rules;
   this.model = options.model || this.model;
   this.listen = options.listen !== false;
-  this.classNames = options.classNames || this.classNames;
+  this.classes = options.classes || this.classes;
+  this.classNames = options.classNames || this.classNames || DEFAULT_OPTIONS.classNames;
   this.expression = JSON.stringify(options.expression);
   this.alias = options.alias || this.alias;
   this.getter = isCallable(options.getter) ? options.getter : this.getter;
@@ -2100,18 +2101,16 @@ Field.prototype.update = function update (options) {
   this.updated = true;
   // no need to continue.
   if (this.isHeadless) {
-    this.classes = options.classes; // set it for consistency sake.
     return;
   }
 
-  if (options.classes && !this.classes) {
+  if (this.classes) {
     this.updateClasses();
-  } else if (this.classes) {
+  } else {
     // remove them.
     this.unwatch(/class/);
   }
 
-  this.classes = options.classes;
   this.addValueListeners();
   this.updateAriaAttrs();
 };

diff --git a/src/field.js b/src/field.js
@@ -142,7 +142,8 @@ export default class Field {
     this.rules = options.rules ? normalizeRules(options.rules) : this.rules;
     this.model = options.model || this.model;
     this.listen = options.listen !== false;
-    this.classNames = options.classNames || this.classNames;
+    this.classes = options.classes || this.classes || false;
+    this.classNames = options.classNames || this.classNames || DEFAULT_OPTIONS.classNames;
     this.expression = JSON.stringify(options.expression);
     this.alias = options.alias || this.alias;
     this.getter = isCallable(options.getter) ? options.getter : this.getter;
@@ -157,18 +158,13 @@ export default class Field {
     this.updated = true;
     // no need to continue.
     if (this.isHeadless) {
-      this.classes = options.classes; // set it for consistency sake.
       return;
     };
 
-    if (options.classes && !this.classes) {
+    if (this.classes) {
       this.updateClasses();
-    } else if (this.classes) {
-      // remove them.
-      this.unwatch(/class/);
     }
 
-    this.classes = options.classes;
     this.addValueListeners();
     this.updateAriaAttrs();
   }

diff --git a/tests/field.js b/tests/field.js
@@ -1,7 +1,7 @@
 import Field from '../src/field';
 
 test('constructs a headless field with default values', () => {
-  const field = new Field(null);
+  const field = new Field(null, {});
 
   expect(field.id).toBeTruthy(); // has been id'ed.
   expect(field.scope).toBe(null);
@@ -161,14 +161,19 @@ test('it adds class listeners on the input', () => {
     <input name="name" id="name" value="10" type="text">
   `;
   const el = document.querySelector('#name');
-  const field = new Field(el, { classes: true });
+  const field = new Field(el, { classes: false });
 
   // input, blur, focus, and another input.
   expect(field.watchers.length).toBe(4);
   field.addActionListeners(); // Idempotence call.
   expect(field.watchers.length).toBe(4); // still 4
 
+  // if field classes are disabled do not add.
   field.updateClasses();
+  expect(el.classList.contains('untouched')).toBe(false);
+  expect(el.classList.contains('pristine')).toBe(false);
+
+  field.update({ classes: true });
   expect(el.classList.contains('untouched')).toBe(true);
   expect(el.classList.contains('pristine')).toBe(true);
 
@@ -192,7 +197,7 @@ test('it adds class listeners on the input', () => {
   field.addActionListeners(); // Idempotence call.
   expect(field.watchers.length).toBe(4); // back to 4.
   field.update({ classes: false }); // disable classes.
-  expect(field.watchers.length).toBe(2); // they got cleaned up.
+  expect(field.watchers.length).toBe(4); // they remain because of flags.
 });
 
 test('it adds class listeners on components', () => {