From 86a5acb4d142d5546dd06c97874ae0a7016a0dd3 Mon Sep 17 00:00:00 2001 From: Cyrille David Date: Thu, 27 May 2021 20:24:23 +0200 Subject: [PATCH 1/5] Preserve attributes order for element node --- src/language-handlebars/printer-glimmer.js | 54 ++++++++++++++----- .../__snapshots__/jsfmt.spec.js.snap | 33 ++++++++++++ tests/format/handlebars/attr-node/order.hbs | 11 ++++ 3 files changed, 84 insertions(+), 14 deletions(-) create mode 100644 tests/format/handlebars/attr-node/order.hbs diff --git a/src/language-handlebars/printer-glimmer.js b/src/language-handlebars/printer-glimmer.js index ded874597317..ed30314890d4 100644 --- a/src/language-handlebars/printer-glimmer.js +++ b/src/language-handlebars/printer-glimmer.js @@ -418,24 +418,50 @@ function print(path, options, print) { /* ElementNode print helpers */ +function sortByLoc(a, b) { + if (a.loc.start.line < b.loc.start.line) { + return -1; + } + + if ( + a.loc.start.line === b.loc.start.line && + a.loc.start.column < b.loc.start.column + ) { + return -1; + } + + if ( + a.loc.start.line === b.loc.start.line && + a.loc.start.column === b.loc.start.column + ) { + return 0; + } + + return 1; +} + function printStartingTag(path, print) { const node = path.getValue(); - const attributesLike = ["attributes", "modifiers", "comments", "blockParams"] - .filter((property) => isNonEmptyArray(node[property])) - .map((property) => [ - line, - property === "blockParams" - ? printBlockParams(node) - : join(line, path.map(print, property)), - ]); + const types = ["attributes", "modifiers", "comments"].filter((property) => + isNonEmptyArray(node[property]) + ); + const attributes = types + .reduce((acc, type) => [...acc, ...node[type]], []) + .sort(sortByLoc); + + for (const attributeType of types) { + path.each((attributePath) => { + const index = attributes.indexOf(attributePath.getValue()); + attributes.splice(index, 1, [line, print()]); + }, attributeType); + } - return [ - "<", - node.tag, - indent(attributesLike), - printStartingTagEndMarker(node), - ]; + if (isNonEmptyArray(node.blockParams)) { + attributes.push(line, printBlockParams(node)); + } + + return ["<", node.tag, indent(attributes), printStartingTagEndMarker(node)]; } function printChildren(path, options, print) { diff --git a/tests/format/handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap b/tests/format/handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap index 525b90080aa0..1428d2d910fc 100644 --- a/tests/format/handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap @@ -131,6 +131,39 @@ weirdly formatted ================================================================================ `; +exports[`order.hbs format 1`] = ` +====================================options===================================== +parsers: ["glimmer"] +printWidth: 80 + | printWidth +=====================================input====================================== + + +=====================================output===================================== + +================================================================================ +`; + exports[`quotes.hbs format 1`] = ` ====================================options===================================== parsers: ["glimmer"] diff --git a/tests/format/handlebars/attr-node/order.hbs b/tests/format/handlebars/attr-node/order.hbs new file mode 100644 index 000000000000..a540d8337f0f --- /dev/null +++ b/tests/format/handlebars/attr-node/order.hbs @@ -0,0 +1,11 @@ + From 7f2a261993c8fab8d2777eb22bba3f09deec933c Mon Sep 17 00:00:00 2001 From: Cyrille David Date: Thu, 27 May 2021 20:35:07 +0200 Subject: [PATCH 2/5] Add CHANGELOG --- changelog_unreleased/handlebars/10958.md | 44 ++++++++++++++++++++++++ 1 file changed, 44 insertions(+) create mode 100644 changelog_unreleased/handlebars/10958.md diff --git a/changelog_unreleased/handlebars/10958.md b/changelog_unreleased/handlebars/10958.md new file mode 100644 index 000000000000..1890c5a7779e --- /dev/null +++ b/changelog_unreleased/handlebars/10958.md @@ -0,0 +1,44 @@ +#### Preserve attributes order for element node (#10958 by @dcyriller) + + +```handlebars +{{!-- Input --}} + +{{!-- Prettier stable --}} + +{{!-- Prettier main --}} + +``` From 8a96bd77576c8ce4a042e0e4be43d2b4bed4135e Mon Sep 17 00:00:00 2001 From: Cyrille David Date: Thu, 27 May 2021 20:35:47 +0200 Subject: [PATCH 3/5] Add ...arguments in the test --- .../handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap | 2 ++ tests/format/handlebars/attr-node/order.hbs | 1 + 2 files changed, 3 insertions(+) diff --git a/tests/format/handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap b/tests/format/handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap index 1428d2d910fc..0dd3610d00c3 100644 --- a/tests/format/handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/handlebars/attr-node/__snapshots__/jsfmt.spec.js.snap @@ -147,6 +147,7 @@ printWidth: 80 @arg4="hello" {{! this is a comment for arg 5}} @arg5="hello" + ...arguments /> =====================================output===================================== @@ -160,6 +161,7 @@ printWidth: 80 @arg4="hello" {{! this is a comment for arg 5}} @arg5="hello" + ...arguments /> ================================================================================ `; diff --git a/tests/format/handlebars/attr-node/order.hbs b/tests/format/handlebars/attr-node/order.hbs index a540d8337f0f..f79a921b31a5 100644 --- a/tests/format/handlebars/attr-node/order.hbs +++ b/tests/format/handlebars/attr-node/order.hbs @@ -8,4 +8,5 @@ @arg4="hello" {{! this is a comment for arg 5}} @arg5="hello" + ...arguments /> From afb8941863a2e753874d8e73058fa788d99481cd Mon Sep 17 00:00:00 2001 From: Cyrille David Date: Thu, 27 May 2021 21:07:40 +0200 Subject: [PATCH 4/5] Apply fisker suggestions --- src/language-handlebars/printer-glimmer.js | 27 ++++------------------ 1 file changed, 5 insertions(+), 22 deletions(-) diff --git a/src/language-handlebars/printer-glimmer.js b/src/language-handlebars/printer-glimmer.js index ed30314890d4..235eac5b8749 100644 --- a/src/language-handlebars/printer-glimmer.js +++ b/src/language-handlebars/printer-glimmer.js @@ -419,25 +419,10 @@ function print(path, options, print) { /* ElementNode print helpers */ function sortByLoc(a, b) { - if (a.loc.start.line < b.loc.start.line) { - return -1; - } - - if ( - a.loc.start.line === b.loc.start.line && - a.loc.start.column < b.loc.start.column - ) { - return -1; - } - - if ( - a.loc.start.line === b.loc.start.line && - a.loc.start.column === b.loc.start.column - ) { - return 0; - } - - return 1; + return ( + a.loc.start.line - b.loc.start.line || + a.loc.start.column - b.loc.start.column + ); } function printStartingTag(path, print) { @@ -446,9 +431,7 @@ function printStartingTag(path, print) { const types = ["attributes", "modifiers", "comments"].filter((property) => isNonEmptyArray(node[property]) ); - const attributes = types - .reduce((acc, type) => [...acc, ...node[type]], []) - .sort(sortByLoc); + const attributes = types.flatMap((type) => node[type]).sort(sortByLoc); for (const attributeType of types) { path.each((attributePath) => { From ba3051ebe330d6f53cdc7e2f826c7c4940e20124 Mon Sep 17 00:00:00 2001 From: Cyrille David Date: Fri, 28 May 2021 08:50:57 +0200 Subject: [PATCH 5/5] Simplify further --- src/language-handlebars/printer-glimmer.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/src/language-handlebars/printer-glimmer.js b/src/language-handlebars/printer-glimmer.js index 235eac5b8749..66e7ae6e0b1b 100644 --- a/src/language-handlebars/printer-glimmer.js +++ b/src/language-handlebars/printer-glimmer.js @@ -419,10 +419,7 @@ function print(path, options, print) { /* ElementNode print helpers */ function sortByLoc(a, b) { - return ( - a.loc.start.line - b.loc.start.line || - a.loc.start.column - b.loc.start.column - ); + return locStart(a) - locStart(b); } function printStartingTag(path, print) {