From e1bc2681ef64aed7975ad38950a478ae53c1abad Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 19 May 2022 11:36:29 +0800
Subject: [PATCH] fix(ssr): fix hydration mismatch caused by multi-line
 comments inside slot

fix #5355
---
 .../server-renderer/__tests__/ssrSlot.spec.ts | 30 +++++++++++++++++++
 .../src/helpers/ssrRenderSlot.ts              |  2 +-
 2 files changed, 31 insertions(+), 1 deletion(-)

diff --git a/packages/server-renderer/__tests__/ssrSlot.spec.ts b/packages/server-renderer/__tests__/ssrSlot.spec.ts
index a68569cacdf..baf8f227806 100644
--- a/packages/server-renderer/__tests__/ssrSlot.spec.ts
+++ b/packages/server-renderer/__tests__/ssrSlot.spec.ts
@@ -49,6 +49,36 @@ describe('ssr: slot', () => {
     ).toBe(`<div><!--[--><!--]--></div>`)
   })
 
+  test('empty slot (manual comments)', async () => {
+    expect(
+      await renderToString(
+        createApp({
+          components: {
+            one: {
+              template: `<div><slot/></div>`
+            }
+          },
+          template: `<one><!--hello--></one>`
+        })
+      )
+    ).toBe(`<div><!--[--><!--]--></div>`)
+  })
+
+  test('empty slot (multi-line comments)', async () => {
+    expect(
+      await renderToString(
+        createApp({
+          components: {
+            one: {
+              template: `<div><slot/></div>`
+            }
+          },
+          template: `<one><!--he\nllo--></one>`
+        })
+      )
+    ).toBe(`<div><!--[--><!--]--></div>`)
+  })
+
   test('multiple elements', async () => {
     expect(
       await renderToString(
diff --git a/packages/server-renderer/src/helpers/ssrRenderSlot.ts b/packages/server-renderer/src/helpers/ssrRenderSlot.ts
index 9234e517325..8f746ec1e47 100644
--- a/packages/server-renderer/src/helpers/ssrRenderSlot.ts
+++ b/packages/server-renderer/src/helpers/ssrRenderSlot.ts
@@ -82,7 +82,7 @@ export function ssrRenderSlotInner(
   }
 }
 
-const commentRE = /<!--.*?-->/g
+const commentRE = /<!--[^]*?-->/gm
 function isComment(item: SSRBufferItem) {
   return (
     typeof item === 'string' &&