Repository: jlongster/prettier
Pull request #456 (2017-01-25 03:49:39)

docs: add related projects
I think it may help adoption of `prettier` if people don't have to change their entire coding style all at once. These projects enable that.

Figured it'd be just as easy to create a PR as it would be to ask first :)

rhengles: @kentcdodds Please add mine: [arijs/prettier-with-tabs](https://github.com/arijs/prettier-with-tabs)

Patch:
diff --git a/README.md b/README.md
index ffdbbddb4..9d44a2902 100644
--- a/README.md
+++ b/README.md
@@ -207,6 +207,16 @@ features enabled, but you can also use
 All of JSX and Flow syntax is supported. In fact, the test suite in
 `tests` *is* the entire Flow test suite and they all pass.
 
+## Related Projects
+
+- [`prettier-eslint`](https://github.com/kentcdodds/prettier-eslint)
+passes `prettier` output to `eslint --fix`
+- [`prettier-standard-formatter`](https://github.com/dtinth/prettier-standard-formatter)
+passes `prettier` output to `standard --fix`
+- [`prettier-with-tabs`](https://github.com/arijs/prettier-with-tabs)
+allows you to configure prettier to use `tabs`
+
+
 ## Technical Details
 
 This printer is a fork of
@@ -251,3 +261,4 @@ a few notes if you are interested in contributing:
 * You can run `AST_COMPARE=1 jest` for a more robust test run. That
   formats each file, re-parses it, and compares the new AST with the
   original one and makes sure they are semantically equivalent.
+ * Each test folder has a `jsfmt.spec.js` that runs the tests. Normally you can just put `run_spec(__dirname);` there but if you want to pass specific options you can add the options object as the 2nd parameter like: `run_spec(__dirname, { parser: 'babylon' });`
diff --git a/src/printer.js b/src/printer.js
index d5f1a29c8..b2ce78ee1 100644
--- a/src/printer.js
+++ b/src/printer.js
@@ -51,9 +51,12 @@ function genericPrint(path, options, printPath) {
       // responsible for printing node.decorators.
       !util.getParentExportDeclaration(path)
   ) {
+    const separator = node.decorators.length === 1 &&
+      node.decorators[0].expression.type === "Identifier"
+      ? " " : hardline;
     path.each(
       function(decoratorPath) {
-        parts.push(printPath(decoratorPath), line);
+        parts.push(printPath(decoratorPath), separator);
       },
       "decorators"
     );
@@ -115,6 +118,9 @@ function genericPrintNoParens(path, options, print) {
         path.each(
           function(childPath) {
             parts.push(print(childPath), ";", hardline);
+            if (util.newlineExistsAfter(options.originalText, util.locEnd(childPath.getValue()))) {
+              parts.push(hardline);
+            }
           },
           "directives"
         );
@@ -458,6 +464,10 @@ function genericPrintNoParens(path, options, print) {
       parts.push(path.call(print, "source"), ";");
 
       return concat(parts);
+
+    case "Import": {
+      return "import";
+    }
     case "BlockStatement": {
       var naked = path.call(
         function(bodyPath) {
@@ -623,7 +633,7 @@ function genericPrintNoParens(path, options, print) {
                   indent(options.tabWidth, concat([softline, printedValue]))
                 ])
               ),
-              line,
+              softline,
               ifBreak(")")
             ])
           );


Test patch:
diff --git a/tests/decorators/__snapshots__/jsfmt.spec.js.snap b/tests/decorators/__snapshots__/jsfmt.spec.js.snap
new file mode 100644
index 000000000..7f0de6828
--- /dev/null
+++ b/tests/decorators/__snapshots__/jsfmt.spec.js.snap
@@ -0,0 +1,64 @@
+exports[`test mobx.js 1`] = `
+"import {observable} from \"mobx\";
+
+@observer class OrderLine {
+  @observable price:number = 0;
+  @observable amount:number = 1;
+
+  constructor(price) {
+    this.price = price;
+  }
+
+  @computed get total() {
+    return this.price * this.amount;
+  }
+}
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+import { observable } from \"mobx\";
+
+@observer class OrderLine {
+  @observable price: number = 0;
+  @observable amount: number = 1;
+
+  constructor(price) {
+    this.price = price;
+  }
+
+  @computed get total() {
+    return this.price * this.amount;
+  }
+}
+"
+`;
+
+exports[`test multiple.js 1`] = `
+"const dog = {
+  @readonly
+  @nonenumerable
+  @doubledValue
+  legs: 4
+};
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+const dog = {
+  @readonly
+  @nonenumerable
+  @doubledValue
+  legs: 4
+};
+"
+`;
+
+exports[`test redux.js 1`] = `
+"@connect(mapStateToProps, mapDispatchToProps)
+export class MyApp extends React.Component {}
+
+@connect(state => ({ todos: state.todos }))
+export class Home extends React.Component {}
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+@connect(mapStateToProps, mapDispatchToProps)
+export class MyApp extends React.Component {}
+
+@connect(state => ({ todos: state.todos }))
+export class Home extends React.Component {}
+"
+`;
diff --git a/tests/decorators/jsfmt.spec.js b/tests/decorators/jsfmt.spec.js
new file mode 100644
index 000000000..939578260
--- /dev/null
+++ b/tests/decorators/jsfmt.spec.js
@@ -0,0 +1,1 @@
+run_spec(__dirname, {parser: 'babylon'});
diff --git a/tests/decorators/mobx.js b/tests/decorators/mobx.js
new file mode 100644
index 000000000..adb461b0e
--- /dev/null
+++ b/tests/decorators/mobx.js
@@ -0,0 +1,14 @@
+import {observable} from "mobx";
+
+@observer class OrderLine {
+  @observable price:number = 0;
+  @observable amount:number = 1;
+
+  constructor(price) {
+    this.price = price;
+  }
+
+  @computed get total() {
+    return this.price * this.amount;
+  }
+}
diff --git a/tests/decorators/multiple.js b/tests/decorators/multiple.js
new file mode 100644
index 000000000..3a41e7b8d
--- /dev/null
+++ b/tests/decorators/multiple.js
@@ -0,0 +1,6 @@
+const dog = {
+  @readonly
+  @nonenumerable
+  @doubledValue
+  legs: 4
+};
diff --git a/tests/decorators/redux.js b/tests/decorators/redux.js
new file mode 100644
index 000000000..481658f81
--- /dev/null
+++ b/tests/decorators/redux.js
@@ -0,0 +1,5 @@
+@connect(mapStateToProps, mapDispatchToProps)
+export class MyApp extends React.Component {}
+
+@connect(state => ({ todos: state.todos }))
+export class Home extends React.Component {}
diff --git a/tests/directives/__snapshots__/jsfmt.spec.js.snap b/tests/directives/__snapshots__/jsfmt.spec.js.snap
index f680d0532..b63c61eb4 100644
--- a/tests/directives/__snapshots__/jsfmt.spec.js.snap
+++ b/tests/directives/__snapshots__/jsfmt.spec.js.snap
@@ -1,3 +1,40 @@
+exports[`test newline.js 1`] = `
+"/* @flow */
+
+\"use strict\";
+
+import a from \"a\";
+
+a();
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+/* @flow */
+
+\"use strict\";
+
+import a from \"a\";
+
+a();
+"
+`;
+
+exports[`test newline.js 2`] = `
+"/* @flow */
+
+\"use strict\";
+
+import a from \"a\";
+
+a();
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+/* @flow */
+\"use strict\";
+
+import a from \"a\";
+
+a();
+"
+`;
+
 exports[`test test.js 1`] = `
 "\"use strict\";
 
@@ -12,3 +49,18 @@ function fn() {
 }
 "
 `;
+
+exports[`test test.js 2`] = `
+"\"use strict\";
+
+function fn() {
+  \"use strict\";
+}
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+\"use strict\";
+
+function fn() {
+  \"use strict\";
+}
+"
+`;
diff --git a/tests/directives/jsfmt.spec.js b/tests/directives/jsfmt.spec.js
index 989047bcc..d5ec770a9 100644
--- a/tests/directives/jsfmt.spec.js
+++ b/tests/directives/jsfmt.spec.js
@@ -1,1 +1,2 @@
 run_spec(__dirname);
+run_spec(__dirname, {parser: 'babylon'});
diff --git a/tests/directives/newline.js b/tests/directives/newline.js
new file mode 100644
index 000000000..8da10321b
--- /dev/null
+++ b/tests/directives/newline.js
@@ -0,0 +1,7 @@
+/* @flow */
+
+"use strict";
+
+import a from "a";
+
+a();
diff --git a/tests/dynamic_import/__snapshots__/jsfmt.spec.js.snap b/tests/dynamic_import/__snapshots__/jsfmt.spec.js.snap
new file mode 100644
index 000000000..84ca69b4c
--- /dev/null
+++ b/tests/dynamic_import/__snapshots__/jsfmt.spec.js.snap
@@ -0,0 +1,8 @@
+exports[`test test.js 1`] = `
+"import(\"module.js\");
+import(\"module.js\").then((a) => a);
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+import(\"module.js\");
+import(\"module.js\").then(a => a);
+"
+`;
diff --git a/tests/dynamic_import/jsfmt.spec.js b/tests/dynamic_import/jsfmt.spec.js
new file mode 100644
index 000000000..939578260
--- /dev/null
+++ b/tests/dynamic_import/jsfmt.spec.js
@@ -0,0 +1,1 @@
+run_spec(__dirname, {parser: 'babylon'});
diff --git a/tests/dynamic_import/test.js b/tests/dynamic_import/test.js
new file mode 100644
index 000000000..36ed1ef84
--- /dev/null
+++ b/tests/dynamic_import/test.js
@@ -0,0 +1,2 @@
+import("module.js");
+import("module.js").then((a) => a);
diff --git a/tests/flow/logical/__snapshots__/jsfmt.spec.js.snap b/tests/flow/logical/__snapshots__/jsfmt.spec.js.snap
index f3cab28a7..2ff1eac92 100644
--- a/tests/flow/logical/__snapshots__/jsfmt.spec.js.snap
+++ b/tests/flow/logical/__snapshots__/jsfmt.spec.js.snap
@@ -901,14 +901,14 @@ function logical12b(y: number): number {
  */
 function logical13(x: number): Array<{ x: string }> {
   return [
-    { x: x && \"bar\"  },
-    { x: true && \"bar\"  },
-    { x: true && false  },
-    { x: false && false  },
-    { x: 1 && \"bar\"  },
-    { x: \"foo\" && \"bar\"  },
-    { x: \"foo\" && \"bar\"  },
-    { x: \"foo\" && \"bar\"  }
+    { x: x && \"bar\" },
+    { x: true && \"bar\" },
+    { x: true && false },
+    { x: false && false },
+    { x: 1 && \"bar\" },
+    { x: \"foo\" && \"bar\" },
+    { x: \"foo\" && \"bar\" },
+    { x: \"foo\" && \"bar\" }
   ];
 }
 
@@ -917,14 +917,14 @@ function logical13(x: number): Array<{ x: string }> {
  */
 function logical14(x: number): Array<{ x: string }> {
   return [
-    { x: x || \"bar\"  },
-    { x: false || \"bar\"  },
-    { x: false || true  },
-    { x: true || false  },
-    { x: 0 || \"bar\"  },
-    { x: \"foo\" || \"bar\"  },
-    { x: \"foo\" || \"bar\"  },
-    { x: \"foo\" || \"bar\"  }
+    { x: x || \"bar\" },
+    { x: false || \"bar\" },
+    { x: false || true },
+    { x: true || false },
+    { x: 0 || \"bar\" },
+    { x: \"foo\" || \"bar\" },
+    { x: \"foo\" || \"bar\" },
+    { x: \"foo\" || \"bar\" }
   ];
 }
 
diff --git a/tests/trailing_comma/__snapshots__/jsfmt.spec.js.snap b/tests/trailing_comma/__snapshots__/jsfmt.spec.js.snap
index d6a325b0a..b03422f52 100644
--- a/tests/trailing_comma/__snapshots__/jsfmt.spec.js.snap
+++ b/tests/trailing_comma/__snapshots__/jsfmt.spec.js.snap
@@ -77,6 +77,11 @@ const aLong = {
   },
   dHasALongName: \'a-long-value-too\'
 };
+
+const aLong = {
+  dHasALongName: \'a-long-value-too\',
+  eHasABooleanExpression: a === a,
+};
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 const a = { b: true, c: { c1: \"hello\" }, d: false };
 
@@ -88,6 +93,11 @@ const aLong = {
   },
   dHasALongName: \"a-long-value-too\"
 };
+
+const aLong = {
+  dHasALongName: \"a-long-value-too\",
+  eHasABooleanExpression: a === a
+};
 "
 `;
 
@@ -108,6 +118,11 @@ const aLong = {
   },
   dHasALongName: \'a-long-value-too\'
 };
+
+const aLong = {
+  dHasALongName: \'a-long-value-too\',
+  eHasABooleanExpression: a === a,
+};
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 const a = { b: true, c: { c1: \"hello\" }, d: false };
 
@@ -119,5 +134,10 @@ const aLong = {
   },
   dHasALongName: \"a-long-value-too\",
 };
+
+const aLong = {
+  dHasALongName: \"a-long-value-too\",
+  eHasABooleanExpression: a === a,
+};
 "
 `;
diff --git a/tests/trailing_comma/object.js b/tests/trailing_comma/object.js
index 9bdc3b1f2..10c074ca9 100644
--- a/tests/trailing_comma/object.js
+++ b/tests/trailing_comma/object.js
@@ -14,3 +14,8 @@ const aLong = {
   },
   dHasALongName: 'a-long-value-too'
 };
+
+const aLong = {
+  dHasALongName: 'a-long-value-too',
+  eHasABooleanExpression: a === a,
+};