Flow: Methods on exported classes need "extra" 'Function' annotation if implemented as arrow functions

[indigoviolet]

I'm guessing the below behavior (error on Foo2.bar2) is a consequence of annotations being required at module boundaries, and the arrow type annotation syntax not quite counting because bar2 is technically a class property. This is a bit unfortunate, though, since the arrow syntax seems to be the recommendation for bound methods on ES6 React classes

// @flow

export class Foo {
  bar(): this {
    return this;
  };
}

export class Foo2 {
  // test.js:11
  //  11:   bar2 = (): this => {
  //        ^ class property `bar2`. Missing annotation
  //
  //
  // Found 1 error
  bar2 = (): this => {
    return this;
  };
}

export class Foo3 {
  bar3: Function = (): this => {
    return this;
  };
}

[indigoviolet]

ping?

[dtaub]

It also doesn't really make sense that the Function annotation satisfies the type annotations at module boundaries requirement while providing no additional type information. If anything, what should be enforced are the type annotations on the arrow function itself, i.e. foo = (bar: string): number => {. The current alternative is to use the double arrow syntax which is redundant and not very readable.

I understand why the current behavior is the case since, as was pointed out, it's technically a class property and is treated like any other class property rather than like a method, and an exception would need to be made for that syntax. But since React's documentation promotes the arrow syntax for binding methods, perhaps it's worth making the exception to have Flow treat them as methods.

[pvolok]

Was it fixed in b73fed6d6ec929a31f37aa10b1aeb76eb83e3462?

[dtaub]

@pvolok Nice, haven't tried it but looks that way. I guess that will be released in 0.28.

[calebmer]

You can only use the this type in class methods. Since this is a class property you may not use this.