I have tested with my React-app in typescript, using ts-jest like below.
import * as React from "react";
import * as renderer from "react-test-renderer";
import { ChartTitle } from "Components/chart_title";
describe("Component: ChartTitle", () => {
it("will be rendered with no error", () => {
const chartTitle = "My Chart 1";
renderer.create(<ChartTitle title={chartTitle} />);
});
});
and it has passed in my local environment but failed in CircleCI.
FAIL __tests__/components/chart_title.tsx
● Test suite failed to run
TypeScript diagnostics (customize using `[jest-config].globals.ts-jest.diagnostics` option):
__tests__/components/chart_title.tsx:4:28 - error TS2307: Cannot find module 'Components/chart_title'.
4 import { ChartTitle } from "Components/chart_title";
~~~~~~~~~~~~~~~~~~~~~~~~
This Components/
is an alias expression by moduleNameMapper
, and I think it doesn't work in only CircleCI.
jest --showConfig
option tells me there is no difference between local and CI environment.
Is there any fault in my settings?
module.exports = {
globals: {
"ts-jest": {
tsConfig: "tsconfig.json",
diagnostics: true
},
NODE_ENV: "test"
},
moduleNameMapper: {
"^Components/(.+)$": "<rootDir>/src/components/$1"
},
moduleDirectories: ["node_modules", 'src'],
moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json"],
transform: {
"^.+\\.tsx?$": "ts-jest"
},
verbose: true
};
{
"compilerOptions": {
"baseUrl": "src",
"outDir": "dist",
"allowJs": true,
"checkJs": true,
"moduleResolution": "node",
"sourceMap": true,
"noImplicitAny": true,
"target": "esnext",
"module": "commonjs",
"lib": ["es6", "dom"],
"jsx": "react",
"strict": false,
"removeComments": true,
"types": ["jest"]
},
"typeRoots": ["node_modules/@types"],
"paths": {
"Components/*": ["src/components/*"]
},
"include": ["src/**/*"],
"exclude": ["node_modules", "__tests__"]
}
{
"scripts": {
"build": "webpack --mode development --watch",
"build-production": "node_modules/.bin/webpack --mode production",
"test": "jest",
"lint": "npx eslint src/**/* __tests__/**/* --ext \".ts, .tsx\"",
},
}
version: 2
jobs:
build:
...
steps:
- run:
name: run tests for frontend
command: npm test -- -u
working_directory: frontend
tsconfig-paths-jest
is not usable in Jest >23. For current Jest 26 I got it working via:https://kulshekhar.github.io/ts-jest/user/config/#paths-mapping
jest.config.js
const { pathsToModuleNameMapper } = require('ts-jest/utils');
const { compilerOptions } = require('./tsconfig');
module.exports = {
preset: 'ts-jest',
testEnvironment: 'node',
moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths, { prefix: '<rootDir>/src/' } )
};
tsconfig.json
"compilerOptions"
"baseUrl": "./src",
"paths": {
"@models/*": [ "./models/*" ],
"@inputs/*": [ "./inputs/*" ],
"@tests/*": [ "./__tests__/*" ],
"@resolvers/*": [ "./resolvers/*" ],
"@seeds/*": [ "./seeds/*" ],
"@index": [ "./index.ts" ],
"@ormconfig":[ "../ormconfig.ts" ]
},
I've finally found out its solution.
According to this issue , I use tsconfig-paths
and tsconfig-paths-jest
.
So my setting-files have changed like below.
{
"compilerOptions": {
"baseUrl": ".",
"outDir": "dist/",
"allowJs": true,
"checkJs": true,
"moduleResolution": "node",
"sourceMap": true,
"noImplicitAny": true,
"target": "es6",
"module": "commonjs",
"lib": ["es5", "es6", "dom"],
"jsx": "react",
"strict": false,
"removeComments": true,
"types": ["node", "jest"],
"paths": {
"Components/*": ["src/components/*"]
}
},
"typeRoots": ["node_modules/@types"],
"include": ["src/**/*"],
"exclude": ["node_modules", "__tests__"]
}
/* eslint-disable import/order */
/* eslint-disable @typescript-eslint/no-var-requires */
const tsconfig = require("./tsconfig.json");
const moduleNameMapper = require("tsconfig-paths-jest")(tsconfig);
module.exports = {
globals: {
"ts-jest": {
tsConfig: "tsconfig.json",
diagnostics: true
},
NODE_ENV: "test"
},
setupFilesAfterEnv: [`${__dirname}/src/setupTests.ts`],
moduleDirectories: ["node_modules", 'src'],
moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json"],
transform: {
"^.+\\.tsx?$": "ts-jest"
},
verbose: true,
moduleNameMapper
};
And my tests worked well in CircleCI, but I still have no idea why these tests had worked in my local before this solution.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.