Jest-preset-angular: Could not locate module ./create_spy

[jesusbotella]

Hello,

I'm trying to test my Ionic app using jest, and I'm getting this error when executing jest command.

The error I see is:

 FAIL  src/components/variant-selector/variant-selector.test.ts
  ● Test suite failed to run

    Configuration error:

    Could not locate module ./create_spy (mapped as /Users/jesus/Development/app/src/./create_spy)

    Please check:

    "moduleNameMapper": {
      "/(.*)/": "/Users/jesus/Development/app/src/$1"
    },
    "resolver": undefined

The package.json jest config that I have is:

"jest": {
    "preset": "jest-preset-angular",
    "setupTestFrameworkScriptFile": "<rootDir>/src/test.ts"
}

The setup file that I created has the same content as the one in the README.

import 'jest-preset-angular';
import './jestGlobalMocks';

And my test file is:

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By }              from '@angular/platform-browser';
import { DebugElement }    from '@angular/core';

import { VariantSelector } from './variant-selector';

describe('Variant Selector', () => {
  let fixture: ComponentFixture<VariantSelector>;
  let variantSelectorComponent: VariantSelector;
  let element: HTMLElement;

  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [VariantSelector]
    });

    fixture = TestBed.createComponent(VariantSelector);
    variantSelectorComponent = fixture.componentInstance;
    element = fixture.nativeElement;
  });
});

I think that my test file is not the thing which fails, because I tried to comment the whole file out and it kept failing. I also tried to apply the modified moduleNameMapper config in the README, and nothing happened.

The project does not fully match the Angular CLI structure, as it comes from Ionic, but the route I see in the error (/Users/jesus/Development/app/src/./create_spy) looks weird.

It may be something on my side but I don't see what it could be.

Thank you!

[fulls1z3]

I had the same issue when I upgraded to jest v21, from v20. Try setting moduleNameMapper to null in your package.json, it worked with me.

package.json

"jest": {
  ...
  "moduleNameMapper": null,
  ...
}

[thymikee]

Just released v3.0.0 which finally includes this patch: https://github.com/thymikee/jest-preset-angular/pull/53. Please note this https://github.com/thymikee/jest-preset-angular#absolute-imports

[jesusbotella]

@thymikee It is still failing to me.

 FAIL  src/components/variant-selector/variant-selector.spec.ts
  ● Test suite failed to run

    Configuration error:

    Could not locate module ./components/app/app-root (mapped as /Users/jesus/Development/app/src/app/app-root)

    Please check:

    "moduleNameMapper": {
      "/app\/(.*)/": "/Users/jesus/Development/app/src/app/$1"
    },
    "resolver": undefined

What can I do if I have modules like ionic that I have to transform? It does not get the module path correctly and it maps to the app directory instead of node_modules folder.

My transformIgnorePatterns config looks like:

 "transformIgnorePatterns": [
    "node_modules/(?!@ngrx|@ionic-native|@ionic)"
]

I tested it with Jest v20 and everything was good.

[thymikee]

@jesusbotella these are 2 unrelated things. Can you point me to a repro case?
moduleNameMapper is usually used for absolute paths, so you should test for a string starting with certain string:

"moduleNameMapper": {
  "^app\/(.*)": "<rootDir>/src/app/$1"
},

and in code:

import sth from 'app/sth';

[4kochi]

@jesusbotella Maybe you should try this:

"moduleNameMapper": {
    "^ionic\/(.*)": "<rootDir>/node_modules/ionic/$1"
},

[tom10271]

I am using 4.0.1 already and it is not working

[thymikee]

@tom10271 remove your node_modules and install again.

[tom10271]

It works after removing moduleNameMapper.

Thanks