wrap subexpressions of conditional expressions in parens if necessary (#12420)

Author: vladima

src/compiler/factory.ts

@@ -654,16 +654,16 @@ namespace ts {
         if (whenFalse) {
             // second overload
             node.questionToken = <QuestionToken>questionTokenOrWhenTrue;
-            node.whenTrue = whenTrueOrWhenFalse;
+            node.whenTrue = parenthesizeSubexpressionOfConditionalExpression(whenTrueOrWhenFalse);
             node.colonToken = <ColonToken>colonTokenOrLocation;
-            node.whenFalse = whenFalse;
+            node.whenFalse = parenthesizeSubexpressionOfConditionalExpression(whenFalse);
         }
         else {
             // first overload
             node.questionToken = createToken(SyntaxKind.QuestionToken);
-            node.whenTrue = <Expression>questionTokenOrWhenTrue;
+            node.whenTrue = parenthesizeSubexpressionOfConditionalExpression(<Expression>questionTokenOrWhenTrue);
             node.colonToken = createToken(SyntaxKind.ColonToken);
-            node.whenFalse = whenTrueOrWhenFalse;
+            node.whenFalse = parenthesizeSubexpressionOfConditionalExpression(whenTrueOrWhenFalse);
         }
         return node;
     }
@@ -2381,6 +2381,15 @@ namespace ts {
         return condition;
     }
 
+    function parenthesizeSubexpressionOfConditionalExpression(e: Expression): Expression {
+        // per ES grammar both 'whenTrue' and 'whenFalse' parts of conditional expression are assignment expressions
+        // so in case when comma expression is introduced as a part of previous transformations
+        // if should be wrapped in parens since comma operator has the lowest precedence
+        return e.kind === SyntaxKind.BinaryExpression && (<BinaryExpression>e).operatorToken.kind === SyntaxKind.CommaToken
+            ? createParen(e)
+            : e;
+    }
+
     /**
      * Wraps an expression in parentheses if it is needed in order to use the expression
      * as the expression of a NewExpression node.

tests/baselines/reference/commaOperatorInConditionalExpression.js

@@ -0,0 +1,14 @@
+//// [commaOperatorInConditionalExpression.ts]
+function f (m: string) {
+    [1, 2, 3].map(i => {
+        return true? { [m]: i } : { [m]: i + 1 }
+    })
+}
+
+//// [commaOperatorInConditionalExpression.js]
+function f(m) {
+    [1, 2, 3].map(function (i) {
+        return true ? (_a = {}, _a[m] = i, _a) : (_b = {}, _b[m] = i + 1, _b);
+        var _a, _b;
+    });
+}

tests/baselines/reference/commaOperatorInConditionalExpression.symbols

@@ -0,0 +1,18 @@
+=== tests/cases/compiler/commaOperatorInConditionalExpression.ts ===
+function f (m: string) {
+>f : Symbol(f, Decl(commaOperatorInConditionalExpression.ts, 0, 0))
+>m : Symbol(m, Decl(commaOperatorInConditionalExpression.ts, 0, 12))
+
+    [1, 2, 3].map(i => {
+>[1, 2, 3].map : Symbol(Array.map, Decl(lib.d.ts, --, --), Decl(lib.d.ts, --, --), Decl(lib.d.ts, --, --), Decl(lib.d.ts, --, --), Decl(lib.d.ts, --, --))
+>map : Symbol(Array.map, Decl(lib.d.ts, --, --), Decl(lib.d.ts, --, --), Decl(lib.d.ts, --, --), Decl(lib.d.ts, --, --), Decl(lib.d.ts, --, --))
+>i : Symbol(i, Decl(commaOperatorInConditionalExpression.ts, 1, 18))
+
+        return true? { [m]: i } : { [m]: i + 1 }
+>m : Symbol(m, Decl(commaOperatorInConditionalExpression.ts, 0, 12))
+>i : Symbol(i, Decl(commaOperatorInConditionalExpression.ts, 1, 18))
+>m : Symbol(m, Decl(commaOperatorInConditionalExpression.ts, 0, 12))
+>i : Symbol(i, Decl(commaOperatorInConditionalExpression.ts, 1, 18))
+
+    })
+}

tests/baselines/reference/commaOperatorInConditionalExpression.types

@@ -0,0 +1,30 @@
+=== tests/cases/compiler/commaOperatorInConditionalExpression.ts ===
+function f (m: string) {
+>f : (m: string) => void
+>m : string
+
+    [1, 2, 3].map(i => {
+>[1, 2, 3].map(i => {        return true? { [m]: i } : { [m]: i + 1 }    }) : { [x: string]: number; }[]
+>[1, 2, 3].map : { <U>(this: [number, number, number, number, number], callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): [U, U, U, U, U]; <U>(this: [number, number, number, number], callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): [U, U, U, U]; <U>(this: [number, number, number], callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): [U, U, U]; <U>(this: [number, number], callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): [U, U]; <U>(callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): U[]; }
+>[1, 2, 3] : number[]
+>1 : 1
+>2 : 2
+>3 : 3
+>map : { <U>(this: [number, number, number, number, number], callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): [U, U, U, U, U]; <U>(this: [number, number, number, number], callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): [U, U, U, U]; <U>(this: [number, number, number], callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): [U, U, U]; <U>(this: [number, number], callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): [U, U]; <U>(callbackfn: (value: number, index: number, array: number[]) => U, thisArg?: any): U[]; }
+>i => {        return true? { [m]: i } : { [m]: i + 1 }    } : (i: number) => { [x: string]: number; }
+>i : number
+
+        return true? { [m]: i } : { [m]: i + 1 }
+>true? { [m]: i } : { [m]: i + 1 } : { [x: string]: number; }
+>true : true
+>{ [m]: i } : { [x: string]: number; }
+>m : string
+>i : number
+>{ [m]: i + 1 } : { [x: string]: number; }
+>m : string
+>i + 1 : number
+>i : number
+>1 : 1
+
+    })
+}

tests/cases/compiler/commaOperatorInConditionalExpression.ts

@@ -0,0 +1,5 @@
+function f (m: string) {
+    [1, 2, 3].map(i => {
+        return true? { [m]: i } : { [m]: i + 1 }
+    })
+}