theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(ssr): fix unintended error on Teleport hydration mismatch (#1271)

Browse Source 
fix #1235
This commit is contained in:
underfin 2020-06-12 22:01:56 +08:00 committed by GitHub
parent d863ce721f
commit c463a71bb3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/runtime-core/__tests__/hydration.spec.ts
View File

@ -37,6 +37,10 @@ const triggerEvent = (type: string, el: Element) => {
describe('SSR hydration', () => {
mockWarn()
beforeEach(() => {
document.body.innerHTML = ''
})
test('text', async () => {
const msg = ref('foo')
const { vnode, container } = mountWithHydration('foo', () => msg.value)
@ -686,5 +690,17 @@ describe('SSR hydration', () => {
// excessive children removal
expect(`Hydration children mismatch`).toHaveBeenWarned()
})
test('Teleport target has empty children', () => {
const teleportContainer = document.createElement('div')
teleportContainer.id = 'teleport'
document.body.appendChild(teleportContainer)
mountWithHydration('<!--teleport start--><!--teleport end-->', () =>
h(Teleport, { to: '#teleport' }, [h('span', 'value')])
)
expect(teleportContainer.innerHTML).toBe(`<span>value</span>`)
expect(`Hydration children mismatch`).toHaveBeenWarned()
})
})
})

5
packages/runtime-core/src/components/Teleport.ts
View File

@ -314,9 +314,8 @@ function hydrateTeleport(
optimized
)
}
;(target as TeleportTargetElement)._lpa = nextSibling(
vnode.targetAnchor as Node
)
;(target as TeleportTargetElement)._lpa =
vnode.targetAnchor && nextSibling(vnode.targetAnchor as Node)
}
}
return vnode.anchor && nextSibling(vnode.anchor as Node)