From 26861702b3794c75357416c2123fbe400710d697 Mon Sep 17 00:00:00 2001
From: KazariEX <1364035137@qq.com>
Date: Sat, 8 Feb 2025 15:39:56 +0800
Subject: [PATCH 1/3] fix(compiler-ssr): process `:tag` shorthand of
 `TransitionGroup` correctly

---
 .../__tests__/ssrTransitionGroup.spec.ts      | 22 +++++++++++++++++++
 .../transforms/ssrTransformTransitionGroup.ts |  8 ++++---
 2 files changed, 27 insertions(+), 3 deletions(-)

diff --git a/packages/compiler-ssr/__tests__/ssrTransitionGroup.spec.ts b/packages/compiler-ssr/__tests__/ssrTransitionGroup.spec.ts
index 82122e621c7..abbb5f53e6e 100644
--- a/packages/compiler-ssr/__tests__/ssrTransitionGroup.spec.ts
+++ b/packages/compiler-ssr/__tests__/ssrTransitionGroup.spec.ts
@@ -101,6 +101,28 @@ describe('transition-group', () => {
     `)
   })
 
+  test('with dynamic tag shorthand', () => {
+    expect(
+      compile(
+        `<transition-group :tag><div v-for="i in list"/></transition-group>`,
+      ).code,
+    ).toMatchInlineSnapshot(`
+      "const { ssrRenderAttrs: _ssrRenderAttrs, ssrRenderList: _ssrRenderList } = require("vue/server-renderer")
+
+      return function ssrRender(_ctx, _push, _parent, _attrs) {
+        _push(\`<\${
+          _ctx.tag
+        }\${
+          _ssrRenderAttrs(_attrs)
+        }>\`)
+        _ssrRenderList(_ctx.list, (i) => {
+          _push(\`<div></div>\`)
+        })
+        _push(\`</\${_ctx.tag}>\`)
+      }"
+    `)
+  })
+
   test('with multi fragments children', () => {
     expect(
       compile(
diff --git a/packages/compiler-ssr/src/transforms/ssrTransformTransitionGroup.ts b/packages/compiler-ssr/src/transforms/ssrTransformTransitionGroup.ts
index 27ddebec103..64c00831dc0 100644
--- a/packages/compiler-ssr/src/transforms/ssrTransformTransitionGroup.ts
+++ b/packages/compiler-ssr/src/transforms/ssrTransformTransitionGroup.ts
@@ -7,6 +7,7 @@ import {
   type TransformContext,
   buildProps,
   createCallExpression,
+  createSimpleExpression,
   findProp,
 } from '@vue/compiler-dom'
 import { SSR_RENDER_ATTRS } from '../runtimeHelpers'
@@ -30,7 +31,7 @@ export function ssrTransformTransitionGroup(
   context: TransformContext,
 ) {
   return (): void => {
-    const tag = findProp(node, 'tag')
+    const tag = findProp(node, 'tag', false, true)
     if (tag) {
       const otherProps = node.props.filter(p => p !== tag)
       const { props, directives } = buildProps(
@@ -65,9 +66,10 @@ export function ssrProcessTransitionGroup(
   if (entry) {
     const { tag, propsExp, scopeId } = entry
     if (tag.type === NodeTypes.DIRECTIVE) {
+      const tagExp = tag.exp ?? createSimpleExpression(`_ctx.tag`)
       // dynamic :tag
       context.pushStringPart(`<`)
-      context.pushStringPart(tag.exp!)
+      context.pushStringPart(tagExp)
       if (propsExp) {
         context.pushStringPart(propsExp)
       }
@@ -96,7 +98,7 @@ export function ssrProcessTransitionGroup(
         true,
       )
       context.pushStringPart(`</`)
-      context.pushStringPart(tag.exp!)
+      context.pushStringPart(tagExp)
       context.pushStringPart(`>`)
     } else {
       // static tag

From 64c0ad5264ee3d64a1e2777a61ca83080af66209 Mon Sep 17 00:00:00 2001
From: KazariEX <1364035137@qq.com>
Date: Sat, 8 Feb 2025 17:41:45 +0800
Subject: [PATCH 2/3] fix: transform v-bind shorthand

---
 packages/compiler-core/src/index.ts                    |  2 +-
 .../src/transforms/ssrTransformComponent.ts            | 10 ++++++++++
 .../src/transforms/ssrTransformTransitionGroup.ts      |  8 +++-----
 3 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/packages/compiler-core/src/index.ts b/packages/compiler-core/src/index.ts
index 29e5f681300..f38f6991c70 100644
--- a/packages/compiler-core/src/index.ts
+++ b/packages/compiler-core/src/index.ts
@@ -44,7 +44,7 @@ export * from './runtimeHelpers'
 export { getBaseTransformPreset, type TransformPreset } from './compile'
 export { transformModel } from './transforms/vModel'
 export { transformOn } from './transforms/vOn'
-export { transformBind } from './transforms/vBind'
+export { transformBind, transformBindShorthand } from './transforms/vBind'
 export { noopDirectiveTransform } from './transforms/noopDirectiveTransform'
 export { processIf } from './transforms/vIf'
 export { processFor, createForLoopParams } from './transforms/vFor'
diff --git a/packages/compiler-ssr/src/transforms/ssrTransformComponent.ts b/packages/compiler-ssr/src/transforms/ssrTransformComponent.ts
index cad1ee81028..be77ed30cec 100644
--- a/packages/compiler-ssr/src/transforms/ssrTransformComponent.ts
+++ b/packages/compiler-ssr/src/transforms/ssrTransformComponent.ts
@@ -38,6 +38,7 @@ import {
   locStub,
   resolveComponentType,
   stringifyExpression,
+  transformBindShorthand,
   traverseNode,
 } from '@vue/compiler-dom'
 import { SSR_RENDER_COMPONENT, SSR_RENDER_VNODE } from '../runtimeHelpers'
@@ -102,6 +103,15 @@ export const ssrTransformComponent: NodeTransform = (node, context) => {
   componentTypeMap.set(node, component)
 
   if (isSymbol(component)) {
+    for (const prop of node.props) {
+      if (
+        prop.type === NodeTypes.DIRECTIVE &&
+        prop.name === 'bind' &&
+        !prop.exp
+      ) {
+        transformBindShorthand(prop, context)
+      }
+    }
     if (component === SUSPENSE) {
       return ssrTransformSuspense(node, context)
     } else if (component === TRANSITION_GROUP) {
diff --git a/packages/compiler-ssr/src/transforms/ssrTransformTransitionGroup.ts b/packages/compiler-ssr/src/transforms/ssrTransformTransitionGroup.ts
index 64c00831dc0..27ddebec103 100644
--- a/packages/compiler-ssr/src/transforms/ssrTransformTransitionGroup.ts
+++ b/packages/compiler-ssr/src/transforms/ssrTransformTransitionGroup.ts
@@ -7,7 +7,6 @@ import {
   type TransformContext,
   buildProps,
   createCallExpression,
-  createSimpleExpression,
   findProp,
 } from '@vue/compiler-dom'
 import { SSR_RENDER_ATTRS } from '../runtimeHelpers'
@@ -31,7 +30,7 @@ export function ssrTransformTransitionGroup(
   context: TransformContext,
 ) {
   return (): void => {
-    const tag = findProp(node, 'tag', false, true)
+    const tag = findProp(node, 'tag')
     if (tag) {
       const otherProps = node.props.filter(p => p !== tag)
       const { props, directives } = buildProps(
@@ -66,10 +65,9 @@ export function ssrProcessTransitionGroup(
   if (entry) {
     const { tag, propsExp, scopeId } = entry
     if (tag.type === NodeTypes.DIRECTIVE) {
-      const tagExp = tag.exp ?? createSimpleExpression(`_ctx.tag`)
       // dynamic :tag
       context.pushStringPart(`<`)
-      context.pushStringPart(tagExp)
+      context.pushStringPart(tag.exp!)
       if (propsExp) {
         context.pushStringPart(propsExp)
       }
@@ -98,7 +96,7 @@ export function ssrProcessTransitionGroup(
         true,
       )
       context.pushStringPart(`</`)
-      context.pushStringPart(tagExp)
+      context.pushStringPart(tag.exp!)
       context.pushStringPart(`>`)
     } else {
       // static tag

From c44ee000756a6177381c4673b3b47acecfc72661 Mon Sep 17 00:00:00 2001
From: KazariEX <1364035137@qq.com>
Date: Sat, 8 Feb 2025 17:41:57 +0800
Subject: [PATCH 3/3] test: add

---
 .../__tests__/ssrTeleport.spec.ts             | 42 +++++++++++++++++++
 1 file changed, 42 insertions(+)
 create mode 100644 packages/compiler-ssr/__tests__/ssrTeleport.spec.ts

diff --git a/packages/compiler-ssr/__tests__/ssrTeleport.spec.ts b/packages/compiler-ssr/__tests__/ssrTeleport.spec.ts
new file mode 100644
index 00000000000..e1807bc90ea
--- /dev/null
+++ b/packages/compiler-ssr/__tests__/ssrTeleport.spec.ts
@@ -0,0 +1,42 @@
+import { compile } from '../src'
+
+describe('teleport', () => {
+  test('with static to', () => {
+    expect(compile(`<teleport to="body"><div></div></teleport>`).code)
+      .toMatchInlineSnapshot(`
+      "const { ssrRenderTeleport: _ssrRenderTeleport } = require("vue/server-renderer")
+
+      return function ssrRender(_ctx, _push, _parent, _attrs) {
+        _ssrRenderTeleport(_push, (_push) => {
+          _push(\`<div></div>\`)
+        }, "body", false, _parent)
+      }"
+    `)
+  })
+
+  test('with dynamic to', () => {
+    expect(compile(`<teleport :to="target"><div></div></teleport>`).code)
+      .toMatchInlineSnapshot(`
+      "const { ssrRenderTeleport: _ssrRenderTeleport } = require("vue/server-renderer")
+
+      return function ssrRender(_ctx, _push, _parent, _attrs) {
+        _ssrRenderTeleport(_push, (_push) => {
+          _push(\`<div></div>\`)
+        }, _ctx.target, false, _parent)
+      }"
+    `)
+  })
+
+  test('with dynamic to shorthand', () => {
+    expect(compile(`<teleport :to><div></div></teleport>`).code)
+      .toMatchInlineSnapshot(`
+      "const { ssrRenderTeleport: _ssrRenderTeleport } = require("vue/server-renderer")
+
+      return function ssrRender(_ctx, _push, _parent, _attrs) {
+        _ssrRenderTeleport(_push, (_push) => {
+          _push(\`<div></div>\`)
+        }, _ctx.to, false, _parent)
+      }"
+    `)
+  })
+})