Format directives (#156)

* format directives * chore: add changeset * chore: fix test title
withastro · Mar 24, 2022 · 67341e7 · 67341e7
1 parent 0ed661a
commit 67341e7
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 13 deletions.
diff --git a/.changeset/bright-pens-shout.md b/.changeset/bright-pens-shout.md
@@ -0,0 +1,5 @@
+---
+'prettier-plugin-astro': patch
+---
+
+Format directives
diff --git a/src/nodes.ts b/src/nodes.ts
@@ -1,7 +1,6 @@
 import {
   Node,
   AttributeNode,
-  DirectiveNode,
   RootNode,
   ElementNode,
   ComponentNode,
@@ -286,7 +285,6 @@ export const selfClosingTags = [
 export type anyNode =
   | RootNode
   | AttributeNode
-  | DirectiveNode
   | ElementNode
   | ComponentNode
   | CustomElementNode

diff --git a/src/options.ts b/src/options.ts
@@ -1,5 +1,10 @@
 import { SupportOption } from 'prettier';
 
+declare module 'prettier' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface RequiredOptions extends PluginOptions {}
+}
+
 export interface PluginOptions {
   astroSortOrder: SortOrder;
   astroAllowShorthand: boolean;

diff --git a/src/printer.ts b/src/printer.ts
@@ -250,7 +250,7 @@ function print(path: AstPath, opts: ParserOptions, print: printFn): Doc {
         isEmpty &&
         (node.type !== 'element' || selfClosingTags.indexOf(node.name) !== -1);
 
-      const attributes = node.attributes ? path.map(print, 'attributes') : [];
+      const attributes = path.map(print, 'attributes');
       if (isSelfClosingTag) {
         return group(['<', node.name, indent(group(attributes)), line, `/>`]);
         // return group(['<', node.name, indent(group([...attributes, opts.jsxBracketNewLine ? dedent(line) : ''])), ...[opts.jsxBracketNewLine ? '' : ' ', `/>`]]);
@@ -419,10 +419,6 @@ function print(path: AstPath, opts: ParserOptions, print: printFn): Doc {
       return '';
     }
 
-    case 'directive': {
-      return [line, node.name];
-    }
-
     case 'doctype': {
       // https://www.w3.org/wiki/Doctypes_and_markup_styles
       return ['<!DOCTYPE html>', hardline];
@@ -619,7 +615,7 @@ function embed(
     formatttedScript = stripTrailingHardline(formatttedScript);
 
     // print
-    const attributes = node.attributes ? path.map(print, 'attributes') : [];
+    const attributes = path.map(print, 'attributes');
     const openingTag = group([
       '<script',
       indent(group(attributes)),
@@ -671,12 +667,10 @@ function embed(
         formattedStyles = stripTrailingHardline(formattedStyles);
 
         // print
-        const attributes = node.attributes ? path.map(print, 'attributes') : [];
-        const directives = node.directives ? path.map(print, 'directives') : [];
-        const attrAndDirectives = directives.concat(attributes);
+        const attributes = path.map(print, 'attributes');
         const openingTag = group([
           '<style',
-          indent(group(attrAndDirectives)),
+          indent(group(attributes)),
           softline,
           '>',
         ]);
@@ -707,7 +701,7 @@ function embed(
 
         // print
         const formattedSass = join(hardline, formattedSassIndented.split('\n'));
-        const attributes = node.attributes ? path.map(print, 'attributes') : [];
+        const attributes = path.map(print, 'attributes');
         const openingTag = group([
           '<style',
           indent(group(attributes)),

diff --git a/test/fixtures/directive/input.astro b/test/fixtures/directive/input.astro
@@ -0,0 +1,5 @@
+---
+  const content = "lorem"
+---
+
+    <h1 set:html =  {content  }></h1>
diff --git a/test/fixtures/directive/output.astro b/test/fixtures/directive/output.astro
@@ -0,0 +1,5 @@
+---
+const content = "lorem";
+---
+
+<h1 set:html={content}></h1>
diff --git a/test/tests/other.test.ts b/test/tests/other.test.ts
@@ -61,3 +61,5 @@ test('Format spread operator', 'spread-operator');
 test('Can format nested comment', 'nested-comment');
 
 test('format binary expressions', 'binary-expression');
+
+test('format directives', 'directive');