refactor(ssr): adjust ssr fragment anchor content

packages/server-renderer/__tests__/renderToString.spec.ts

@@ -257,7 +257,7 @@ describe('ssr: renderToString', () => {
         )
       ).toBe(
         `<div>parent<div class="child">` +
-          `<!--1--><span>from slot</span><!--0-->` +
+          `<!--[--><span>from slot</span><!--]-->` +
           `</div></div>`
       )
 
@@ -273,7 +273,7 @@ describe('ssr: renderToString', () => {
           })
         )
       ).toBe(
-        `<div>parent<div class="child"><!--1-->fallback<!--0--></div></div>`
+        `<div>parent<div class="child"><!--[-->fallback<!--]--></div></div>`
       )
     })
 
@@ -318,7 +318,7 @@ describe('ssr: renderToString', () => {
         )
       ).toBe(
         `<div>parent<div class="child">` +
-          `<!--1--><span>from slot</span><!--0-->` +
+          `<!--[--><span>from slot</span><!--]-->` +
           `</div></div>`
       )
     })
@@ -336,7 +336,7 @@ describe('ssr: renderToString', () => {
 
       expect(await renderToString(app)).toBe(
         `<div>parent<div class="child">` +
-          `<!--1--><span>from slot</span><!--0-->` +
+          `<!--[--><span>from slot</span><!--]-->` +
           `</div></div>`
       )
     })
@@ -460,7 +460,7 @@ describe('ssr: renderToString', () => {
           ])
         )
       ).toBe(
-        `<div>foo<span>bar</span><!--1--><span>baz</span><!--0--><!--qux--></div>`
+        `<div>foo<span>bar</span><!--[--><span>baz</span><!--]--><!--qux--></div>`
       )
     })
 

packages/server-renderer/__tests__/ssrSuspense.spec.ts

@@ -33,7 +33,7 @@ describe('SSR Suspense', () => {
         }
       })
 
-      expect(await renderToString(app)).toBe(`<!--1--><div>async</div><!--0-->`)
+      expect(await renderToString(app)).toBe(`<!--[--><div>async</div><!--]-->`)
     })
 
     test('with async component', async () => {
@@ -49,7 +49,7 @@ describe('SSR Suspense', () => {
         }
       })
 
-      expect(await renderToString(app)).toBe(`<!--1--><div>async</div><!--0-->`)
+      expect(await renderToString(app)).toBe(`<!--[--><div>async</div><!--]-->`)
     })
 
     test('fallback', async () => {
@@ -69,7 +69,7 @@ describe('SSR Suspense', () => {
       })
 
       expect(await renderToString(app)).toBe(
-        `<!--1--><div>fallback</div><!--0-->`
+        `<!--[--><div>fallback</div><!--]-->`
       )
       expect('Uncaught error in async setup').toHaveBeenWarned()
     })

packages/server-renderer/src/helpers/ssrRenderSlot.ts

@@ -19,7 +19,7 @@ export function ssrRenderSlot(
   parentComponent: ComponentInternalInstance
 ) {
   // template-compiled slots are always rendered as fragments
-  push(`<!--1-->`)
+  push(`<!--[-->`)
   const slotFn = slots[slotName]
   if (slotFn) {
     if (slotFn.length > 1) {
@@ -33,5 +33,5 @@ export function ssrRenderSlot(
   } else if (fallbackRenderFn) {
     fallbackRenderFn()
   }
-  push(`<!--0-->`)
+  push(`<!--]-->`)
 }

packages/server-renderer/src/helpers/ssrRenderSuspense.ts

@@ -9,9 +9,9 @@ export async function ssrRenderSuspense({
   try {
     if (renderContent) {
       const { push, getBuffer } = createBuffer()
-      push(`<!--1-->`)
+      push(`<!--[-->`)
       renderContent(push)
-      push(`<!--0-->`)
+      push(`<!--]-->`)
       return await getBuffer()
     } else {
       return []
@@ -19,9 +19,9 @@ export async function ssrRenderSuspense({
   } catch {
     if (renderFallback) {
       const { push, getBuffer } = createBuffer()
-      push(`<!--1-->`)
+      push(`<!--[-->`)
       renderFallback(push)
-      push(`<!--0-->`)
+      push(`<!--]-->`)
       return getBuffer()
     } else {
       return []

packages/server-renderer/src/renderToString.ts

@@ -256,9 +256,9 @@ function renderVNode(
       push(children ? `<!--${children}-->` : `<!---->`)
       break
     case Fragment:
-      push(`<!--1-->`) // open
+      push(`<!--[-->`) // open
       renderVNodeChildren(push, children as VNodeArrayChildren, parentComponent)
-      push(`<!--0-->`) // close
+      push(`<!--]-->`) // close
       break
     default:
       if (shapeFlag & ShapeFlags.ELEMENT) {