@@ -227,15 +227,19 @@ export function createHydrationFunctions(
227
227
optimized
228
228
)
229
229
230
- // component may be async, so in the case of fragments we cannot rely
231
- // on component's rendered output to determine the end of the fragment
232
- // instead, we do a lookahead to find the end anchor node.
233
- nextNode = isFragmentStart
234
- ? locateClosingAnchor ( node , '[' , ']' )
235
- : // #4293 #6152 if teleport start look ahead for teleport end.
236
- isComment ( node ) && node . data === 'teleport start'
237
- ? locateClosingAnchor ( node , 'teleport start' , 'teleport end' )
238
- : nextSibling ( node )
230
+ // Locate the next node.
231
+ if ( isFragmentStart ) {
232
+ // If it's a fragment: since components may be async, we cannot rely
233
+ // on component's rendered output to determine the end of the
234
+ // fragment. Instead, we do a lookahead to find the end anchor node.
235
+ nextNode = locateClosingAnchor ( node )
236
+ } else if ( isComment ( node ) && node . data === 'teleport start' ) {
237
+ // #4293 #6152
238
+ // If a teleport is at component root, look ahead for teleport end.
239
+ nextNode = locateClosingAnchor ( node , node . data , 'teleport end' )
240
+ } else {
241
+ nextNode = nextSibling ( node )
242
+ }
239
243
240
244
// #3787
241
245
// if component is async, it may get moved / unmounted before its
@@ -527,7 +531,7 @@ export function createHydrationFunctions(
527
531
528
532
if ( isFragment ) {
529
533
// remove excessive fragment nodes
530
- const end = locateClosingAnchor ( node , '[' , ']' )
534
+ const end = locateClosingAnchor ( node )
531
535
while ( true ) {
532
536
const next = nextSibling ( node )
533
537
if ( next && next !== end ) {
@@ -558,15 +562,15 @@ export function createHydrationFunctions(
558
562
// looks ahead for a start and closing comment node
559
563
const locateClosingAnchor = (
560
564
node : Node | null ,
561
- startData : string ,
562
- endData : string
565
+ open = '[' ,
566
+ close = ']'
563
567
) : Node | null => {
564
568
let match = 0
565
569
while ( node ) {
566
570
node = nextSibling ( node )
567
571
if ( node && isComment ( node ) ) {
568
- if ( node . data === startData ) match ++
569
- if ( node . data === endData ) {
572
+ if ( node . data === open ) match ++
573
+ if ( node . data === close ) {
570
574
if ( match === 0 ) {
571
575
return nextSibling ( node )
572
576
} else {
0 commit comments