add warning for camelCase paramAttributes (vuejs#625)

yyx990803 · yyx990803 · commit 0894903ec505 · 2014-12-08T16:09:35.000-05:00
diff --git a/src/compiler/compile.js b/src/compiler/compile.js
@@ -333,6 +333,15 @@ function compileParamAttributes (el, attrs, options) {
   var name, value, param
   while (i--) {
     name = attrs[i]
+    if (/[A-Z]/.test(name)) {
+      _.warn(
+        'You seem to be using camelCase for a paramAttribute, ' +
+        'but HTML doesn\'t differentiate between upper and ' +
+        'lower case. You should use hyphen-delimited ' +
+        'attribute names. For more info see ' +
+        'http://vuejs.org/api/options.html#paramAttributes'
+      )
+    }
     value = el.getAttribute(name)
     if (value !== null) {
       param = {
diff --git a/test/unit/specs/compiler/compile_spec.js b/test/unit/specs/compiler/compile_spec.js
@@ -149,7 +149,7 @@ if (_.inBrowser) {
 
     it('param attributes', function () {
       var options = merge(Vue.options, {
-        paramAttributes: ['a', 'data-some-attr', 'some-other-attr', 'invalid']
+        paramAttributes: ['a', 'data-some-attr', 'some-other-attr', 'invalid', 'camelCase']
       })
       var def = Vue.options.directives['with']
       el.setAttribute('a', '1')
@@ -165,8 +165,8 @@ if (_.inBrowser) {
       expect(args[1]).toBe(el)
       expect(args[2].arg).toBe('someAttr')
       expect(args[3]).toBe(def)
-      // invalid should've warn
-      expect(_.warn).toHaveBeenCalled()
+      // invalid and camelCase should've warn
+      expect(_.warn.calls.count()).toBe(2)
       // literal should've called vm.$set
       expect(vm.$set).toHaveBeenCalledWith('a', '1')
       expect(vm.$set).toHaveBeenCalledWith('someOtherAttr', '2')
