From 2613450ace447f8b0eb1f6df01799d19f798f7dd Mon Sep 17 00:00:00 2001 From: Ika Date: Sat, 24 Nov 2018 21:21:20 +0800 Subject: [PATCH 1/2] test: add tests --- tests/html_angular/__snapshots__/jsfmt.spec.js.snap | 11 +++++++++++ tests/html_angular/attributes.component.html | 1 + 2 files changed, 12 insertions(+) diff --git a/tests/html_angular/__snapshots__/jsfmt.spec.js.snap b/tests/html_angular/__snapshots__/jsfmt.spec.js.snap index 58e5bcfb2720..ef816da6206f 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,6 +151,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" @@ -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,6 +353,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" @@ -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 " @@ -695,6 +700,10 @@ exports[`attributes.component.html - angular-verify 3`] = ` let hero of heroes; value: myValue " + *ngIf=" + condition; + else: elseBlock + " *ngIf=" condition; then: thenBlock; @@ -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,6 +984,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" 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 " From ff2b68e2b03772bbfb56d130c62778d3db40b600 Mon Sep 17 00:00:00 2001 From: Ika Date: Sat, 24 Nov 2018 21:44:32 +0800 Subject: [PATCH 2/2] feat(angular): do not print colon for ngIf --- src/language-js/printer-estree.js | 24 ++++++++----- .../__snapshots__/jsfmt.spec.js.snap | 34 +++++++++---------- 2 files changed, 33 insertions(+), 25 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 ef816da6206f..c0b7afb7f474 100644 --- a/tests/html_angular/__snapshots__/jsfmt.spec.js.snap +++ b/tests/html_angular/__snapshots__/jsfmt.spec.js.snap @@ -151,9 +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; else: elseBlock" - *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" @@ -175,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 || @@ -353,9 +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; else: elseBlock" - *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" @@ -377,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 || @@ -702,16 +702,16 @@ exports[`attributes.component.html - angular-verify 3`] = ` " *ngIf=" condition; - else: elseBlock + else elseBlock " *ngIf=" condition; - then: thenBlock; - else: elseBlock + then thenBlock; + else elseBlock " *ngIf=" condition as value; - else: elseBlock + else elseBlock " *directive=" let hero @@ -770,7 +770,7 @@ exports[`attributes.component.html - angular-verify 3`] = ` 2 || listRow.NextScheduledSendStatus == 3; - else: hello + else hello " (target)=" (listRow.NextScheduledSendStatus == @@ -984,9 +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; else: elseBlock" - *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" @@ -1008,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 ||