fix(compiler-ssr): fix input w/ v-bind="obj" codegen

diff --git a/packages/compiler-core/src/ast.ts b/packages/compiler-core/src/ast.ts
index acfd8b0ff8b6df6e48cea403cdc5eff3d4739c58..5b5e9e83ef44e04291550fa6cafaef796809e095 100644 (file)
--- a/packages/compiler-core/src/ast.ts
+++ b/packages/compiler-core/src/ast.ts
@@ -52,6 +52,7 @@ export const enum NodeTypes {
   JS_TEMPLATE_LITERAL,
   JS_IF_STATEMENT,
   JS_ASSIGNMENT_EXPRESSION,
+  JS_SEQUENCE_EXPRESSION,
   JS_RETURN_STATEMENT
 }
 
@@ -282,6 +283,7 @@ export type JSChildNode =
   | ConditionalExpression
   | CacheExpression
   | AssignmentExpression
+  | SequenceExpression
 
 export interface CallExpression extends Node {
   type: NodeTypes.JS_CALL_EXPRESSION
@@ -344,6 +346,7 @@ export type SSRCodegenNode =
   | IfStatement
   | AssignmentExpression
   | ReturnStatement
+  | SequenceExpression
 
 export interface BlockStatement extends Node {
   type: NodeTypes.JS_BLOCK_STATEMENT
@@ -368,6 +371,11 @@ export interface AssignmentExpression extends Node {
   right: JSChildNode
 }
 
+export interface SequenceExpression extends Node {
+  type: NodeTypes.JS_SEQUENCE_EXPRESSION
+  expressions: JSChildNode[]
+}
+
 export interface ReturnStatement extends Node {
   type: NodeTypes.JS_RETURN_STATEMENT
   returns: TemplateChildNode | TemplateChildNode[] | JSChildNode
@@ -727,6 +735,16 @@ export function createAssignmentExpression(
   }
 }
 
+export function createSequenceExpression(
+  expressions: SequenceExpression['expressions']
+): SequenceExpression {
+  return {
+    type: NodeTypes.JS_SEQUENCE_EXPRESSION,
+    expressions,
+    loc: locStub
+  }
+}
+
 export function createReturnStatement(
   returns: ReturnStatement['returns']
 ): ReturnStatement {

diff --git a/packages/compiler-core/src/codegen.ts b/packages/compiler-core/src/codegen.ts
index de697a20122708061a8c58f9f74588d3eadcfa2f..e4076bd57da2322fe33d3bf001b62cdabd94f5c1 100644 (file)
--- a/packages/compiler-core/src/codegen.ts
+++ b/packages/compiler-core/src/codegen.ts
@@ -23,7 +23,8 @@ import {
   IfStatement,
   AssignmentExpression,
   ReturnStatement,
-  VNodeCall
+  VNodeCall,
+  SequenceExpression
 } from './ast'
 import { SourceMapGenerator, RawSourceMap } from 'source-map'
 import {
@@ -593,6 +594,9 @@ function genNode(node: CodegenNode | symbol | string, context: CodegenContext) {
     case NodeTypes.JS_ASSIGNMENT_EXPRESSION:
       !__BROWSER__ && genAssignmentExpression(node, context)
       break
+    case NodeTypes.JS_SEQUENCE_EXPRESSION:
+      !__BROWSER__ && genSequenceExpression(node, context)
+      break
     case NodeTypes.JS_RETURN_STATEMENT:
       !__BROWSER__ && genReturnStatement(node, context)
       break
@@ -914,6 +918,15 @@ function genAssignmentExpression(
   genNode(node.right, context)
 }
 
+function genSequenceExpression(
+  node: SequenceExpression,
+  context: CodegenContext
+) {
+  context.push(`(`)
+  genNodeList(node.expressions, context)
+  context.push(`)`)
+}
+
 function genReturnStatement(
   { returns }: ReturnStatement,
   context: CodegenContext

diff --git a/packages/compiler-ssr/__tests__/ssrVModel.spec.ts b/packages/compiler-ssr/__tests__/ssrVModel.spec.ts
index f82df8c1001580a095f116aba7c21bc6fd0bd40f..151eaa79da86097a634fb79606b3dcca14bb5898 100644 (file)
--- a/packages/compiler-ssr/__tests__/ssrVModel.spec.ts
+++ b/packages/compiler-ssr/__tests__/ssrVModel.spec.ts
@@ -118,7 +118,7 @@ describe('ssr: v-model', () => {
       return function ssrRender(_ctx, _push, _parent) {
         let _temp0
 
-        _push(\`<input\${_ssrRenderAttrs(_temp0 = _ctx.obj, _mergeProps(_temp0, _ssrGetDynamicModelProps(_temp0, _ctx.foo)))}>\`)
+        _push(\`<input\${_ssrRenderAttrs((_temp0 = _ctx.obj, _mergeProps(_temp0, _ssrGetDynamicModelProps(_temp0, _ctx.foo))))}>\`)
       }"
     `)
 
@@ -130,7 +130,7 @@ describe('ssr: v-model', () => {
       return function ssrRender(_ctx, _push, _parent) {
         let _temp0
 
-        _push(\`<input\${_ssrRenderAttrs(_temp0 = _mergeProps({ id: \\"x\\" }, _ctx.obj, { class: \\"y\\" }), _mergeProps(_temp0, _ssrGetDynamicModelProps(_temp0, _ctx.foo)))}>\`)
+        _push(\`<input\${_ssrRenderAttrs((_temp0 = _mergeProps({ id: \\"x\\" }, _ctx.obj, { class: \\"y\\" }), _mergeProps(_temp0, _ssrGetDynamicModelProps(_temp0, _ctx.foo))))}>\`)
       }"
     `)
   })

diff --git a/packages/compiler-ssr/src/transforms/ssrTransformElement.ts b/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
index 2b9b218044a4b419d32822bd71dd19452514f3e9..a23748a370a4b40f71e51dbd788d5f8e076a8392 100644 (file)
--- a/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
+++ b/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
@@ -22,7 +22,8 @@ import {
   TextNode,
   hasDynamicKeyVBind,
   MERGE_PROPS,
-  isBindKey
+  isBindKey,
+  createSequenceExpression
 } from '@vue/compiler-dom'
 import {
   escapeHtml,
@@ -107,16 +108,18 @@ export const ssrTransformElement: NodeTransform = (node, context) => {
               const tempId = `_temp${context.temps++}`
               const tempExp = createSimpleExpression(tempId, false)
               propsExp.arguments = [
-                createAssignmentExpression(tempExp, props),
-                createCallExpression(context.helper(MERGE_PROPS), [
-                  tempExp,
-                  createCallExpression(
-                    context.helper(SSR_GET_DYNAMIC_MODEL_PROPS),
-                    [
-                      tempExp, // existing props
-                      vModel.exp! // model
-                    ]
-                  )
+                createSequenceExpression([
+                  createAssignmentExpression(tempExp, props),
+                  createCallExpression(context.helper(MERGE_PROPS), [
+                    tempExp,
+                    createCallExpression(
+                      context.helper(SSR_GET_DYNAMIC_MODEL_PROPS),
+                      [
+                        tempExp, // existing props
+                        vModel.exp! // model
+                      ]
+                    )
+                  ])
                 ])
               ]
             }