From: underfin <2218301630@qq.com>
Date: Fri, 12 Jun 2020 14:01:56 +0000 (+0800)
Subject: fix(ssr): fix unintended error on `Teleport` hydration mismatch (#1271)
X-Git-Tag: v3.0.0-beta.15~18
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=c463a71bb31f01da55927424533e2ece3a3c4efe;p=thirdparty%2Fvuejs%2Fcore.git

fix(ssr): fix unintended error on `Teleport` hydration mismatch (#1271)

fix #1235
---

diff --git a/packages/runtime-core/__tests__/hydration.spec.ts b/packages/runtime-core/__tests__/hydration.spec.ts
index 49daa3023f..e54063fdb3 100644
--- a/packages/runtime-core/__tests__/hydration.spec.ts
+++ b/packages/runtime-core/__tests__/hydration.spec.ts
@@ -37,6 +37,10 @@ const triggerEvent = (type: string, el: Element) => {
 describe('SSR hydration', () => {
   mockWarn()
 
+  beforeEach(() => {
+    document.body.innerHTML = ''
+  })
+
   test('text', async () => {
     const msg = ref('foo')
     const { vnode, container } = mountWithHydration('foo', () => msg.value)
@@ -686,5 +690,17 @@ describe('SSR hydration', () => {
       // excessive children removal
       expect(`Hydration children mismatch`).toHaveBeenWarned()
     })
+
+    test('Teleport target has empty children', () => {
+      const teleportContainer = document.createElement('div')
+      teleportContainer.id = 'teleport'
+      document.body.appendChild(teleportContainer)
+
+      mountWithHydration('<!--teleport start--><!--teleport end-->', () =>
+        h(Teleport, { to: '#teleport' }, [h('span', 'value')])
+      )
+      expect(teleportContainer.innerHTML).toBe(`<span>value</span>`)
+      expect(`Hydration children mismatch`).toHaveBeenWarned()
+    })
   })
 })
diff --git a/packages/runtime-core/src/components/Teleport.ts b/packages/runtime-core/src/components/Teleport.ts
index 8091f01440..9d8034684d 100644
--- a/packages/runtime-core/src/components/Teleport.ts
+++ b/packages/runtime-core/src/components/Teleport.ts
@@ -314,9 +314,8 @@ function hydrateTeleport(
           optimized
         )
       }
-      ;(target as TeleportTargetElement)._lpa = nextSibling(
-        vnode.targetAnchor as Node
-      )
+      ;(target as TeleportTargetElement)._lpa =
+        vnode.targetAnchor && nextSibling(vnode.targetAnchor as Node)
     }
   }
   return vnode.anchor && nextSibling(vnode.anchor as Node)