Merge 74ba484173 into bb4ae25793

packages/runtime-vapor/src/dom/hydration.ts

@@ -2,7 +2,6 @@ import { warn } from '@vue/runtime-dom'
 import {
   insertionAnchor,
   insertionParent,
-  resetInsertionState,
   setInsertionState,
 } from '../insertionState'
 import { child, next } from './node'
@@ -27,7 +26,7 @@ export function withHydration(container: ParentNode, fn: () => void): void {
   isHydrating = true
   setInsertionState(container, 0)
   const res = fn()
-  resetInsertionState()
+  setInsertionState()
   currentHydrationNode = null
   isHydrating = false
   return res
@@ -124,6 +123,6 @@ function locateHydrationNodeImpl() {
     warn('Hydration mismatch in ', insertionParent)
   }
 
-  resetInsertionState()
+  setInsertionState()
   currentHydrationNode = node
 }

packages/runtime-vapor/src/insertionState.ts

@@ -5,12 +5,16 @@ export let insertionAnchor: Node | 0 | undefined
  * This function is called before a block type that requires insertion
  * (component, slot outlet, if, for) is created. The state is used for actual
  * insertion on client-side render, and used for node adoption during hydration.
+ *
+ * @returns A function that restores the previous insertion state when called.
  */
-export function setInsertionState(parent: ParentNode, anchor?: Node | 0): void {
+export function setInsertionState(parent?: ParentNode, anchor?: Node | 0) {
+  const prevParent = insertionParent
+  const prevAnchor = insertionAnchor
   insertionParent = parent
   insertionAnchor = anchor
-}
-
-export function resetInsertionState(): void {
-  insertionParent = insertionAnchor = undefined
+  return (): void => {
+    insertionParent = prevParent
+    insertionAnchor = prevAnchor
+  }
 }