Cypress causing type errors in jest assertions

Question

I had been using react-testing-library as well as @testing-library/jest-dom/extend-expect. I installed Cypress yesterday, and now I'm getting Typescript errors on all my jest matchers:

Property 'toEqual' doesn't exist on type 'Assertion'. Did you mean 'equal'?

It looks like it's getting the type of expect from the wrong assertion library or something? Also, expect(...).to.equal(...) doesn't even work either.

I actually tried installing @types/jest and yarn appears to have succeeded but it's not listed in my package.json's devDependencies.

Here's my tsconfig

{   "compilerOptions": {     "target": "es5",     "lib": [       "dom",       "dom.iterable",       "esnext"     ],     "allowJs": true,     "skipLibCheck": true,     "esModuleInterop": true,     "allowSyntheticDefaultImports": true,     "strict": true,     "noImplicitAny": false,     "forceConsistentCasingInFileNames": true,     "module": "esnext",     "moduleResolution": "node",     "resolveJsonModule": true,     "isolatedModules": false,     "noEmit": true,     "jsx": "react",     "skipDefaultLibCheck": true,     "types": [       "node",       "cypress",       "jest"     ]   },   "include": [     "src"   ] } 

I'll also mention that all my cy calls in my cypress tests are getting a cy is not defined error from ESLint.

Answer 1

I ran into this problem yesterday. It seems that what you are saying is correct, cypress and jest both declares types for expect. In this case the cypress declaration seem to be the one that is picked up. Here's an issue from the cypress repo regarding this:

https://github.com/cypress-io/cypress/issues/1603

The solution mentioned in there worked for me. You need to exclude the jest spec files from in tsconfig.json and then declare a tsconfig.spec.json where they are explicitly included again.

tsconfig.json:

{   ...,   "exclude": [     "**/*.spec.ts"   ] } 

tsconfig.spec.json:

{   "extends": "./tsconfig.json",   "include": [     "**/*.spec.ts"   ],   ... } 

With this in place, both my (angular 8) app compiles fine and I can run the jest tests without issue. Here's another example mentioned in the issue with a similar fix being implemented:

https://github.com/neiltownsley/react-typescript-cypress/pull/1/files#diff-e5e546dd2eb0351f813d63d1b39dbc48R29