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

JestjsFlowtype

Jestjs Problem Overview


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.

Jestjs Solutions


Solution 1 - Jestjs

Although Jest is written with flow annotations they strip types for the npm version so we don't need babel to run it. Fortunately the types are already in flow-type so the solution is quite easy (just as mentioned in the comment):

npm install -g flow-typed

flow-typed install jest@22.x.x # <-- replace the version with the latest

Although I had to add this line as well to my .eslintrc.json:

{
  "env": {
    "jest": true
  }
}

Solution 2 - Jestjs

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.

Solution 3 - Jestjs

If you created your project with create-react-app you have to manually add jest to your packages.json. Otherwise flow-typed won't install the needed type definitions because create-react-app doesn't add this dependency to packages.json.

yarn add --dev jest
flow-typed install

Solution 4 - Jestjs

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)"

Solution 5 - Jestjs

I think declare var jest: any; should do the trick (put it either on top of each test file, or somewhere in your flow lib directory).

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionTrevor RobinsonView Question on Stackoverflow
Solution 1 - JestjsKutyelView Answer on Stackoverflow
Solution 2 - JestjsHinrichView Answer on Stackoverflow
Solution 3 - JestjsJan KühnleinView Answer on Stackoverflow
Solution 4 - JestjsulocoView Answer on Stackoverflow
Solution 5 - JestjsNikitaView Answer on Stackoverflow