16

I am using Jest with TypeScript. Despite the fact that my code works and I can build my project, Visual Studio Code throws me that error for all Jest methods (describe(), test()...):

Cannot find name 'describe'. Do you need to install type definitions for a test runner? Try `npm i @types/jest` or `npm i @types/mocha`.ts(2582)

I have src and tests directories that are separated. I followed configurations found on the Internet but it doesn't change anything, what am I missing? The only way so far is to include my tests folder in the include setting in tsconfig, which is bad because it's built in the dist directory.

Dev dependencies installed: jest ts-jest @types/jest

tsconfig.json

{
  "compilerOptions": {
    "sourceMap": true,
    "module": "commonjs",
    "moduleResolution": "node",
    "esModuleInterop": true,
    "allowJs": true,
    "jsx": "react",
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "baseUrl": "./",
    "paths": {
      "*": ["src/*"]
    },
    "typeRoots": ["./node_modules/@types"],
    "types": ["node", "jest"]
  },
  "strict": true,
  "compileOnSave": false,
  "include": ["src"]
}

jest.config.js

module.exports = {
  roots: ['<rootDir>'],
  preset: 'ts-jest',
  testRegex: 'tests/src/.*\\.test.(js|jsx|ts|tsx)$',
  transform: {
    '^.+\\.tsx?$': 'ts-jest',
  },
  transformIgnorePatterns: [],
  snapshotSerializers: ['enzyme-to-json/serializer'],
  moduleDirectories: ['node_modules', 'src', 'tests'],
  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
  moduleNameMapper: {
    '\\.(css|scss|jpg|png|svg)$': 'mocks/empty.ts',
  },
  setupFilesAfterEnv: ['<rootDir>/tests/jest.setup.ts'],
  collectCoverage: true,
  collectCoverageFrom: ['src/**/*.{js{,x},ts{,x}}', '!src/index.tsx', '!src/custom.d.ts'],
}
Mohammad Fared
  • 588
  • 1
  • 7
  • 19
Alpha60
  • 411
  • 5
  • 11
  • I don't think the issue is with your `tsconfig.json` file, you should not have to do anything there, not sure about your `jest.config.js` file, but have you tried developing a test using `it()` and if so can you post that code with the import statements? Also, what are you running in terminal to run the test? Keep in mind that Jest does not have any knowledge of TypeScript out of the box and even when using `jest` and `ts-jest` there will be issues. – Daniel Oct 18 '20 at 00:38
  • Please see the answer to the similar question: https://stackoverflow.com/a/61153019/3082178. – AKd Nov 19 '20 at 11:16

2 Answers2

3

Just include jest as typeAcquisition in your tsconfig.json like:

// tsconfig.json
{
  "compilerOptions": { /* ... */ },
  "typeAcquisition": { "include": ["jest"] },
  // ... your other options go here
}
Yannick Schuchmann
  • 512
  • 1
  • 5
  • 15
  • 2
    Love it! Thank you! As of 19 Aug 2022 this option is now called "types" in `tsconfig.json` as opposed to "typeAcquisition". – Manfred Aug 19 '22 at 05:00
  • @Manfred afaic on the reference: https://www.typescriptlang.org/tsconfig that's not correct. `types` is a field of `compilerOptions` but the important setting is `typeAcquisition`. Or am I wrong? – Yannick Schuchmann Aug 19 '22 at 20:13
  • Yes, you're correct. My mistake. :-) – Manfred Aug 21 '22 at 05:58
2

I have the same problem. And I find the solution - open it in the project's root directory, not the parent one. Or, you can create a workspace with your projects.

oneWalker
  • 46
  • 8