keep script directives at top of file, fixes #185

src/preprocessors/preprocessor.ts

@@ -1,6 +1,6 @@
-import { ParserOptions, parse as babelParser } from '@babel/parser';
+import { parse as babelParser, ParserOptions } from '@babel/parser';
 import traverse, { NodePath } from '@babel/traverse';
-import { ImportDeclaration, isTSModuleDeclaration } from '@babel/types';
+import { Directive, ImportDeclaration, isTSModuleDeclaration } from '@babel/types';
 
 import { PrettierOptions } from '../types';
 import { getCodeFromAst } from '../utils/get-code-from-ast';
@@ -26,7 +26,15 @@ export function preprocessor(code: string, options: PrettierOptions) {
     const ast = babelParser(code, parserOptions);
     const interpreter = ast.program.interpreter;
 
+    const directives: Directive[] = [];
     traverse(ast, {
+        Directive({ node }) {
+            directives.push(node);
+
+            // Trailing comments probably shouldn't be attached to the directive
+            node.trailingComments = null;
+        },
+
         ImportDeclaration(path: NodePath<ImportDeclaration>) {
             const tsModuleParent = path.findParent((p) =>
                 isTSModuleDeclaration(p),
@@ -48,5 +56,5 @@ export function preprocessor(code: string, options: PrettierOptions) {
         importOrderSortSpecifiers,
     });
 
-    return getCodeFromAst(allImports, code, interpreter);
+    return getCodeFromAst(allImports, directives, code, interpreter);
 }

src/utils/__tests__/get-code-from-ast.spec.ts

@@ -22,7 +22,7 @@ import a from 'a';
         importOrderGroupNamespaceSpecifiers: false,
         importOrderSortSpecifiers: false,
     });
-    const formatted = getCodeFromAst(sortedNodes, code, null);
+    const formatted = getCodeFromAst(sortedNodes, [], code, null);
     expect(format(formatted, { parser: 'babel' })).toEqual(
         `// first comment
 // second comment

src/utils/get-code-from-ast.ts

@@ -1,5 +1,5 @@
 import generate from '@babel/generator';
-import { InterpreterDirective, Statement, file } from '@babel/types';
+import { Directive, InterpreterDirective, Statement, file } from '@babel/types';
 
 import { newLineCharacters } from '../constants';
 import { getAllCommentsFromNodes } from './get-all-comments-from-nodes';
@@ -12,12 +12,14 @@ import { removeNodesFromOriginalCode } from './remove-nodes-from-original-code';
  */
 export const getCodeFromAst = (
     nodes: Statement[],
+    directives: Directive[],
     originalCode: string,
     interpreter?: InterpreterDirective | null,
 ) => {
     const allCommentsFromImports = getAllCommentsFromNodes(nodes);
 
     const nodesToRemoveFromCode = [
+        ...directives,
         ...nodes,
         ...allCommentsFromImports,
         ...(interpreter ? [interpreter] : []),
@@ -31,7 +33,7 @@ export const getCodeFromAst = (
     const newAST = file({
         type: 'Program',
         body: nodes,
-        directives: [],
+        directives,
         sourceType: 'module',
         interpreter: interpreter,
         sourceFile: '',

src/utils/remove-nodes-from-original-code.ts

@@ -1,6 +1,7 @@
 import {
     CommentBlock,
     CommentLine,
+    Directive,
     ImportDeclaration,
     InterpreterDirective,
     Statement,
@@ -21,6 +22,7 @@ export const removeNodesFromOriginalCode = (
     nodes: (
         | Statement
         | CommentBlock
+        | Directive
         | CommentLine
         | ImportDeclaration
         | InterpreterDirective

tests/ImportsNotSeparated/__snapshots__/ppsi.spec.js.snap

@@ -151,6 +151,23 @@ function add(a: number, b: number) {
 
 `;
 
+exports[`imports-with-directives.ts - typescript-verify: imports-with-directives.ts 1`] = `
+'use strict';
+'use client';
+
+// comments after directives
+import otherthing from "@core/otherthing";
+import abc from "@core/abc";
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+"use strict";
+"use client";
+
+// comments after directives
+import abc from "@core/abc";
+import otherthing from "@core/otherthing";
+
+`;
+
 exports[`imports-with-file-level-comments.ts - typescript-verify: imports-with-file-level-comments.ts 1`] = `
 //@ts-ignore
 // I am file top level comments

tests/ImportsNotSeparated/imports-with-directives.ts

@@ -0,0 +1,6 @@
+'use strict';
+'use client';
+
+// comments after directives
+import otherthing from "@core/otherthing";
+import abc from "@core/abc";