Skip to content

Commit b603d83

Browse files
committed
Revert "refactor: relocate getRootElement to custom.ts and update custom directive tests to use template helper."
This reverts commit a8c435d.
1 parent 0fb2278 commit b603d83

File tree

3 files changed

+51
-47
lines changed

3 files changed

+51
-47
lines changed

packages/runtime-vapor/__tests__/directives/customDirective.spec.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import {
33
type VaporDirective,
44
createComponent,
55
defineVaporComponent,
6-
template,
76
withVaporDirectives,
87
} from '../../src'
98
import { nextTick, watchEffect } from '@vue/runtime-dom'
@@ -59,7 +58,8 @@ describe('custom directive', () => {
5958
// Child component with single root
6059
const Child = defineVaporComponent({
6160
render() {
62-
return template('<div></div>', true)()
61+
const el = document.createElement('div')
62+
return el
6363
},
6464
})
6565

@@ -92,7 +92,7 @@ describe('custom directive', () => {
9292
// Child component with multiple roots
9393
const Child = defineVaporComponent({
9494
render() {
95-
return [template('<div></div>')(), template('<span></span>')()]
95+
return [document.createElement('div'), document.createElement('span')]
9696
},
9797
})
9898

packages/runtime-vapor/src/component.ts

Lines changed: 43 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ import {
101101
isLastInsertion,
102102
resetInsertionState,
103103
} from './insertionState'
104-
import { DynamicFragment } from './fragment'
104+
import { DynamicFragment, isFragment } from './fragment'
105105
import type { VaporElement } from './apiDefineVaporCustomElement'
106106

107107
export { currentInstance } from '@vue/runtime-dom'
@@ -860,6 +860,48 @@ export function getExposed(
860860
}
861861
}
862862

863+
export function getRootElement(
864+
block: Block,
865+
recurse: boolean = true,
866+
): Element | undefined {
867+
if (block instanceof Element) {
868+
return block
869+
}
870+
871+
if (recurse && isVaporComponent(block)) {
872+
return getRootElement(block.block, recurse)
873+
}
874+
875+
if (isFragment(block)) {
876+
const { nodes } = block
877+
if (nodes instanceof Element && (nodes as any).$root) {
878+
return nodes
879+
}
880+
return getRootElement(nodes, recurse)
881+
}
882+
883+
// The root node contains comments. It is necessary to filter out
884+
// the comment nodes and return a single root node.
885+
// align with vdom behavior
886+
if (isArray(block)) {
887+
let singleRoot: Element | undefined
888+
let hasComment = false
889+
for (const b of block) {
890+
if (b instanceof Comment) {
891+
hasComment = true
892+
continue
893+
}
894+
const thisRoot = getRootElement(b, recurse)
895+
// only return root if there is exactly one eligible root in the array
896+
if (!thisRoot || singleRoot) {
897+
return
898+
}
899+
singleRoot = thisRoot
900+
}
901+
return hasComment ? singleRoot : undefined
902+
}
903+
}
904+
863905
export function filterSingleRootElement(block: Block): Element | undefined {
864906
let singleRoot
865907
if (block instanceof Element) {
Lines changed: 5 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import { type DirectiveModifiers, onScopeDispose, warn } from '@vue/runtime-dom'
2-
import { type VaporComponentInstance, isVaporComponent } from '../component'
3-
import type { Block } from '../block'
4-
import { isFragment } from '../fragment'
5-
import { isArray } from '@vue/shared'
2+
import {
3+
type VaporComponentInstance,
4+
getRootElement,
5+
isVaporComponent,
6+
} from '../component'
67

78
// !! vapor directive is different from vdom directives
89
export type VaporDirective = (
@@ -46,42 +47,3 @@ export function withVaporDirectives(
4647
}
4748
}
4849
}
49-
50-
export function getRootElement(block: Block): Element | undefined {
51-
if (block instanceof Element && (block as any).$root) {
52-
return block
53-
}
54-
55-
if (isVaporComponent(block)) {
56-
return getRootElement(block.block)
57-
}
58-
59-
if (isFragment(block)) {
60-
const { nodes } = block
61-
if (nodes instanceof Element && (nodes as any).$root) {
62-
return nodes
63-
}
64-
return getRootElement(nodes)
65-
}
66-
67-
// The root node contains comments. It is necessary to filter out
68-
// the comment nodes and return a single root node.
69-
// align with vdom behavior
70-
if (isArray(block)) {
71-
let singleRoot: Element | undefined
72-
let hasComment = false
73-
for (const b of block) {
74-
if (b instanceof Comment) {
75-
hasComment = true
76-
continue
77-
}
78-
const thisRoot = getRootElement(b)
79-
// only return root if there is exactly one eligible root in the array
80-
if (!thisRoot || singleRoot) {
81-
return
82-
}
83-
singleRoot = thisRoot
84-
}
85-
return hasComment ? singleRoot : undefined
86-
}
87-
}

0 commit comments

Comments
 (0)