diff --git a/packages/compiler-ssr/__tests__/ssrComponent.spec.ts b/packages/compiler-ssr/__tests__/ssrComponent.spec.ts
index d830e716a21..672af193e92 100644
--- a/packages/compiler-ssr/__tests__/ssrComponent.spec.ts
+++ b/packages/compiler-ssr/__tests__/ssrComponent.spec.ts
@@ -290,6 +290,25 @@ describe('ssr: components', () => {
}"
`)
+ // should inject attrs if root with coomments
+ expect(compile(``).code)
+ .toMatchInlineSnapshot(`
+ "const { ssrRenderAttrs: _ssrRenderAttrs } = require(\\"vue/server-renderer\\")
+
+ return function ssrRender(_ctx, _push, _parent, _attrs) {
+ _push(\`
\`)
+ }"
+ `)
+
+ // should not inject attrs if not root
+ expect(compile(``).code)
+ .toMatchInlineSnapshot(`
+ "
+ return function ssrRender(_ctx, _push, _parent, _attrs) {
+ _push(\`\`)
+ }"
+ `)
+
expect(compile(``).code)
.toMatchInlineSnapshot(`
"const { resolveComponent: _resolveComponent } = require(\\"vue\\")
diff --git a/packages/compiler-ssr/src/transforms/ssrInjectFallthroughAttrs.ts b/packages/compiler-ssr/src/transforms/ssrInjectFallthroughAttrs.ts
index b368fd2ec92..79ab24eccd7 100644
--- a/packages/compiler-ssr/src/transforms/ssrInjectFallthroughAttrs.ts
+++ b/packages/compiler-ssr/src/transforms/ssrInjectFallthroughAttrs.ts
@@ -11,8 +11,11 @@ import {
isBuiltInType
} from '@vue/compiler-dom'
+const filterChild = (node: ParentNode) =>
+ node.children.filter(n => n.type !== NodeTypes.COMMENT)
+
const hasSingleChild = (node: ParentNode): boolean =>
- node.children.filter(n => n.type !== NodeTypes.COMMENT).length === 1
+ filterChild(node).length === 1
export const ssrInjectFallthroughAttrs: NodeTransform = (node, context) => {
// _attrs is provided as a function argument.
@@ -28,10 +31,13 @@ export const ssrInjectFallthroughAttrs: NodeTransform = (node, context) => {
(isBuiltInType(node.tag, 'Transition') ||
isBuiltInType(node.tag, 'KeepAlive'))
) {
- if (hasSingleChild(node)) {
- injectFallthroughAttrs(node.children[0])
+ const rootChildren = filterChild(context.root)
+ if (rootChildren.length === 1 && rootChildren[0] === node) {
+ if (hasSingleChild(node)) {
+ injectFallthroughAttrs(node.children[0])
+ }
+ return
}
- return
}
const parent = context.parent