fix(runtime): make isSameVnode return false on initial render in a hydration case (#5891)

* fix(runtime): make isSameVnode return false on initial render in a hydration case

* prettier

Author: christian-bromann

src/runtime/vdom/test/vdom-render.spec.tsx

@@ -0,0 +1,39 @@
+import { isSameVnode } from '../vdom-render';
+
+describe('isSameVnode', () => {
+  it('should detect objectively same nodes', () => {
+    const vnode1: any = {
+      $tag$: 'div',
+      $key$: '1',
+      $elm$: { nodeType: 9 },
+    };
+    const vnode2: any = {
+      $tag$: 'div',
+      $key$: '1',
+      $elm$: { nodeType: 9 },
+    };
+    expect(isSameVnode(vnode1, vnode2)).toBe(true);
+  });
+
+  it('should return false in case of hyration', () => {
+    const vnode1: any = {
+      $tag$: 'slot',
+      $key$: '1',
+      $elm$: { nodeType: 9 },
+      $nodeId$: 1,
+    };
+    const vnode2: any = {
+      $tag$: 'slot',
+      $key$: '1',
+      $elm$: { nodeType: 9 },
+    };
+    const vnode3: any = {
+      $tag$: 'slot',
+      $key$: '1',
+      $elm$: { nodeType: 8 },
+      $nodeId$: 2,
+    };
+    expect(isSameVnode(vnode1, vnode2, true)).toBe(false);
+    expect(isSameVnode(vnode3, vnode2, true)).toBe(true);
+  });
+});

src/runtime/vdom/vdom-render.ts

@@ -610,6 +610,19 @@ export const isSameVnode = (leftVNode: d.VNode, rightVNode: d.VNode, isInitialRe
   // need to have the same element tag, and same key to be the same
   if (leftVNode.$tag$ === rightVNode.$tag$) {
     if (BUILD.slotRelocation && leftVNode.$tag$ === 'slot') {
+      // We are not considering the same node if:
+      if (
+        // The component gets hydrated and no VDOM has been initialized.
+        // Here the comparison can't happen as $name$ property is not set for `leftNode`.
+        '$nodeId$' in leftVNode &&
+        isInitialRender &&
+        // `leftNode` is not from type HTMLComment which would cause many
+        // hydration comments to be removed
+        leftVNode.$elm$.nodeType !== 8
+      ) {
+        return false;
+      }
+
       return leftVNode.$name$ === rightVNode.$name$;
     }
     // this will be set if JSX tags in the build have `key` attrs set on them