Procházet zdrojové kódy

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

fix #3245
HcySunYang před 5 roky
rodič
revize
420c8f4580

+ 10 - 1
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)

+ 2 - 0
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) {