ソースを参照

wip: properly inject fallthrough attrs to alternate node

daiwei 1 年間 前
コミット
f725472d54

+ 35 - 0
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(\`<!--]-->\`)
+        }"
+      `)
+  })
 })

+ 7 - 4
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)
+    }
   }
 }