From 33159a5916bf7686fe53517befa59b450b34e974 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Wed, 13 Dec 2023 02:41:49 +0800
Subject: [PATCH] fix(hydration): should not warn mismatch for nullish prop

---
 packages/runtime-core/__tests__/hydration.spec.ts | 1 +
 packages/runtime-core/src/hydration.ts            | 4 +++-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/runtime-core/__tests__/hydration.spec.ts b/packages/runtime-core/__tests__/hydration.spec.ts
index 0805d5e3f13..d051c6da4a4 100644
--- a/packages/runtime-core/__tests__/hydration.spec.ts
+++ b/packages/runtime-core/__tests__/hydration.spec.ts
@@ -1397,6 +1397,7 @@ describe('SSR hydration', () => {
       mountWithHydration(`<div spellcheck></div>`, () =>
         h('div', { spellcheck: '' })
       )
+      mountWithHydration(`<div></div>`, () => h('div', { id: undefined }))
       // boolean
       mountWithHydration(`<select multiple></div>`, () =>
         h('select', { multiple: true })
diff --git a/packages/runtime-core/src/hydration.ts b/packages/runtime-core/src/hydration.ts
index c3fba6cc486..b873a37dc06 100644
--- a/packages/runtime-core/src/hydration.ts
+++ b/packages/runtime-core/src/hydration.ts
@@ -740,7 +740,9 @@ function propHasMismatch(el: Element, key: string, clientValue: any): boolean {
       ? includeBooleanAttr(clientValue)
         ? ''
         : false
-      : String(clientValue)
+      : clientValue == null
+        ? false
+        : String(clientValue)
     if (actual !== expected) {
       mismatchType = `attribute`
       mismatchKey = key