Explorar o código

fix IE9 class retrieval when both class and :class are present

Evan You %!s(int64=10) %!d(string=hai) anos
pai
achega
3b2038d1cb
Modificáronse 2 ficheiros con 20 adicións e 4 borrados
  1. 18 2
      src/util/dom.js
  2. 2 2
      test/unit/specs/misc_spec.js

+ 18 - 2
src/util/dom.js

@@ -179,6 +179,22 @@ export function off (el, event, cb) {
   el.removeEventListener(event, cb)
 }
 
+/**
+ * For IE9 compat: when both class and :class are present
+ * getAttribute('class') returns wrong value...
+ *
+ * @param {Element} el
+ * @return {String}
+ */
+
+function getClass (el) {
+  var classname = el.className
+  if (typeof classname === 'object') {
+    classname = classname.baseVal || ''
+  }
+  return classname
+}
+
 /**
  * In IE9, setAttribute('class') will result in empty class
  * if the element also has the :class attribute; However in
@@ -209,7 +225,7 @@ export function addClass (el, cls) {
   if (el.classList) {
     el.classList.add(cls)
   } else {
-    var cur = ' ' + (el.getAttribute('class') || '') + ' '
+    var cur = ' ' + getClass(el) + ' '
     if (cur.indexOf(' ' + cls + ' ') < 0) {
       setClass(el, (cur + cls).trim())
     }
@@ -227,7 +243,7 @@ export function removeClass (el, cls) {
   if (el.classList) {
     el.classList.remove(cls)
   } else {
-    var cur = ' ' + (el.getAttribute('class') || '') + ' '
+    var cur = ' ' + getClass(el) + ' '
     var tar = ' ' + cls + ' '
     while (cur.indexOf(tar) >= 0) {
       cur = cur.replace(tar, ' ')

+ 2 - 2
test/unit/specs/misc_spec.js

@@ -396,11 +396,11 @@ describe('Misc', function () {
       components: {
         test: {
           replace: true,
-          template: '<div :class="{\'inner\': true}"></div>'
+          template: '<div class="static-inner" :class="{\'inner\': true}"></div>'
         }
       }
     })
-    expect(vm.$el.firstChild.className).toBe('outer inner')
+    expect(vm.$el.firstChild.className).toBe('static-inner outer inner')
   })
 
   it('SVG class interpolation', function () {