Handle multiline expression printing inside of element (#51)

adamzapasnik · Jun 3, 2021 · 33effb4 · 33effb4
1 parent 069080c
commit 33effb4
Show file tree

Hide file tree

Showing 19 changed files with 783 additions and 299 deletions.
diff --git a/lib/formatter.js b/lib/formatter.js
@@ -1,7 +1,7 @@
-const { concat, indent, hardline, group } = require('prettier').doc.builders;
-const { format } = require('prettier');
+const { concat, indent, hardline, group, line } = require('prettier').doc.builders;
+const { printDocToString } = require('prettier').doc.printer;
 
-const formatMultilineExpressions = (tokens, options) => {
+const formatMultilineExpressions = (tokens, options, embedTextToDoc) => {
   return tokens
     .map((token) => ({ ...token }))
     .map((token) => {
@@ -18,7 +18,8 @@ const formatMultilineExpressions = (tokens, options) => {
 
         try {
           if (!formatRaw) {
-            formattedExpression = format(expression, { ...options, parser: 'ruby' });
+            formattedExpression = embedTextToDoc(expression, { ...options, parser: 'ruby' });
+            formattedExpression.parts.pop(); // removes newline at the end
           }
         } catch (error) {
           formatRaw = true;
@@ -46,7 +47,7 @@ const formatMultilineExpressions = (tokens, options) => {
             .join('\n');
         }
 
-        if (formattedExpression.trim().match(/\r?\n/)) {
+        if (typeof formattedExpression === 'string' && formattedExpression.trim().match(/\r?\n/)) {
           const formattedMultilineExpression = formattedExpression
             .trim()
             .split(/\r?\n/)
@@ -62,9 +63,21 @@ const formatMultilineExpressions = (tokens, options) => {
               closingFullTag,
             ])
           );
+        } else if (typeof formattedExpression === 'object') {
+          token.content = group(
+            concat([openingFullTag, indent(concat([line, formattedExpression])), line, closingFullTag])
+          );
         } else {
           token.content = group(concat([openingFullTag, ' ', formattedExpression.trim(), ' ', closingFullTag]));
         }
+
+        // prettier-html-templates can't handle objects in this case, only strings
+        // TODO: multiline strings aren't formatted correctly, it'd be nice if we could pass the object
+        // maybe it will be achievable with 2.3 prettier compability
+        if (token.inElement && typeof token.content === 'object') {
+          const { formatted } = printDocToString(token.content, { ...options });
+          token.content = formatted;
+        }
       }
 
       return token;

diff --git a/lib/printers.js b/lib/printers.js
@@ -19,7 +19,7 @@ function print(path, options, _print) {
     return prettier.format(options.originalText, { ...options, parser: 'html' });
   }
 
-  const formattedTokens = formatMultilineExpressions(tokens, options);
+  const formattedTokens = formatMultilineExpressions(tokens, options, embedTextToDoc);
 
   const isTextOnlyWithSingleExpression =
     expressionsCount === 1 && !tokens.find((token) => token.type === 'text' && token.content.trim());