Battling with TS, Jest, the testing library and the IDE

Ok so this is so basic I’m not sure it warrants an article but at the same time, it’s caught me out and annoyed me so many times that I’m going to commit a post to the t’interwebs so I at least have somewhere to go when I fall face first into this issue next time.

Photo by Ethan Hasenfratz on Unsplash

The problem is a fairly simple one. You have installed all the npm i gubbins, everything works fine when you run jest and the tests pass buuuuuuuuuuuuttttttttt the IDE has decided it’s taken offence to the toBeInTheDocument from @testinglibrary/react. You know it’s there, jest knows it’s there and the tests happily pass.

ERROR: toBeInTheDocument does not exist on type JestMatchers<HTMLElement>

OH NO…. The Computer says NO!!!!

To happily satisfy the IDE’s thirst for knowledge of all that it prevails you need to drop this little beauty in the tsconfig.json file.

{
  "compilerOptions": {
    //...
    "types": ["jest", "@types/node", "@testing-library/jest-dom"],
    //...
  }
}

You MAY also need to give the ts compiler a kick. At least in InteliJ I have had to on the odd occasion restart the TS service.

Restarting the TS service in IntelliJ IDEA

It’s all good in the world of the IDE