Cypress: Clashing types with Jest

Question

I am facing the problem the types in Cypress and Jest clashing (such as "expect").

example.spec.ts

expect(value).toBe(0) // Property 'toBe' does not exist on type 'Assertion'.

I edited tsconfig.json in the following way, but it did not solve.

Remove "cypress" from "types" property
Exclude the jest spec files from in tsconfig.json and declare another tsconfig
Exclude the jest spec files from in tsconfig.json and add tsconfig in cypress directory

Here's my tsconfig

{
  "compilerOptions": {
    "target": "ES2018",
    "module": "ESNext",
    "moduleResolution": "Node",
    "resolveJsonModule": true,
    "lib": [
      "ESNext",
      "ESNext.AsyncIterable",
      "DOM"
    ],
    "esModuleInterop": true,
    "allowJs": true,
    "sourceMap": true,
    "strict": true,
    "noEmit": true,
    "experimentalDecorators": true,
    "baseUrl": ".",
    "paths": {
      "~/*": [
        "./*"
      ],
      "@/*": [
        "./*"
      ]
    },
    "types": [
      "@nuxt/types",
      "@nuxtjs/axios",
      "@types/node",
      "nuxt-i18n",
      "jest"
    ]
  },
  "exclude": [
    "node_modules",
    ".nuxt",
    "dist"
  ]
}

score 12 · Answer 1 · answered Jul 30 '21 at 06:22

I solved the problem with the following:

./tsconfig.json

{
  "compilerOptions": {
    "isolatedModules": true,
    ...
  },
  "exclude": ["cypress/**/*"]
}

./cypress/tsconfig.json

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "isolatedModules": false
  },
  "include": [
    "../node_modules/cypress"
  ]
}

Greg Wozniak · Answer 2 · 2023-02-06T08:46:58.263

1

In my case, it was enough to exclude the Cypress configuration file name in the project' tsconfig.json. I did not need to put "isolatedModules" flag.

Example:

  "exclude": [
    ...
    "cypress.config.ts",
    ...
  ]

In my case, it worked in a project with webpack, jest, react-testing-library with extensions and Cypress.

Note: if your Webpack uses a different tsconfig.json make sure you exclude it there too. Otherwise, you will not see any error in IDE but you will see them whilst making a build.

edited Feb 06 '23 at 08:46

answered Oct 11 '22 at 20:42

Greg Wozniak

5,209
3
26
29

1

This did the trick for me – Skyy2010 Jan 31 '23 at 12:42

score 0 · Answer 3 · answered Sep 27 '22 at 07:57

It seems to be a known issue of type conflicts between cypress and jest. Most accounts have detected that the problem started occurring from cypress v10.x onward.

The following links corroborate the OP's own answer, suggesting the exclusion of cypress.config.ts from tsconfig.json. It may or may not be a workaround, however it has worked for me as well.

Link 1: https://github.com/cypress-io/cypress/issues/22059

Link 2: https://github.com/nrwl/nx/issues/863

It should be noted that the tests executed successfully despite the type clash, for me, despite not having yet excluded cypress from tsconfig.json.

If your own answer has solved your issue, then you can mark it as answered and close it.

score 0 · Answer 4 · answered Jan 25 '23 at 18:13

I would suggest , in the parent tsconfig.json:

"types": ["jest"]. // or ["jasmine", "jasmine-expect"], depends on setup
"exclude": [
    "cypress/**/*.ts",
    "cypress.config.ts",
    "node_modules/cypress*/*.ts"
  ]

Then, in the cypress/tsconfig.json :

"types": ["cypress", "chai"],
"include": [
    "../cypress/**/*.ts",
    "../cypress.config.ts",
    "../node_modules/cypress/**/*.ts"
  ]

NOTE: my project also has a tsconfig.spec.json.

Cypress: Clashing types with Jest

4 Answers4