fix(runtime-core): class and style should be properly normalized in cloneVNode (#1967)

fix #1964
This commit is contained in:
HcySunYang 2020-08-26 21:37:28 +08:00 committed by GitHub
parent 2178473936
commit 9153fc2d8a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 51 additions and 5 deletions

View File

@ -265,6 +265,56 @@ describe('vnode', () => {
setCurrentRenderingInstance(null) setCurrentRenderingInstance(null)
}) })
test('cloneVNode class normalization', () => {
const vnode = createVNode('div')
const expectedProps = {
class: 'a b'
}
expect(cloneVNode(vnode, { class: 'a b' }).props).toMatchObject(
expectedProps
)
expect(cloneVNode(vnode, { class: ['a', 'b'] }).props).toMatchObject(
expectedProps
)
expect(
cloneVNode(vnode, { class: { a: true, b: true } }).props
).toMatchObject(expectedProps)
expect(
cloneVNode(vnode, { class: [{ a: true, b: true }] }).props
).toMatchObject(expectedProps)
})
test('cloneVNode style normalization', () => {
const vnode = createVNode('div')
const expectedProps = {
style: {
color: 'blue',
width: '300px'
}
}
expect(
cloneVNode(vnode, { style: 'color: blue; width: 300px;' }).props
).toMatchObject(expectedProps)
expect(
cloneVNode(vnode, {
style: {
color: 'blue',
width: '300px'
}
}).props
).toMatchObject(expectedProps)
expect(
cloneVNode(vnode, {
style: [
{
color: 'blue',
width: '300px'
}
]
}).props
).toMatchObject(expectedProps)
})
describe('mergeProps', () => { describe('mergeProps', () => {
test('class', () => { test('class', () => {
let props1: Data = { class: 'c' } let props1: Data = { class: 'c' }

View File

@ -433,11 +433,7 @@ export function cloneVNode<T, U>(
// This is intentionally NOT using spread or extend to avoid the runtime // This is intentionally NOT using spread or extend to avoid the runtime
// key enumeration cost. // key enumeration cost.
const { props, patchFlag } = vnode const { props, patchFlag } = vnode
const mergedProps = extraProps const mergedProps = extraProps ? mergeProps(props || {}, extraProps) : props
? props
? mergeProps(props, extraProps)
: extend({}, extraProps)
: props
return { return {
__v_isVNode: true, __v_isVNode: true,
[ReactiveFlags.SKIP]: true, [ReactiveFlags.SKIP]: true,