[jest-expo]: wrong TypeScript mappings using Jest Projects

[ernestostifano]

Summary

Hello,

I am using jest-expo v50.0.4 along with Jest Projects and it is creating a wrong entry in the moduleNameMapper field.

Particularly, given the following simplified repo structure:

.
├── packages
│   └── the-jest-project
│       └── jest.config.cjs
└── tsconfig.json

And the following paths in the tsconfig.json file:

"paths": {
    "@my-scope/*": ["./packages/*"]
}

Running jest --show-config outputs the following for the project's moduleNameMapper field:

"moduleNameMapper": [
  [
    "[.]module[.]css$",
    "identity-obj-proxy"
  ],
  [
    "^([.]{1,2}/.*)[.]js$",
    "$1"
  ],
  [
    "^@my-scope/(.*)$",
    "/path/to/repository/packages/the-jest-project/packages/$1"
  ],
  [
    "^react-native-vector-icons$",
    "@expo/vector-icons"
  ],
  [
    "^react-native-vector-icons/(.*)",
    "@expo/vector-icons/$1"
  ]
]

The mapped value "/path/to/repository/packages/the-jest-project/packages/$1" is obviously wrong. And it breaks all matching tests.

This happens because you are using <rootDir> here, which within Jest Projects refers to the project (package) root and not the root of the repository. Instead, TypeScript mappings refer to the root of the repository.

This potentially will break many projects, especially monorepos, which are encouraged to implement Jest Projects approach.

I would suggest to make your TypeScript mappings feature opt-in (or allow to opt-out to no introduce breaking changes) or drop it altogether since I am not sure you will be able to consistently adapt it to the multiple possible edge cases.

Additionally, your moduleNameMapper values cannot be overridden. My temporary solution was to add the following entries before, with a pattern that does not break:

"moduleNameMapper": [
  [
    "[.]module[.]css$",
    "identity-obj-proxy"
  ],
  [
    "^([.]{1,2}/.*)[.]js$",
    "$1"
  ],
  [
    "^@my-scope/core/jest-setup",
    "/path/to/repository/packages/core/src/jest.setup"
  ],
  [
    "^@my-scope/([A-z0-9-]+)/dev$",
    "/path/to/repository/packages/$1/src/dev"
  ],
  [
    "^@my-scope/([A-z0-9-]+)$",
    "/path/to/repository/packages/$1/src"
  ],
  [
    "^@my-scope/(.*)$",
    "/path/to/repository/packages/the-jest-project/packages/$1"
  ],
  [
    "^react-native-vector-icons$",
    "@expo/vector-icons"
  ],
  [
    "^react-native-vector-icons/(.*)",
    "@expo/vector-icons/$1"
  ]
]

Now, this is not ideal for many reasons, but especially because it breaks native ESM exports resolution, for example:

testEnvironmentOptions: {
    customExportConditions: [
        'development',
        'react-native',
        'require',
        'default'
    ]
}

Because the exports field in a package JSON could have many complex configurations that are not replicable using moduleNameMapper alone.

What platform(s) does this occur on?

No response

SDK Version

N/A

Environment

N/A

Minimal reproducible example

N/A

[byCedric]

Hi @ernestostifano! Thanks for the issue report. I'm not sure if I follow the results from the moduleNameMapper here. It should indeed use <rootDir>, but not the absolute path that's you mentioned.

This is modeled after ts-jest's own tsconfig path mapper to jest (here, snapshot test).

Is it possible to provide a repro for us to investigate the issue further?