Fix shorthand attributes incorrectly converted to strings. (#88)

withastro · Dec 17, 2021 · ab70152 · ab70152
1 parent 8265c7d
commit ab70152
Show file tree

Hide file tree

Showing 7 changed files with 38 additions and 14 deletions.
diff --git a/.changeset/nice-impalas-live.md b/.changeset/nice-impalas-live.md
@@ -0,0 +1,5 @@
+---
+'prettier-plugin-astro': patch
+---
+
+Fix a bug in "allow shorthand" option (#87)
diff --git a/src/printer.ts b/src/printer.ts
@@ -33,6 +33,7 @@ import {
   isNodeWithChildren,
   isOrCanBeConvertedToShorthand,
   isPreTagContent,
+  isShorthandAndMustBeConvertedToBinaryExpression,
   isTextNode,
   isTextNodeEndingWithWhitespace,
   isTextNodeStartingWithLinebreak,
@@ -327,18 +328,19 @@ function print(path: AstPath, opts: ParserOptions, print: printFn): Doc {
     case 'Attribute': {
       if (isOrCanBeConvertedToShorthand(node, opts)) {
         return [line, '{', node.name, '}'];
-      } else {
-        if (node.value === true) {
-          return [line, node.name];
-        }
+      } else if (isShorthandAndMustBeConvertedToBinaryExpression(node, opts)) {
+        const attrNodeValue = printAttributeNodeValue(path, print, true, node);
+        return [line, node.name, '=', '{', attrNodeValue, '}'];
+      } else if (node.value === true) {
+        return [line, node.name];
+      }
 
-        const quotes = !isLoneMustacheTag(node.value);
-        const attrNodeValue = printAttributeNodeValue(path, print, quotes, node);
-        if (quotes) {
-          return [line, node.name, '=', '"', attrNodeValue, '"'];
-        } else {
-          return [line, node.name, '=', attrNodeValue];
-        }
+      const quotes = !isLoneMustacheTag(node.value);
+      const attrNodeValue = printAttributeNodeValue(path, print, quotes, node);
+      if (quotes) {
+        return [line, node.name, '=', '"', attrNodeValue, '"'];
+      } else {
+        return [line, node.name, '=', attrNodeValue];
       }
     }
     case 'Expression':

diff --git a/src/utils.ts b/src/utils.ts
@@ -61,13 +61,24 @@ export function isOrCanBeConvertedToShorthand(node: AttributeNode, opts: ParserO
 
   if (isLoneMustacheTag(node.value)) {
     const expression = node.value[0].expression;
-    return expression.codeChunks[0] === node.name;
+    return expression.codeChunks[0].trim() === node.name;
     // return (expression.type === 'Identifier' && expression.name === node.name) || (expression.type === 'Expression' && expression.codeChunks[0] === node.name);
   }
 
   return false;
 }
 
+/**
+ *  True if node is of type `{a}` and astroAllowShorthand is false
+ */
+export function isShorthandAndMustBeConvertedToBinaryExpression(node: AttributeNode, opts: ParserOptions): boolean {
+  if (opts.astroAllowShorthand) return false;
+  if (isAttributeShorthand(node.value)) {
+    return true;
+  }
+  return false;
+}
+
 export function flatten<T>(arrays: T[][]): T[] {
   return ([] as T[]).concat.apply([], arrays);
 }

diff --git a/test/fixtures/option-astro-allow-shorthand-false/input.astro b/test/fixtures/option-astro-allow-shorthand-false/input.astro
@@ -1,4 +1,5 @@
 ---
 import Comp from "./comp.astro"
 ---
-    <Comp options={options} />
+    <Comp options={options} />
+    <Comp {options} />
diff --git a/test/fixtures/option-astro-allow-shorthand-false/output.astro b/test/fixtures/option-astro-allow-shorthand-false/output.astro
@@ -3,3 +3,4 @@ import Comp from "./comp.astro";
 ---
 
 <Comp options={options} />
+<Comp options={options} />
diff --git a/test/fixtures/option-astro-allow-shorthand-true/input.astro b/test/fixtures/option-astro-allow-shorthand-true/input.astro
@@ -1,4 +1,6 @@
 ---
 import Comp from "./comp.astro"
 ---
-    <Comp options={options} />
+    <Comp options={options} />
+    <Comp {options} />
+    <Comp options={ options } />
diff --git a/test/fixtures/option-astro-allow-shorthand-true/output.astro b/test/fixtures/option-astro-allow-shorthand-true/output.astro
@@ -3,3 +3,5 @@ import Comp from "./comp.astro";
 ---
 
 <Comp {options} />
+<Comp {options} />
+<Comp {options} />