Fix: Group long name method in bind expressions (#4447)

* Fix: Group long name method in bind expressions

* Add test for short name method in bind expressions

src/language-js/printer-estree.js

@@ -534,6 +534,7 @@ function printPathNoParens(path, options, print, args) {
       const shouldInline =
         (firstNonMemberParent &&
           (firstNonMemberParent.type === "NewExpression" ||
+            firstNonMemberParent.type === "BindExpression" ||
             (firstNonMemberParent.type === "VariableDeclarator" &&
               firstNonMemberParent.id.type !== "Identifier") ||
             (firstNonMemberParent.type === "AssignmentExpression" &&
@@ -565,7 +566,13 @@ function printPathNoParens(path, options, print, args) {
         parts.push(path.call(print, "object"));
       }
 
-      parts.push(printBindExpressionCallee(path, options, print));
+      parts.push(
+        group(
+          indent(
+            concat([softline, printBindExpressionCallee(path, options, print)])
+          )
+        )
+      );
 
       return concat(parts);
     case "Identifier": {

tests/bind_expressions/__snapshots__/jsfmt.spec.js.snap

@@ -22,6 +22,52 @@ a || b::c
 
 `;
 
+exports[`long_name_method.js 1`] = `
+class X {
+  constructor() {
+    this.testLongNameMethodAndSomethingElseLallala = ::this.testLongNameMethodAndSomethingElseLallala;
+  }
+  
+  testLongNameMethodAndSomethingElseLallala() {
+    return true;
+  }
+}~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+class X {
+  constructor() {
+    this.testLongNameMethodAndSomethingElseLallala =
+      ::this.testLongNameMethodAndSomethingElseLallala;
+  }
+
+  testLongNameMethodAndSomethingElseLallala() {
+    return true;
+  }
+}
+
+`;
+
+exports[`long_name_method.js 2`] = `
+class X {
+  constructor() {
+    this.testLongNameMethodAndSomethingElseLallala = ::this.testLongNameMethodAndSomethingElseLallala;
+  }
+  
+  testLongNameMethodAndSomethingElseLallala() {
+    return true;
+  }
+}~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+class X {
+  constructor() {
+    this.testLongNameMethodAndSomethingElseLallala =
+      ::this.testLongNameMethodAndSomethingElseLallala
+  }
+
+  testLongNameMethodAndSomethingElseLallala() {
+    return true
+  }
+}
+
+`;
+
 exports[`method_chain.js 1`] = `
 import {interval} from 'rxjs/observable/interval';
 import {filter} from 'rxjs/operator/filter';
@@ -99,3 +145,47 @@ function test(observable) {
 }
 
 `;
+
+exports[`short_name_method.js 1`] = `
+class X {
+  constructor() {
+    this.shortMethod = ::this.shortMethod;
+  }
+  
+  shortMethod() {
+    return true;
+  }
+}~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+class X {
+  constructor() {
+    this.shortMethod = ::this.shortMethod;
+  }
+
+  shortMethod() {
+    return true;
+  }
+}
+
+`;
+
+exports[`short_name_method.js 2`] = `
+class X {
+  constructor() {
+    this.shortMethod = ::this.shortMethod;
+  }
+  
+  shortMethod() {
+    return true;
+  }
+}~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+class X {
+  constructor() {
+    this.shortMethod = ::this.shortMethod
+  }
+
+  shortMethod() {
+    return true
+  }
+}
+
+`;

tests/bind_expressions/long_name_method.js

@@ -0,0 +1,9 @@
+class X {
+  constructor() {
+    this.testLongNameMethodAndSomethingElseLallala = ::this.testLongNameMethodAndSomethingElseLallala;
+  }
+  
+  testLongNameMethodAndSomethingElseLallala() {
+    return true;
+  }
+}

tests/bind_expressions/short_name_method.js

@@ -0,0 +1,9 @@
+class X {
+  constructor() {
+    this.shortMethod = ::this.shortMethod;
+  }
+  
+  shortMethod() {
+    return true;
+  }
+}