Procházet zdrojové kódy

IE should prefer all bound props other than class

fergaldoyle před 10 roky
rodič
revize
1d85fcbd35
3 změnil soubory, kde provedl 44 přidání a 9 odebrání
  1. 1 0
      package.json
  2. 35 8
      src/compiler/compile-props.js
  3. 8 1
      test/unit/specs/misc_spec.js

+ 1 - 0
package.json

@@ -42,6 +42,7 @@
     "karma-commonjs": "^0.0.13",
     "karma-coverage": "^0.5.0",
     "karma-firefox-launcher": "^0.1.6",
+    "karma-ie-launcher": "^0.2.0",
     "karma-jasmine": "^0.3.6",
     "karma-phantomjs-launcher": "^0.2.1",
     "karma-safari-launcher": "^0.1.1",

+ 35 - 8
src/compiler/compile-props.js

@@ -8,6 +8,15 @@ var empty = {}
 var identRE = require('../parsers/path').identRE
 var settablePathRE = /^[A-Za-z_$][\w$]*(\.[A-Za-z_$][\w$]*|\[[^\[\]]+\])*$/
 
+// feature detect browsers (IE) that have trouble
+// with binding syntax on certain attributes
+var div, preferBinding
+if (_.inBrowser) {
+  div = document.createElement('div')
+  div.setAttribute(':title', '')
+  preferBinding = div.getAttribute('title') !== null
+}
+
 /**
  * Compile props on a root element and return
  * a props link function.
@@ -21,7 +30,7 @@ module.exports = function compileProps (el, propOptions) {
   var props = []
   var names = Object.keys(propOptions)
   var i = names.length
-  var options, name, attr, value, path, parsed, prop, isTitleBinding
+  var options, name, attr, value, path, parsed, prop, hasBinding
   while (i--) {
     name = names[i]
     options = propOptions[name] || empty
@@ -50,16 +59,12 @@ module.exports = function compileProps (el, propOptions) {
       mode: propBindingModes.ONE_WAY
     }
 
-    // IE title issues
-    isTitleBinding = false
-    if (name === 'title' && (el.getAttribute(':title') || el.getAttribute('v-bind:title'))) {
-      isTitleBinding = true
-    }
+    attr = _.hyphenate(name)
+    hasBinding = preferBinding && checkBindingAttr(el, attr) !== null
 
     // first check literal version
-    attr = _.hyphenate(name)
     value = prop.raw = _.attr(el, attr)
-    if (value === null || isTitleBinding) {
+    if (value === null || hasBinding) {
       // then check dynamic version
       if ((value = _.getBindAttr(el, attr)) === null) {
         if ((value = _.getBindAttr(el, attr + '.sync')) !== null) {
@@ -119,6 +124,28 @@ module.exports = function compileProps (el, propOptions) {
   return makePropsLinkFn(props)
 }
 
+/**
+ * Check existance of an attribute with binding syntax.
+ *
+ * @param {Element} el
+ * @return {String} attr
+ */
+
+function checkBindingAttr (el, attr) {
+  if (attr === 'class') {
+    return null
+  }
+
+  return (
+    el.getAttribute(':' + attr) ||
+    el.getAttribute(':' + attr + '.once') ||
+    el.getAttribute(':' + attr + '.sync') ||
+    el.getAttribute('v-bind:' + attr) ||
+    el.getAttribute('v-bind:' + attr + '.once') ||
+    el.getAttribute('v-bind:' + attr + '.sync')
+  )
+}
+
 /**
  * Build a function that applies props to a vm.
  *

+ 8 - 1
test/unit/specs/misc_spec.js

@@ -270,7 +270,7 @@ describe('Misc', function () {
     expect(hasWarned(__, 'Unknown custom element')).toBe(true)
   })
 
-  it('prefer bound title over static title', function (done) {
+  it('prefer bound attributes over static attributes', function (done) {
     var el = document.createElement('div')
     var count = 0
     var expected = [
@@ -289,6 +289,13 @@ describe('Misc', function () {
     }
 
     document.body.appendChild(el)
+    
+    el.setAttribute(':title', '')
+    if(el.getAttribute('title') === null) {
+      // this browser does not need this test
+      done()
+      return
+    }
 
     new Vue({
       el: el,