nx: Can't find libraries when running Jest tests

Current Behavior

After updating to the latest via migrate I am unable to run Jest unit tests as it doesn’t seem to be able to resolve my nx libraries. Similar to this issue: https://stackoverflow.com/questions/72606965/testing-with-nx-jest-and-angular-cant-find-library-when-running-tests

Expected Behavior

Should be able to run Jest tests when using nx libraries.

Failure Logs

Cannot find module ‘@org/shared:ui’ from ‘src/header/header.tsx’

Environment

    "next": "^12.1.5",
    "@nrwl/cypress": "14.3.1",
    "@nrwl/eslint-plugin-nx": "14.3.1",
    "@nrwl/jest": "14.3.1",
    "@nrwl/js": "14.3.1",
    "@nrwl/linter": "14.3.1",
    "@nrwl/next": "14.3.1",
    "@nrwl/node": "14.3.1",
    "@nrwl/react": "14.3.1",
    "@nrwl/storybook": "14.3.1",
    "@nrwl/tao": "14.3.1",
    "@nrwl/web": "14.3.1",
    "@nrwl/workspace": "14.3.1",
    "jest": "^28.1.1",
    "jest-environment-jsdom": "^28.1.1",

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 5
  • Comments: 27 (3 by maintainers)

Most upvoted comments

Experiencing the same issue after updating.

I resolved it by adding a moduleNameMapper fixed at the cwd

jest.preset.js

const nxPreset = require('@nrwl/jest/preset');
const { pathsToModuleNameMapper } = require('ts-jest/utils');
const { compilerOptions } = require('./tsconfig.base.json');

module.exports = {
  ...nxPreset,
  testEnvironment: 'jsdom',
  transform: {
    '\\.(gql|graphql)$': 'jest-transform-graphql',
    '.*': 'babel-jest',
  },
  moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths, {
    prefix: process.cwd()
  })
};

It seems like moduleNameMapper should be a part of the @nrwl/jest/preset in the first place. When troubleshooting it seems like imports are being done relative to each libs folder path

if you’re using nx v14+ then you’ll need to update your preset import to

- const nxPreset = require('@nrwl/jest/preset');
+ const nxPreset = require('@nrwl/jest/preset').default;

the nx preset contains a path to the nx resolver.

on a side note, I ran into this with babel-jest for jest 28, where the fix is to include in the babel-jest transform options.

- '^.+\\.[tj]sx?$': 'babel-jest',
+ '^.+\\.[tj]sx?$': ['babel-jest', { presets: ['@nrwl/next/babel'] }],

but that’s not relevant here, just a note for anyone else coming to this issue and wanting other stuff to try.

I modified the preset from @KamalAman a little bit as the config crashing when there is JSON file in the project, and this config works for my nodejs test

const nxPreset = require('@nrwl/jest/preset');
const { pathsToModuleNameMapper } = require('ts-jest');
const { compilerOptions } = require('./tsconfig.base.json');

module.exports = {
  ...nxPreset,
  testEnvironment: 'node',
  transform: {
    '^.+\\.(ts|tsx)$': 'ts-jest',
  },
  moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths, {
    prefix: process.cwd(),
  }),
};

The @KamalAman solution works.

  • Why this happened after upgrading nx.dev / jest?
  • Should nx.dev includes this code on all generated tests?

I have tried the changes to jest.preset.js with no luck, on “@nrwl/jest”: “14.5.4”,

I found that the issue I was having was related to esm.

When it was declared as esm

// root/package.json
{
  "type": "module"
}

I must set moduleNameMapper in jest.preset.js to solve the problem.

// root/jest.preset.js
import nxPreset from '@nrwl/jest/preset/index.js';

export default {
  ...nxPreset,
  moduleNameMapper: { '^@sheencity/(.*)$': '<rootDir>/../$1/src/index.ts' },
};

When js files treated as commonjs

// root/jest.preset.js
const nxPreset = require('@nrwl/jest/preset');

module.exports = {
  ...nxPreset,
}

Everything works again. Looks like nxPreset only works in commonjs.

@marckassay Understood. I just feel I shouldn’t have to be doing this. The issue for me though is that my lib directories are 3 levels deep and my apps are only 2, so I can’t put the paths at the top level. At least I am getting errors when doing it at the top level assuming that is the issue. Thanks for the help everyone. Hopefully this helps others.

@wangzishi I think the jest.config.js at root basically grabs the jest projects, but not sure it is working. Basically anybody having this issue you must basically add all of your library dependencies to the moduleNameMapper to their folder locations and you must use <rootDir>. If you have images and such you may have to also add the file mock and image modules. Again this was all after a migrate to latest. If anyone from the NX team sees this, I think something may be busted or this may just be a feature request to make this more automated in the future.

@marckassay ok, I will try this and post back.