fix(weex): stop trim css units in richtext component (#6927)

+ Remove the `trimCSSUnit` method.
+ Modify the test cases to support css units.
+ Add flow type annotations.

src/platforms/weex/runtime/components/richtext.js

@@ -1,32 +1,25 @@
-function getVNodeType (vnode) {
+/* @flow */
+
+function getVNodeType (vnode: VNode): string {
   if (!vnode.tag) {
     return ''
   }
   return vnode.tag.replace(/vue\-component\-(\d+\-)?/, '')
 }
 
-function isSimpleSpan (vnode) {
+function isSimpleSpan (vnode: VNode): boolean {
-  return vnode.children && vnode.children.length === 1 && !vnode.children[0].tag
+  return vnode.children &&
+    vnode.children.length === 1 &&
+    !vnode.children[0].tag
 }
 
-const cssLengthRE = /^([+-]?[0-9]+(\.[0-9]+)?)(px|em|ex|%|in|cm|mm|pt|pc)$/i
+function parseStyle (vnode: VNode): Object | void {
-function trimCSSUnit (prop) {
-  const res = String(prop).match(cssLengthRE)
-  if (res) {
-    return Number(res[1])
-  }
-  return prop
-}
-
-function parseStyle (vnode) {
   if (!vnode || !vnode.data) {
     return
   }
-
   const { staticStyle, staticClass } = vnode.data
   if (vnode.data.style || vnode.data.class || staticStyle || staticClass) {
     const styles = Object.assign({}, staticStyle, vnode.data.style)
-
     const cssMap = vnode.context.$options.style || {}
     const classList = [].concat(staticClass, vnode.data.class)
     classList.forEach(name => {
@@ -34,22 +27,18 @@ function parseStyle (vnode) {
         Object.assign(styles, cssMap[name])
       }
     })
-
-    for (const key in styles) {
-      styles[key] = trimCSSUnit(styles[key])
-    }
     return styles
   }
 }
 
-function convertVNodeChildren (children) {
+function convertVNodeChildren (children: Array<VNode>): Array<VNode> | void {
   if (!children.length) {
     return
   }
 
   return children.map(vnode => {
-    const type = getVNodeType(vnode)
+    const type: string = getVNodeType(vnode)
-    const props = { type }
+    const props: Object = { type }
 
     // convert raw text node
     if (!type) {
@@ -65,7 +54,6 @@ function convertVNodeChildren (children) {
           props.events = vnode.data.on
         }
       }
-
       if (type === 'span' && isSimpleSpan(vnode)) {
         props.attr = props.attr || {}
         props.attr.value = vnode.children[0].text.trim()
@@ -83,8 +71,7 @@ function convertVNodeChildren (children) {
 
 export default {
   name: 'richtext',
-  // abstract: true,
+  render (h: Function) {
-  render (h) {
     return h('weex:richtext', {
       on: this._events,
       attrs: {

test/weex/runtime/components/richtext.spec.js

@@ -199,7 +199,7 @@ describe('richtext component', () => {
         attr: {
           value: [{
             type: 'image',
-            style: { width: 150, height: 150 },
+            style: { width: '150px', height: '150px' },
             attr: { src: 'path/to/profile.png' }
           }]
         }
@@ -293,11 +293,11 @@ describe('richtext component', () => {
         attr: {
           value: [{
             type: 'span',
-            style: { fontSize: 16, color: '#FF6600' },
+            style: { fontSize: '16px', color: '#FF6600' },
             attr: { value: 'ABCD' }
           }, {
             type: 'image',
-            style: { width: 33.33, height: 66.67 },
+            style: { width: '33.33px', height: '66.67px' },
             attr: { src: 'path/to/A.png' }
           }]
         }
@@ -471,7 +471,7 @@ describe('richtext component', () => {
         attr: {
           value: [{
             type: 'span',
-            style: { fontSize: 32, color: '#F6F660' },
+            style: { fontSize: '32px', color: '#F6F660' },
             attr: { value: 'ABCD' }
           }, {
             type: 'span',
@@ -543,7 +543,7 @@ describe('richtext component', () => {
         attr: {
           value: [{
             type: 'span',
-            style: { fontSize: 24, color: '#ABCDEF' },
+            style: { fontSize: '24px', color: '#ABCDEF' },
             attr: { value: 'ABCD' }
           }, {
             type: 'span',