From 4e46f92b8648c7f25de62bfaf4368aa3f2e588d9 Mon Sep 17 00:00:00 2001 From: Zaven Muradyan Date: Fri, 25 Oct 2019 12:10:43 -0700 Subject: [PATCH] Add formatting for i18n attributes. (#6695) * Add formatting for i18n attributes. Previously, Prettier would largely ignore i18n attributes, not even wrapping their content, which wasn't ideal since i18n descriptive text can sometimes get long. After this, Prettier will auto-wrap the contents of i18n attributes once they exceed the line length. Fixes #5875. --- CHANGELOG.unreleased.md | 31 +++ src/language-html/printer-html.js | 9 + .../__snapshots__/jsfmt.spec.js.snap | 262 ++++++++++++++++++ tests/html_angular/attributes.component.html | 9 + 4 files changed, 311 insertions(+) diff --git a/CHANGELOG.unreleased.md b/CHANGELOG.unreleased.md index efefa677..10b564ae 100644 --- a/CHANGELOG.unreleased.md +++ b/CHANGELOG.unreleased.md @@ -1082,6 +1082,35 @@ sometimes{{nogaps}}areimportant {{name}} is your name ``` +#### Angular: Add formatting for `i18n` attributes ([#6695] by [@voithos]) + +Prettier will auto-wrap the contents of `i18n` attributes once they exceed the line length. + + +```html + +

+ Hello! +

+ + +

+ Hello! +

+ + +

+ Hello! +

+``` + #### JavaScript: Break arrays of arrays/objects if each element has more than one element/property ([#6694] by [@sosukesuzuki]) @@ -1177,6 +1206,7 @@ new Map([ [#6646]: https://github.com/prettier/prettier/pull/6646 [#6666]: https://github.com/prettier/prettier/pull/6666 [#6673]: https://github.com/prettier/prettier/pull/6673 +[#6695]: https://github.com/prettier/prettier/pull/6695 [#6694]: https://github.com/prettier/prettier/pull/6694 [@brainkim]: https://github.com/brainkim [@duailibe]: https://github.com/duailibe @@ -1194,3 +1224,4 @@ new Map([ [@selvazhagan]: https://github.com/selvazhagan [@chadian]: https://github.com/chadian [@kaicataldo]: https://github.com/kaicataldo +[@voithos]: https://github.com/voithos diff --git a/src/language-html/printer-html.js b/src/language-html/printer-html.js index 9a082ba4..ba073a41 100644 --- a/src/language-html/printer-html.js +++ b/src/language-html/printer-html.js @@ -1033,6 +1033,11 @@ function printEmbeddedAttributeValue(node, originalTextToDoc, options) { * bindon-target="angularExpression" */ const ngExpressionBindingPatterns = ["^\\[.+\\]$", "^bind(on)?-"]; + /** + * i18n="longDescription" + * i18n-attr="longDescription" + */ + const ngI18nPatterns = ["^i18n(-.+)?$"]; if (isKeyMatched(ngStatementBindingPatterns)) { return printMaybeHug(ngTextToDoc(getValue(), { parser: "__ng_action" })); @@ -1042,6 +1047,10 @@ function printEmbeddedAttributeValue(node, originalTextToDoc, options) { return printMaybeHug(ngTextToDoc(getValue(), { parser: "__ng_binding" })); } + if (isKeyMatched(ngI18nPatterns)) { + return printExpand(fill(getTextValueParts(node, getValue()))); + } + if (isKeyMatched(ngDirectiveBindingPatterns)) { return printMaybeHug( ngTextToDoc(getValue(), { parser: "__ng_directive" }) diff --git a/tests/html_angular/__snapshots__/jsfmt.spec.js.snap b/tests/html_angular/__snapshots__/jsfmt.spec.js.snap index 94383d6d..c305f1f7 100644 --- a/tests/html_angular/__snapshots__/jsfmt.spec.js.snap +++ b/tests/html_angular/__snapshots__/jsfmt.spec.js.snap @@ -182,6 +182,15 @@ printWidth: 80 {{ valid }} baz' + i18n="Normal i18n text" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n-test="Attribute i18n text" + i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription" > =====================================output===================================== @@ -308,6 +317,31 @@ printWidth: 80 {{ valid }} baz" + i18n="Normal i18n text" + i18n=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n-test="Attribute i18n text" + i18n-test=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n=" + This is yet another very long internationalization description text, + exceeding the configured print width, but could easily be formatted + " + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n=" + some meaning|Some very long internationalization description text exceeding + the configured print width@@customIdWithDescription + " > ================================================================================ @@ -420,6 +454,15 @@ trailingComma: "es5" {{ valid }} baz' + i18n="Normal i18n text" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n-test="Attribute i18n text" + i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription" > =====================================output===================================== @@ -546,6 +589,31 @@ trailingComma: "es5" {{ valid }} baz" + i18n="Normal i18n text" + i18n=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n-test="Attribute i18n text" + i18n-test=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n=" + This is yet another very long internationalization description text, + exceeding the configured print width, but could easily be formatted + " + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n=" + some meaning|Some very long internationalization description text exceeding + the configured print width@@customIdWithDescription + " > ================================================================================ @@ -657,6 +725,15 @@ printWidth: 1 {{ valid }} baz' + i18n="Normal i18n text" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n-test="Attribute i18n text" + i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription" > =====================================output===================================== @@ -1023,6 +1100,123 @@ printWidth: 1 }} baz" + i18n=" + Normal + i18n + text + " + i18n=" + This + is + a + very + long + internationalization + description + text, + exceeding + the + configured + print + width, + but + could + easily + be + formatted + " + i18n-test=" + Attribute + i18n + text + " + i18n-test=" + This + is + a + very + long + internationalization + description + text, + exceeding + the + configured + print + width, + but + could + easily + be + formatted + " + i18n=" + This + is + a + very + long + internationalization + description + text, + exceeding + the + configured + print + width, + but + could + easily + be + formatted + " + i18n=" + This + is + yet + another + very + long + internationalization + description + text, + exceeding + the + configured + print + width, + but + could + easily + be + formatted + " + i18n=" + @@customId + " + i18n=" + Some + description@@customIdWithDescription + " + i18n=" + some + meaning|Some + description@@customIdWithDescription + " + i18n=" + some + meaning|Some + very + long + internationalization + description + text + exceeding + the + configured + print + width@@customIdWithDescription + " > ================================================================================ @@ -1135,6 +1329,15 @@ printWidth: 80 {{ valid }} baz' + i18n="Normal i18n text" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n-test="Attribute i18n text" + i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription" > =====================================output===================================== @@ -1261,6 +1464,31 @@ printWidth: 80 {{ valid }} baz" + i18n="Normal i18n text" + i18n=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n-test="Attribute i18n text" + i18n-test=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n=" + This is yet another very long internationalization description text, + exceeding the configured print width, but could easily be formatted + " + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n=" + some meaning|Some very long internationalization description text exceeding + the configured print width@@customIdWithDescription + " > ================================================================================ @@ -1373,6 +1601,15 @@ printWidth: 80 {{ valid }} baz' + i18n="Normal i18n text" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n-test="Attribute i18n text" + i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription" > =====================================output===================================== @@ -1499,6 +1736,31 @@ printWidth: 80 {{ valid }} baz" + i18n="Normal i18n text" + i18n=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n-test="Attribute i18n text" + i18n-test=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n=" + This is a very long internationalization description text, exceeding the + configured print width, but could easily be formatted + " + i18n=" + This is yet another very long internationalization description text, + exceeding the configured print width, but could easily be formatted + " + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n=" + some meaning|Some very long internationalization description text exceeding + the configured print width@@customIdWithDescription + " > ================================================================================ diff --git a/tests/html_angular/attributes.component.html b/tests/html_angular/attributes.component.html index 291533d0..1fa9c389 100644 --- a/tests/html_angular/attributes.component.html +++ b/tests/html_angular/attributes.component.html @@ -98,4 +98,13 @@ {{ valid }} baz' + i18n="Normal i18n text" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n-test="Attribute i18n text" + i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted" + i18n="@@customId" + i18n="Some description@@customIdWithDescription" + i18n="some meaning|Some description@@customIdWithDescription" + i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription" >