Skip to content

Commit

Permalink
fix(weex): stop trim css units in richtext component (#6927)
Browse files Browse the repository at this point in the history
+ Remove the `trimCSSUnit` method.
+ Modify the test cases to support css units.
+ Add flow type annotations.
  • Loading branch information
Hanks10100 authored and yyx990803 committed Oct 31, 2017
1 parent 6f6e5c8 commit 8a784d8
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 30 deletions.
37 changes: 12 additions & 25 deletions src/platforms/weex/runtime/components/richtext.js
@@ -1,55 +1,44 @@
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 => {
if (name && cssMap[name]) {
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) {
Expand All @@ -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()
Expand All @@ -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: {
Expand Down
10 changes: 5 additions & 5 deletions test/weex/runtime/components/richtext.spec.js
Expand Up @@ -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' }
}]
}
Expand Down Expand Up @@ -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' }
}]
}
Expand Down Expand Up @@ -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',
Expand Down Expand Up @@ -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',
Expand Down

0 comments on commit 8a784d8

Please sign in to comment.