Skip to content

Commit

Permalink
fix(runtime-core): fix error when using cssvars with disabled teleport (
Browse files Browse the repository at this point in the history
#7341)

close #7342
  • Loading branch information
baiwusanyu-c authored and yyx990803 committed Oct 21, 2023
1 parent ac68f22 commit 5c9ade5
Show file tree
Hide file tree
Showing 2 changed files with 19 additions and 1 deletion.
2 changes: 1 addition & 1 deletion packages/runtime-core/src/components/Teleport.ts
Original file line number Diff line number Diff line change
Expand Up @@ -414,7 +414,7 @@ function updateCssVars(vnode: VNode) {
const ctx = vnode.ctx
if (ctx && ctx.ut) {
let node = (vnode.children as VNode[])[0].el!
while (node !== vnode.targetAnchor) {
while (node && node !== vnode.targetAnchor) {
if (node.nodeType === 1) node.setAttribute('data-v-owner', ctx.uid)
node = node.nextSibling
}
Expand Down
18 changes: 18 additions & 0 deletions packages/runtime-dom/__tests__/helpers/useCssVars.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -275,4 +275,22 @@ describe('useCssVars', () => {
expect((c as HTMLElement).style.getPropertyValue(`--color`)).toBe('red')
}
})

test('with teleport(disabled)', async () => {
document.body.innerHTML = ''
const state = reactive({ color: 'red' })
const root = document.createElement('div')
const target = document.body

const App = {
setup() {
useCssVars(() => state)
return () => [h(Teleport, { to: target, disabled: true }, [h('div')])]
}
}

expect(() => render(h(App), root)).not.toThrow(TypeError)
await nextTick()
expect(target.children.length).toBe(0)
})
})

0 comments on commit 5c9ade5

Please sign in to comment.