diff --git a/changelog_unreleased/handlebars/14067.md b/changelog_unreleased/handlebars/14067.md new file mode 100644 index 000000000000..6edfdfc9426a --- /dev/null +++ b/changelog_unreleased/handlebars/14067.md @@ -0,0 +1,57 @@ +#### Group params in opening block statements (#14067 by @jamescdavis) + +This is a follow-up to #13930 to establish wrapping consistency between opening block statements and else blocks by +grouping params in opening blocks. This causes params to break to a new line together and not be split across lines +unless the length of params exceeds the print width. This also updates the else block wrapping to behave exactly the +same as opening blocks. + + +```hbs +{{! Input }} +{{#block param param param param param param param param param param as |blockParam|}} + Hello +{{else block param param param param param param param param param param as |blockParam|}} + There +{{/block}} + +{{! Prettier stable }} +{{#block + param + param + param + param + param + param + param + param + param + param + as |blockParam| +}} + Hello +{{else block param +param +param +param +param +param +param +param +param +param}} + There +{{/block}} + +{{! Prettier main }} +{{#block + param param param param param param param param param param + as |blockParam| +}} + Hello +{{else block + param param param param param param param param param param + as |blockParam| +}} + There +{{/block}} +``` diff --git a/src/language-handlebars/printer-glimmer.js b/src/language-handlebars/printer-glimmer.js index 19249ff52a9a..55277f4c8e8d 100644 --- a/src/language-handlebars/printer-glimmer.js +++ b/src/language-handlebars/printer-glimmer.js @@ -30,6 +30,10 @@ const { isWhitespaceNode, } = require("./utils.js"); +/** + * @typedef {import("../document").Doc} Doc + */ + const NEWLINES_TO_PRESERVE_MAX = 2; // Formatter based on @glimmerjs/syntax's built-in test formatter: @@ -529,27 +533,24 @@ function printInverseBlockClosingMustache(node) { function printOpenBlock(path, print) { const node = path.getValue(); + /** @type {Doc[]} */ + const parts = []; - const openingMustache = printOpeningBlockOpeningMustache(node); - const closingMustache = printOpeningBlockClosingMustache(node); - - const attributes = [printPath(path, print)]; - - const params = printParams(path, print); - if (params) { - attributes.push(line, params); + const paramsDoc = printParams(path, print); + if (paramsDoc) { + parts.push(group(paramsDoc)); } if (isNonEmptyArray(node.program.blockParams)) { - const block = printBlockParams(node.program); - attributes.push(line, block); + parts.push(printBlockParams(node.program)); } return group([ - openingMustache, - indent(attributes), + printOpeningBlockOpeningMustache(node), + printPath(path, print), + parts.length > 0 ? indent([line, join(line, parts)]) : "", softline, - closingMustache, + printOpeningBlockClosingMustache(node), ]); } @@ -564,24 +565,18 @@ function printElseBlock(node, options) { function printElseIfLikeBlock(path, print, ifLikeKeyword) { const node = path.getValue(); - let blockParams = []; - - if (isNonEmptyArray(node.program.blockParams)) { - blockParams = [line, printBlockParams(node.program)]; - } - const parentNode = path.getParentNode(1); return group([ printInverseBlockOpeningMustache(parentNode), - indent( - group([ - group(["else", line, ifLikeKeyword]), - line, - printParams(path, print), - ]) - ), - indent(blockParams), + ["else", " ", ifLikeKeyword], + indent([ + line, + group(printParams(path, print)), + ...(isNonEmptyArray(node.program.blockParams) + ? [line, printBlockParams(node.program)] + : []), + ]), softline, printInverseBlockClosingMustache(parentNode), ]); diff --git a/tests/format/handlebars/block-statement/__snapshots__/jsfmt.spec.js.snap b/tests/format/handlebars/block-statement/__snapshots__/jsfmt.spec.js.snap index 8894daaed253..b519b203c234 100644 --- a/tests/format/handlebars/block-statement/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/handlebars/block-statement/__snapshots__/jsfmt.spec.js.snap @@ -17,6 +17,10 @@ printWidth: 80 Hello {{/block}} +{{#block param param param param param param param param param param param hashKey=hashValue as |blockParam|}} + Hello +{{/block}} + {{#block param param param param param param param hashKey=HashValue hashKey=hashValue}} Hello {{/block}} @@ -71,14 +75,7 @@ printWidth: 80 }}{{/block}} {{#block - param - param - param - param - param - param - param - hashKey=hashValue + param param param param param param param hashKey=hashValue as |blockParam| }} Hello @@ -92,26 +89,24 @@ printWidth: 80 param param param - hashKey=HashValue + param + param + param + param hashKey=hashValue + as |blockParam| }} Hello {{/block}} {{#block - param - param - param - param - param - param - param - param - param - param - param - param - param + param param param param param param param hashKey=HashValue hashKey=hashValue +}} + Hello +{{/block}} + +{{#block + param param param param param param param param param param param param param }} Hello {{/block}} @@ -294,6 +289,24 @@ printWidth: 80 {{f}} {{/when}} +{{#when abcdefghijklmnopqrstuvwxy abcdefghijklmnopqrstuvwxy abcdefghijklmnopqrstuvwxy as |b|}} + {{b}} +{{else when abcdefghijklmnopqrstuvwxy abcdefghijklmnopqrstuvwxy abcdefghijklmnopqrstuvwxy as |d|}} + {{d}} +{{/when}} + +{{#when abcdefghijklmnopqrstuvwxyz abcdefghijklmnopqrstuvwxyz abcdefghijklmnopqrstuvwxyz as |b|}} + {{b}} +{{else when abcdefghijklmnopqrstuvwxyz abcdefghijklmnopqrstuvwxyz abcdefghijklmnopqrstuvwxyz as |d|}} + {{d}} +{{/when}} + +{{#abcdefghijklmnopqrstuvwxyz-abcdefghijklmnopqrstuvwxyz-abcdefghijklmnopqrst param param param as |foo|}} + 1 +{{else abcdefghijklmnopqrstuvwxyz-abcdefghijklmnopqrstuvwxyz-abcdefghijklmnopqrst param param param as |bar|}} + 2 +{{/abcdefghijklmnopqrstuvwxyz-abcdefghijklmnopqrstuvwxyz-abcdefghijklmnopqrst}} + =====================================output=====================================