[weex] convert kebab-case attribute name to camelCase in compiler (vuejs#4964)

Hanks10100 · yyx990803 · commit 3e523e6d5726 · 2017-02-18T19:36:00.000-05:00
* [weex] add test case for camelize props

* [weex] add test case for append props

* [weex] camelize component attribute name

* [weex] more reliable camelize functions
diff --git a/src/platforms/weex/compiler/modules/append.js b/src/platforms/weex/compiler/modules/append.js
@@ -1,6 +1,6 @@
 /* @flow */
 
-function transformNode (el: ASTElement, options: CompilerOptions) {
+function preTransformNode (el: ASTElement, options: CompilerOptions) {
   if (el.tag === 'cell' && !el.attrsList.some(item => item.name === 'append')) {
     el.attrsMap.append = 'tree'
     el.attrsList.push({ name: 'append', value: 'tree' })
@@ -16,6 +16,6 @@ function genData (el: ASTElement): string {
 
 export default {
   staticKeys: ['appendAsTree'],
-  transformNode,
+  preTransformNode,
   genData
 }
diff --git a/src/platforms/weex/compiler/modules/index.js b/src/platforms/weex/compiler/modules/index.js
@@ -1,9 +1,11 @@
 import klass from './class'
 import style from './style'
+import props from './props'
 import append from './append'
 
 export default [
   klass,
   style,
+  props,
   append
 ]
diff --git a/src/platforms/weex/compiler/modules/props.js b/src/platforms/weex/compiler/modules/props.js
@@ -0,0 +1,32 @@
+/* @flow */
+
+import { cached, camelize } from 'shared/util'
+
+const normalize = cached(camelize)
+
+function normalizeKeyName (str: string) : string {
+  if (str.match(/^v\-/)) {
+    return str.replace(/(v-[a-z\-]+\:)([a-z\-]+)$/i, ($, directive, prop) => {
+      return directive + normalize(prop)
+    })
+  }
+  return normalize(str)
+}
+
+function transformNode (el: ASTElement, options: CompilerOptions) {
+  if (Array.isArray(el.attrsList)) {
+    el.attrsList.forEach(attr => {
+      if (attr.name && attr.name.match(/\-/)) {
+        const realName = normalizeKeyName(attr.name)
+        if (el.attrsMap) {
+          el.attrsMap[realName] = el.attrsMap[attr.name]
+          delete el.attrsMap[attr.name]
+        }
+        attr.name = realName
+      }
+    })
+  }
+}
+export default {
+  transformNode
+}
diff --git a/test/weex/compiler/append.spec.js b/test/weex/compiler/append.spec.js
@@ -0,0 +1,14 @@
+import { compile } from '../../../packages/weex-template-compiler'
+import { strToRegExp } from '../helpers/index'
+
+describe('append props', () => {
+  it('append="tree"', () => {
+    const { render, staticRenderFns, errors } = compile(`<list><cell></cell></list>`)
+    expect(render).not.toBeUndefined()
+    expect(staticRenderFns).not.toBeUndefined()
+    expect(staticRenderFns.length).toEqual(1)
+    expect(staticRenderFns).toMatch(strToRegExp(`appendAsTree:true`))
+    expect(staticRenderFns).toMatch(strToRegExp(`attrs:{"append":"tree"}`))
+    expect(errors).toEqual([])
+  })
+})
diff --git a/test/weex/compiler/props.spec.js b/test/weex/compiler/props.spec.js
@@ -0,0 +1,22 @@
+import { compile } from '../../../packages/weex-template-compiler'
+import { strToRegExp } from '../helpers/index'
+
+describe('compile props', () => {
+  it('custom props', () => {
+    const { render, staticRenderFns, errors } = compile(`<div custom="whatever"></div>`)
+    expect(render).not.toBeUndefined()
+    expect(staticRenderFns).not.toBeUndefined()
+    expect(staticRenderFns.length).toEqual(0)
+    expect(render).toMatch(strToRegExp(`attrs:{"custom":"whatever"}`))
+    expect(errors).toEqual([])
+  })
+
+  it('camelize props', () => {
+    const { render, staticRenderFns, errors } = compile(`<div kebab-case="whatever"></div>`)
+    expect(render).not.toBeUndefined()
+    expect(staticRenderFns).not.toBeUndefined()
+    expect(staticRenderFns.length).toEqual(0)
+    expect(render).toMatch(strToRegExp(`attrs:{"kebabCase":"whatever"}`))
+    expect(errors).toEqual([])
+  })
+})
