fix(ssr): apply ssr props to the the fallback vnode-based branch in ssr (#7247)

close #6123

diff --git a/packages/server-renderer/__tests__/ssrDynamicComponent.spec.ts b/packages/server-renderer/__tests__/ssrDynamicComponent.spec.ts
index caeb88397b16ca9a824dfc5271248f55e14dc645..0679c82168bea003edaee2a15bb3383afdf95168 100644 (file)
--- a/packages/server-renderer/__tests__/ssrDynamicComponent.spec.ts
+++ b/packages/server-renderer/__tests__/ssrDynamicComponent.spec.ts
@@ -1,5 +1,5 @@
 import { createApp, createVNode } from 'vue'
-import { renderToString } from '../src/renderToString'
+import { renderToString } from '../src'
 
 describe('ssr: dynamic component', () => {
   test('resolved to component', async () => {
@@ -17,6 +17,23 @@ describe('ssr: dynamic component', () => {
     ).toBe(`<div><!--[--><span>slot</span><!--]--></div>`)
   })
 
+  test('resolved to component with v-show', async () => {
+    expect(
+      await renderToString(
+        createApp({
+          components: {
+            one: {
+              template: `<component is="div"><slot/></component>`,
+            },
+          },
+          template: `<one><one v-show="false">hi</one></one>`,
+        }),
+      ),
+    ).toBe(
+      `<div><!--[--><div style=\"display:none;\"><!--[-->hi<!--]--></div><!--]--></div>`,
+    )
+  })
+
   test('resolve to element', async () => {
     expect(
       await renderToString(

diff --git a/packages/server-renderer/src/render.ts b/packages/server-renderer/src/render.ts
index be51da1b86d0f51f5d6e21b0ee85290e6fc78381..4744940e827eb26df5b1d7dbd1725a7cbc3b3318 100644 (file)
--- a/packages/server-renderer/src/render.ts
+++ b/packages/server-renderer/src/render.ts
@@ -217,7 +217,11 @@ export function renderVNode(
   parentComponent: ComponentInternalInstance,
   slotScopeId?: string,
 ): void {
-  const { type, shapeFlag, children } = vnode
+  const { type, shapeFlag, children, dirs, props } = vnode
+  if (dirs) {
+    vnode.props = applySSRDirectives(vnode, props, dirs)
+  }
+
   switch (type) {
     case Text:
       push(escapeHtml(children as string))
@@ -283,13 +287,9 @@ function renderElementVNode(
   slotScopeId?: string,
 ) {
   const tag = vnode.type as string
-  let { props, children, shapeFlag, scopeId, dirs } = vnode
+  let { props, children, shapeFlag, scopeId } = vnode
   let openTag = `<${tag}`
 
-  if (dirs) {
-    props = applySSRDirectives(vnode, props, dirs)
-  }
-
   if (props) {
     openTag += ssrRenderAttrs(props, tag)
   }