diff --git a/packages/compiler-ssr/__tests__/ssrTransitionGroup.spec.ts b/packages/compiler-ssr/__tests__/ssrTransitionGroup.spec.ts index 431ebaa77ee..82122e621c7 100644 --- a/packages/compiler-ssr/__tests__/ssrTransitionGroup.spec.ts +++ b/packages/compiler-ssr/__tests__/ssrTransitionGroup.spec.ts @@ -39,7 +39,7 @@ describe('transition-group', () => { }) // #11514 - test('with static tag + comment', () => { + test('with static tag + v-if comment', () => { expect( compile( `
`, @@ -60,6 +60,25 @@ describe('transition-group', () => { `) }) + // #11958 + test('with static tag + comment', () => { + expect( + compile( + `
`, + ).code, + ).toMatchInlineSnapshot(` + "const { ssrRenderAttrs: _ssrRenderAttrs, ssrRenderList: _ssrRenderList } = require("vue/server-renderer") + + return function ssrRender(_ctx, _push, _parent, _attrs) { + _push(\`\`) + _ssrRenderList(_ctx.list, (i) => { + _push(\`
\`) + }) + _push(\`\`) + }" + `) + }) + test('with dynamic tag', () => { expect( compile( diff --git a/packages/compiler-ssr/src/ssrCodegenTransform.ts b/packages/compiler-ssr/src/ssrCodegenTransform.ts index c093898ec3e..536cbb5c1e9 100644 --- a/packages/compiler-ssr/src/ssrCodegenTransform.ts +++ b/packages/compiler-ssr/src/ssrCodegenTransform.ts @@ -156,7 +156,7 @@ export function processChildren( context: SSRTransformContext, asFragment = false, disableNestedFragments = false, - disableCommentAsIfAlternate = false, + disableComment = false, ): void { if (asFragment) { context.pushStringPart(``) @@ -197,7 +197,9 @@ export function processChildren( case NodeTypes.COMMENT: // no need to escape comment here because the AST can only // contain valid comments. - context.pushStringPart(``) + if (!disableComment) { + context.pushStringPart(``) + } break case NodeTypes.INTERPOLATION: context.pushStringPart( @@ -207,12 +209,7 @@ export function processChildren( ) break case NodeTypes.IF: - ssrProcessIf( - child, - context, - disableNestedFragments, - disableCommentAsIfAlternate, - ) + ssrProcessIf(child, context, disableNestedFragments, disableComment) break case NodeTypes.FOR: ssrProcessFor(child, context, disableNestedFragments) diff --git a/packages/compiler-ssr/src/transforms/ssrVIf.ts b/packages/compiler-ssr/src/transforms/ssrVIf.ts index 7985725885d..0e3880247a1 100644 --- a/packages/compiler-ssr/src/transforms/ssrVIf.ts +++ b/packages/compiler-ssr/src/transforms/ssrVIf.ts @@ -27,7 +27,7 @@ export function ssrProcessIf( node: IfNode, context: SSRTransformContext, disableNestedFragments = false, - disableCommentAsIfAlternate = false, + disableComment = false, ): void { const [rootBranch] = node.branches const ifStatement = createIfStatement( @@ -56,7 +56,7 @@ export function ssrProcessIf( } } - if (!currentIf.alternate && !disableCommentAsIfAlternate) { + if (!currentIf.alternate && !disableComment) { currentIf.alternate = createBlockStatement([ createCallExpression(`_push`, ['``']), ])