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.
This commit is contained in:
Hanks 2017-10-30 19:28:54 -05:00 committed by Evan You
parent 6f6e5c88af
commit 8a784d8d23
2 changed files with 17 additions and 30 deletions

View File

@ -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) {
return vnode.children && vnode.children.length === 1 && !vnode.children[0].tag
function isSimpleSpan (vnode: VNode): boolean {
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 trimCSSUnit (prop) {
const res = String(prop).match(cssLengthRE)
if (res) {
return Number(res[1])
}
return prop
}
function parseStyle (vnode) {
function parseStyle (vnode: VNode): Object | void {
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 props = { type }
const type: string = getVNodeType(vnode)
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) {
render (h: Function) {
return h('weex:richtext', {
on: this._events,
attrs: {

View File

@ -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',