Flowtype "Not covered by Flow" on object property chains

Question

I'm trying to use Flow, but I keep getting the "Not covered by Flow" warning, so my code is mostly underlined. I checked the Flow documentation, but it wasn't helpful regarding object property chaining, so how do you get something like this to work?

Answer 1

It appears that you are using a library that does not have type definitions.

With property lookups where the object is defined within the file, Flow has 100% code coverage without any types at all:

const foo = { bar: { baz: 2 } };
foo.bar.baz;
// 100% Flow coverage

Same goes for separate files:

1.js

// @flow
export default { bar: { baz: 2 } };

2.js

// @flow
import foo from './1.js'
foo.bar.baz;
// 100% code coverage

However, as soon as something is being imported from a file that Flow does not run on (either because it has flow turned off or because its a third-party library that does not use flow), Flow is not able to cover it.

1.js

// @noflow
export default { bar: { baz: 2 } };

2.js

// @flow
import foo from './1.js'
foo.bar.baz;
// 0% code coverage

In order to fix this, you need to give Flow information about the types.

You can do a couple of different things

• Make a.js covered by Flow.
• Add a a.js.flow file that declare's the types
• If it's a third-party library add a flow-typed/a.js file that adds declarations.
• But be sure to check flow-typed to see if a definition file already exists. (And contribute back!)

Hopefully this is helpful enough to give you at least a starting point