What's the right way to write Jest tests verified with Flow?

Viewed 18520

I imagine people commonly use Flow and Jest (and React) together, but Flow doesn't seem to know about Jest (or Jasmine) globals. When I add // @flow to my tests, I get Flow errors like this:

src/__tests__/Thing-test.js:3
  3: jest.unmock('../Thing')
     ^^^^ identifier `jest`. Could not resolve name

src/__tests__/Thing-test.js:7
  7: describe('Thing', () => {
     ^^^^^^^^ identifier `describe`. Could not resolve name

src/__tests__/Thing-test.js:8
  8:   it('does stuff', () => {
       ^^ identifier `it`. Could not resolve name

I could write a Flow interface for Jest/Jasmine, but that seems lengthy and like I must be missing something. Letting Flow process node_modules/jest-cli doesn't seem to help.

5 Answers

The accepted answer does not work if you use Create-React-App. Here is how you would set up jest with CRA:

1.Install flow to your project

If you use create-reat-app, here is a guide for this step.

yarn add -D flow-bin
yarn run flow init

2. Install jest flow types

npx flow-typed install jest@22 // maybe you need a different version

(You can use npx jest -v to check your jest version if you use create-react-app.)

3. Register flow-typed in config

(Update: as @Black points out in the comments, this step may not even be neccessary)

In your .flowconfig, add flow-typed to libs section.

...
[libs]
flow-typed
...

I use yarn, npm should work just the same.

You can also run it as a one liner. Here you go:

npm i -D flow-typed && npx flow-typed install jest@"$(npx jest -v)"
Related