test for v-class

src/directives/class.js

@@ -1,3 +1,4 @@
+var _ = require('../util')
 var hasClassList =
   typeof document !== 'undefined' &&
   'classList' in document.documentElement
@@ -9,16 +10,11 @@ var hasClassList =
  * @param {Strong} cls
  */
 
-function addClass (el, cls) {
-  if (hasClassList) {
-    el.classList.add(cls)
-  } else {
-    var cur = ' ' + el.className + ' '
-    if (cur.indexOf(' ' + cls + ' ') < 0) {
-      el.className = (cur + cls).trim()
+var addClass = hasClassList
+  ? function (el, cls) {
+      el.classList.add(cls)
     }
-  }
-}
+  : _.addClass
 
 /**
  * remove class for IE9
@@ -27,18 +23,11 @@ function addClass (el, cls) {
  * @param {Strong} cls
  */
 
-function removeClass (el, cls) {
-  if (hasClassList) {
-    el.classList.remove(cls)
-  } else {
-    var cur = ' ' + el.className + ' '
-    var tar = ' ' + cls + ' '
-    while (cur.indexOf(tar) >= 0) {
-      cur = cur.replace(tar, ' ')
+var removeClass = hasClassList
+  ? function (el, cls) {
+      el.classList.remove(cls)
     }
-    el.className = cur.trim()
-  }
-}
+  : _.removeClass
 
 module.exports = function (value) {
   if (this.arg) {

src/util/dom.js

@@ -135,4 +135,34 @@ exports.on = function (el, event, cb) {
 
 exports.off = function (el, event, cb) {
   el.removeEventListener(event, cb)
+}
+
+/**
+ * Compatibility add class for IE9
+ *
+ * @param {Element} el
+ * @param {Strong} cls
+ */
+
+exports.addClass = function (el, cls) {
+  var cur = ' ' + el.className + ' '
+  if (cur.indexOf(' ' + cls + ' ') < 0) {
+    el.className = (cur + cls).trim()
+  }
+}
+
+/**
+ * Compatibility remove class for IE9
+ *
+ * @param {Element} el
+ * @param {Strong} cls
+ */
+
+exports.removeClass = function (el, cls) {
+  var cur = ' ' + el.className + ' '
+  var tar = ' ' + cls + ' '
+  while (cur.indexOf(tar) >= 0) {
+    cur = cur.replace(tar, ' ')
+  }
+  el.className = cur.trim()
 }

test/unit/specs/directives/class_spec.js

@@ -0,0 +1,40 @@
+var _ = require('../../../../src/util')
+var def = require('../../../../src/directives/class')
+
+if (_.inBrowser) {
+  describe('v-class', function () {
+
+    var el
+    beforeEach(function () {
+      el = document.createElement('div')
+    })
+
+    it('with className', function () {
+      el.className = 'haha'
+      var dir = {
+        el: el,
+        arg: 'test',
+        update: def
+      }
+      dir.update(true)
+      expect(el.className).toBe('haha test')
+      dir.update(false)
+      expect(el.className).toBe('haha')
+    })
+
+    it('without className', function () {
+      el.className = 'haha'
+      var dir = {
+        el: el,
+        update: def
+      }
+      dir.update('test')
+      expect(el.className).toBe('haha test')
+      dir.update('what')
+      expect(el.className).toBe('haha what')
+      dir.update()
+      expect(el.className).toBe('haha')
+    })
+
+  })
+}

test/unit/specs/util/dom_spec.js

@@ -101,5 +101,18 @@ if (_.inBrowser) {
       expect(spy.calls.count()).toBe(1)
       document.body.removeChild(target)
     })
+
+    it('addClass/removeClass', function () {
+      var el = document.createElement('div')
+      el.className = 'aa bb cc'
+      _.removeClass(el, 'bb')
+      expect(el.className).toBe('aa cc')
+      _.removeClass(el, 'aa')
+      expect(el.className).toBe('cc')
+      _.addClass(el, 'bb')
+      expect(el.className).toBe('cc bb')
+      _.addClass(el, 'bb')
+      expect(el.className).toBe('cc bb')
+    })
   })
 }