2

I want to implement some jest tests in my backend and so I was trying to map my paths that I have configured in tsconfig.json via the moduleNameMapper of jest.config.js but when I run the tests I find the file is still not imported and I am shown this error on line 8 ⬇
error received from running test

Please assist me to map my paths correctly, I would highly appreciate any help.
To help you assist me here are the important files.
jest.config.js (where jest is usually configured) ⬇

/** @type {import('ts-jest/dist/types').InitialOptionsTsJest} */
module.exports = {
  preset: 'ts-jest',
  testEnvironment: 'node',
  testMatch: ["**/***.test.ts"],
  verbose: true,
  forceExit: true,
  
  moduleNameMapper: {
    '@util/(.*)': '<rootDir>/src/util/$1'
  }
};

tsconfig.json (normal config file for typescript) ⬇

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "baseUrl": "src",
    "paths": {
      "@util/*": ["util/*"]
    },
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "skipLibCheck": true
  }
}
Charleskimani
  • 440
  • 7
  • 25

2 Answers2

3

I created a file named .babelrc with this contents ⬇ :

{
  "presets": ["@babel/preset-env"]
}

I then configured jest.config.js as shown below ⬇

/** @type {import('ts-jest/dist/types').InitialOptionsTsJest} */
module.exports = {
  transform: {
    '^.+\\.ts$': 'ts-jest',
    '^.+\\.js$': 'babel-jest',
    '^.+\\.mjs$': 'babel-jest',
  },
  moduleDirectories: ['node_modules', '<rootDir>/src'],
  moduleNameMapper: {
    '@controllers/(.*)': '<rootDir>/src/controllers/$1',
    '@middleware/(.*)': '<rootDir>/src/middleware/$1',
    '@models/(.*)': '<rootDir>/src/models/$1',
    '@routes/(.*)': '<rootDir>/src/routes/$1',
    '@types/(.*)': '<rootDir>/src/types/$1',
    '@util/(.*)': '<rootDir>/src/util/$1',
  }
};

I then configured tsconfig.json as shown below ⬇:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "baseUrl": "src",
    "paths": {
      "@util/*": ["util/*"]
    },
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "skipLibCheck": true,
    "types": ["jest"]
  }
}

Vote of thanks to Benjamin Drury & @Ashok for the much helpful support.

Charleskimani
  • 440
  • 7
  • 25
0

This issue is occuring due to absolute import. If you look closely, you can observe that your import statement is util/logger. This kind of imports are not properly resolved.

In case you are using VSCode, then this is a common occurence, since VSCode tries to reduce the length of your import statement.

To fix this, use relative import. So your import should look like as follow:

import logger from '../util/logger'

(Note: Above import is relative to the path src/middleware/authenticateUser.ts, please update the import based on in which file you are using the import)

Ashok
  • 2,411
  • 1
  • 13
  • 23
  • Thankyou for this @Ashok , however in this codebase we have so many other different paths that we have implemented importing of many files this way hence, I must know how to change from the jest side. Have you ever tried what I am doing and then had to change all your import statements or what do you mean by saying they are not properly resolved? Are you saying it is impossible? – Charleskimani Mar 28 '22 at 18:06
  • @Charleskimani In such case, please try https://stackoverflow.com/a/51174924/5309486 answer. – Ashok Mar 28 '22 at 18:09
  • I am now getting this error @Ashok: SyntaxError: Cannot use import statement outside a module Jest failed to parse a file. This happens e.g. when your code or its dependencies use non-standard JavaScript syntax, or when Jest is not configured to support such syntax. – Charleskimani Mar 28 '22 at 18:15
  • Ignoring a problem won't solve it! – amir Aug 12 '22 at 17:56