fix(ssr/hydration): handle ending empty text node (#3246)

fix #3245

diff --git a/packages/runtime-core/__tests__/hydration.spec.ts b/packages/runtime-core/__tests__/hydration.spec.ts
index 4c7aa911bcc8fa517991ca1a225a6283b4180a38..3f9feb4ea77daa4ac3dcab98124f16cfba2849b1 100644 (file)
--- a/packages/runtime-core/__tests__/hydration.spec.ts
+++ b/packages/runtime-core/__tests__/hydration.spec.ts
@@ -9,7 +9,8 @@ import {
   Suspense,
   onMounted,
   defineAsyncComponent,
-  defineComponent
+  defineComponent,
+  createTextVNode
 } from '@vue/runtime-dom'
 import { renderToString, SSRContext } from '@vue/server-renderer'
 
@@ -47,6 +48,14 @@ describe('SSR hydration', () => {
     expect(container.textContent).toBe('bar')
   })
 
+  test('empty text', async () => {
+    const { container } = mountWithHydration('<div></div>', () =>
+      h('div', createTextVNode(''))
+    )
+    expect(container.textContent).toBe('')
+    expect(`Hydration children mismatch in <div>`).not.toHaveBeenWarned()
+  })
+
   test('comment', () => {
     const { vnode, container } = mountWithHydration('<!---->', () => null)
     expect(vnode.el).toBe(container.firstChild)

diff --git a/packages/runtime-core/src/hydration.ts b/packages/runtime-core/src/hydration.ts
index cad23524eb772f1549948349cd5c6ebf3390b07c..8f30cadb2903239ed1964fd60d3ebff8abbc214d 100644 (file)
--- a/packages/runtime-core/src/hydration.ts
+++ b/packages/runtime-core/src/hydration.ts
@@ -359,6 +359,8 @@ export function createHydrationFunctions(
           slotScopeIds,
           optimized
         )
+      } else if (vnode.type === Text && !vnode.children) {
+        continue
       } else {
         hasMismatch = true
         if (__DEV__ && !hasWarned) {