From 66ada24961c60c4b2642c227db86e915d5d92908 Mon Sep 17 00:00:00 2001 From: Ika Date: Sun, 25 Nov 2018 15:43:40 +0800 Subject: [PATCH] feat(angular): do not print colon for ngIf (#5542) --- src/language-js/printer-estree.js | 24 ++++++++---- .../__snapshots__/jsfmt.spec.js.snap | 37 ++++++++++++------- tests/html_angular/attributes.component.html | 1 + 3 files changed, 41 insertions(+), 21 deletions(-) diff --git a/src/language-js/printer-estree.js b/src/language-js/printer-estree.js index 8a8f265d6275..72b654e8671c 100644 --- a/src/language-js/printer-estree.js +++ b/src/language-js/printer-estree.js @@ -3505,7 +3505,7 @@ function printPathNoParens(path, options, print, args) { concat([ index === 0 ? "" - : isNgForOf(childPath) + : isNgForOf(childPath.getValue(), index, n) ? " " : concat([";", line]), print(childPath) @@ -3522,12 +3522,24 @@ function printPathNoParens(path, options, print, args) { path.call(print, "expression"), n.alias === null ? "" : concat([" as ", path.call(print, "alias")]) ]); - case "NGMicrosyntaxKeyedExpression": + case "NGMicrosyntaxKeyedExpression": { + const index = path.getName(); + const parentNode = path.getParentNode(); + const shouldNotPrintColon = + isNgForOf(n, index, parentNode) || + (((index === 1 && (n.key.name === "then" || n.key.name === "else")) || + (index === 2 && + (n.key.name === "else" && + parentNode.body[index - 1].type === + "NGMicrosyntaxKeyedExpression" && + parentNode.body[index - 1].key.name === "then"))) && + parentNode.body[0].type === "NGMicrosyntaxExpression"); return concat([ path.call(print, "key"), - isNgForOf(path) ? " " : ": ", + shouldNotPrintColon ? " " : ": ", path.call(print, "expression") ]); + } case "NGMicrosyntaxLet": return concat([ "let ", @@ -3546,11 +3558,7 @@ function printPathNoParens(path, options, print, args) { } } -/** prefer `let hero of heros` over `let hero; of: heros` */ -function isNgForOf(path) { - const node = path.getValue(); - const index = path.getName(); - const parentNode = path.getParentNode(); +function isNgForOf(node, index, parentNode) { return ( node.type === "NGMicrosyntaxKeyedExpression" && node.key.name === "of" && diff --git a/tests/html_angular/__snapshots__/jsfmt.spec.js.snap b/tests/html_angular/__snapshots__/jsfmt.spec.js.snap index 2e507aa60dae..8bf566ec7949 100644 --- a/tests/html_angular/__snapshots__/jsfmt.spec.js.snap +++ b/tests/html_angular/__snapshots__/jsfmt.spec.js.snap @@ -60,6 +60,7 @@ exports[`attributes.component.html - angular-verify 1`] = ` *ngFor=" let item of items ; index as i ; trackBy : trackByFn" *ngFor=" let hero of heroes; let i = index" *ngFor=" let hero of heroes; value myValue" + *ngIf=" condition ; else elseBlock " *ngIf=" condition ; then thenBlock else elseBlock " *ngIf=" condition as value ; else elseBlock " *directive=" let hero " @@ -150,8 +151,9 @@ exports[`attributes.component.html - angular-verify 1`] = ` *ngFor="let item of items; index as i; trackBy: trackByFn" *ngFor="let hero of heroes; let i = index" *ngFor="let hero of heroes; value: myValue" - *ngIf="condition; then: thenBlock; else: elseBlock" - *ngIf="condition as value; else: elseBlock" + *ngIf="condition; else elseBlock" + *ngIf="condition; then thenBlock; else elseBlock" + *ngIf="condition as value; else elseBlock" *directive="let hero" *directive="let hero = hello" *directive="let hero of heroes" @@ -173,7 +175,7 @@ exports[`attributes.component.html - angular-verify 1`] = ` listRow.NextScheduledSendStatus == 1 || listRow.NextScheduledSendStatus == 2 || listRow.NextScheduledSendStatus == 3; - else: hello + else hello " (target)=" (listRow.NextScheduledSendStatus == 1 || @@ -260,6 +262,7 @@ exports[`attributes.component.html - angular-verify 2`] = ` *ngFor=" let item of items ; index as i ; trackBy : trackByFn" *ngFor=" let hero of heroes; let i = index" *ngFor=" let hero of heroes; value myValue" + *ngIf=" condition ; else elseBlock " *ngIf=" condition ; then thenBlock else elseBlock " *ngIf=" condition as value ; else elseBlock " *directive=" let hero " @@ -350,8 +353,9 @@ exports[`attributes.component.html - angular-verify 2`] = ` *ngFor="let item of items; index as i; trackBy: trackByFn" *ngFor="let hero of heroes; let i = index" *ngFor="let hero of heroes; value: myValue" - *ngIf="condition; then: thenBlock; else: elseBlock" - *ngIf="condition as value; else: elseBlock" + *ngIf="condition; else elseBlock" + *ngIf="condition; then thenBlock; else elseBlock" + *ngIf="condition as value; else elseBlock" *directive="let hero" *directive="let hero = hello" *directive="let hero of heroes" @@ -373,7 +377,7 @@ exports[`attributes.component.html - angular-verify 2`] = ` listRow.NextScheduledSendStatus == 1 || listRow.NextScheduledSendStatus == 2 || listRow.NextScheduledSendStatus == 3; - else: hello + else hello " (target)=" (listRow.NextScheduledSendStatus == 1 || @@ -460,6 +464,7 @@ exports[`attributes.component.html - angular-verify 3`] = ` *ngFor=" let item of items ; index as i ; trackBy : trackByFn" *ngFor=" let hero of heroes; let i = index" *ngFor=" let hero of heroes; value myValue" + *ngIf=" condition ; else elseBlock " *ngIf=" condition ; then thenBlock else elseBlock " *ngIf=" condition as value ; else elseBlock " *directive=" let hero " @@ -697,12 +702,16 @@ exports[`attributes.component.html - angular-verify 3`] = ` " *ngIf=" condition; - then: thenBlock; - else: elseBlock + else elseBlock + " + *ngIf=" + condition; + then thenBlock; + else elseBlock " *ngIf=" condition as value; - else: elseBlock + else elseBlock " *directive=" let hero @@ -761,7 +770,7 @@ exports[`attributes.component.html - angular-verify 3`] = ` 2 || listRow.NextScheduledSendStatus == 3; - else: hello + else hello " (target)=" (listRow.NextScheduledSendStatus == @@ -884,6 +893,7 @@ exports[`attributes.component.html - angular-verify 4`] = ` *ngFor=" let item of items ; index as i ; trackBy : trackByFn" *ngFor=" let hero of heroes; let i = index" *ngFor=" let hero of heroes; value myValue" + *ngIf=" condition ; else elseBlock " *ngIf=" condition ; then thenBlock else elseBlock " *ngIf=" condition as value ; else elseBlock " *directive=" let hero " @@ -974,8 +984,9 @@ exports[`attributes.component.html - angular-verify 4`] = ` *ngFor="let item of items; index as i; trackBy: trackByFn" *ngFor="let hero of heroes; let i = index" *ngFor="let hero of heroes; value: myValue" - *ngIf="condition; then: thenBlock; else: elseBlock" - *ngIf="condition as value; else: elseBlock" + *ngIf="condition; else elseBlock" + *ngIf="condition; then thenBlock; else elseBlock" + *ngIf="condition as value; else elseBlock" *directive="let hero" *directive="let hero = hello" *directive="let hero of heroes" @@ -997,7 +1008,7 @@ exports[`attributes.component.html - angular-verify 4`] = ` listRow.NextScheduledSendStatus == 1 || listRow.NextScheduledSendStatus == 2 || listRow.NextScheduledSendStatus == 3; - else: hello + else hello " (target)=" (listRow.NextScheduledSendStatus == 1 || diff --git a/tests/html_angular/attributes.component.html b/tests/html_angular/attributes.component.html index 71ec64da990a..5e525c77fa86 100644 --- a/tests/html_angular/attributes.component.html +++ b/tests/html_angular/attributes.component.html @@ -57,6 +57,7 @@ *ngFor=" let item of items ; index as i ; trackBy : trackByFn" *ngFor=" let hero of heroes; let i = index" *ngFor=" let hero of heroes; value myValue" + *ngIf=" condition ; else elseBlock " *ngIf=" condition ; then thenBlock else elseBlock " *ngIf=" condition as value ; else elseBlock " *directive=" let hero "