wip: properly inject fallthrough attrs to alternate node

diff --git a/packages/compiler-ssr/__tests__/ssrVSkip.spec.ts b/packages/compiler-ssr/__tests__/ssrVSkip.spec.ts
index 57f47d1d202235e0b0d7148e4e8c415970b0e673..3c1c8cfc026e5188c127fd2ffb11bfc791529b3f 100644 (file)
--- a/packages/compiler-ssr/__tests__/ssrVSkip.spec.ts
+++ b/packages/compiler-ssr/__tests__/ssrVSkip.spec.ts
@@ -363,4 +363,39 @@ describe('ssr: v-skip', () => {
       }"
     `)
   })
+
+  test('fragment with component v-skip', () => {
+    expect(
+      compile(`
+      <div></div>
+      <Comp v-skip="ok"><span/></Comp>
+    `).code,
+    ).toMatchInlineSnapshot(`
+        "const { withCtx: _withCtx, resolveComponent: _resolveComponent, createVNode: _createVNode } = require("vue")
+        const { ssrRenderComponent: _ssrRenderComponent } = require("vue/server-renderer")
+
+        return function ssrRender(_ctx, _push, _parent, _attrs) {
+          const _component_Comp = _resolveComponent("Comp")
+
+          _push(\`<!--[--><div></div>\`)
+          if (_ctx.ok) {
+            _push(\`<span></span>\`)
+          } else {
+            _push(_ssrRenderComponent(_component_Comp, null, {
+              default: _withCtx((_, _push, _parent, _scopeId) => {
+                if (_push) {
+                  _push(\`<span\${_scopeId}></span>\`)
+                } else {
+                  return [
+                    _createVNode("span")
+                  ]
+                }
+              }),
+              _: 1 /* STABLE */
+            }, _parent))
+          }
+          _push(\`<!--]-->\`)
+        }"
+      `)
+  })
 })

diff --git a/packages/compiler-ssr/src/transforms/ssrInjectFallthroughAttrs.ts b/packages/compiler-ssr/src/transforms/ssrInjectFallthroughAttrs.ts
index 719c67aec8afddf821e46ef8c0f3bf126682a5b5..33c6cc545c522b5c3ab4ce8bba5854d25d4d5793 100644 (file)
--- a/packages/compiler-ssr/src/transforms/ssrInjectFallthroughAttrs.ts
+++ b/packages/compiler-ssr/src/transforms/ssrInjectFallthroughAttrs.ts
@@ -67,11 +67,14 @@ export const ssrInjectFallthroughAttrs: NodeTransform = (node, context) => {
       }
     }
     injectFallthroughAttrs(node.children[0])
-  } else if (node.type === NodeTypes.SKIP) {
-    const children = filterChild(node.alternate)
-    children.forEach(injectFallthroughAttrs)
   } else if (hasSingleChild(parent)) {
-    injectFallthroughAttrs(node)
+    if (node.type === NodeTypes.SKIP) {
+      // for skip node, inject fallthrough attrs to the alternate branch
+      const children = filterChild(node.alternate)
+      injectFallthroughAttrs(children[0])
+    } else {
+      injectFallthroughAttrs(node)
+    }
   }
 }