Flow cannot see typings inside extendObservable

[houshuang]

Because of problems getting decorators to work with Babel 7 (#1345), I tried switching to extendObservable, which worked perfectly, however now Flow doesn't recognize any of my typings, so ie if I have

class A {
  constructor() {
    extendObservable(this, {
      setName: action((name: string) => { ... }
    })
  }
}

const a = new A()
a.setName('hello')

This will work fine, however Flow will complain that a doesn't have a method setName. I could add all of the type definitions in the top of the class file, but we're talking many tens of actions and computed properties across a bunch of files. IS there any way to get Flow to pick up the typings from extendObservable? (With decorators, this worked flawlessly).

thanks!

[mweststrate]

You could check whether the flow typings for extendObservable / action are correct. Unlike the typescript ones, the Flow ones are handcrafted so they might contain mistakes / be incomplete. Op wo 7 feb. 2018 om 10:42 schreef Stian Håklev <notifications@github.com>:

…

Because of problems getting decorators to work with Babel 7 (#1345 <#1345>), I tried switching to extendObservable, which worked perfectly, however now Flow doesn't recognize any of my typings, so ie if I have class A { constructor() { extendObservable(this, { setName: action((name: string) => { ... } }) } } const a = new A()a.setName('hello') This will work fine, however Flow will complain that a doesn't have a method setName. I could add all of the type definitions in the top of the class file, but we're talking many tens of actions and computed properties across a bunch of files. IS there any way to get Flow to pick up the typings from extendObservable? (With decorators, this worked flawlessly). thanks! — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#1346>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABvGhF0fdvqwv7cTqIa4Ve20AxHT4BYNks5tSW_4gaJpZM4R8aGX> .

[mweststrate]

Edit: sorry, misread the question initially. Probably you should still declare setName in your class:

class A {
  constructor() {
    extendObservable(this, {
      setName: action((name: string) => { ... }
    })
  }

  setName: (name:string) => void;
}

Not entirely sure how that is done properly in flow :). But, from Mobx4 onward, you can simply do this:

import { decorate, action } from "mobx"

class A {
  setName(name: string) {
  }
}
decorate(A, { setName: action })

Which should avoid the typing problem