在我的项目中运行所有测试套件时,只有1个测试套件失败,并出现以下TS验证错误。
● Test suite failed to run
node_modules/@myorg/apple/src/components/apple-application/AppleApplication.tsx:637:8 - error TS2322: Type 'unknown' is not assignable to type 'ReactNode'.
637 {node}
~~~~~~
node_modules/@types/react/index.d.ts:1343:9
1343 children?: ReactNode | undefined;
~~~~~~~~
The expected type comes from property 'children' which is declared here on type 'DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>'
jest.config.js是
module.exports = {
testEnvironment: 'jsdom',
testTimeout: 25000,
maxConcurrency: 20,
collectCoverageFrom: [
'src/**/*.js',
'src/**/*.ts',
'src/**/*.tsx',
'!**/index.*',
'!**/components.*',
'!**/node_modules/**',
'!**/*.stories.*',
'!**/*.md',
'!src/helpers/file.js',
'!src/helpers/jest-setup.js',
],
reporters: ['jest-progress-bar-reporter'],
coverageReporters: ['lcov', 'text-summary'],
testMatch: ['**/?(*.)spec.[tj]s?(x)'],
testEnvironmentOptions: { url: 'http://localhost' },
setupFilesAfterEnv: ['raf/polyfill', '<rootDir>/src/helpers/jest-setup.ts'],
transformIgnorePatterns: ['/node_modules/((?!(@myorg))/)'],
transform: {
'src/.+\\.(j|t)sx?$': 'ts-jest',
'node_modules/(@myorg)/.+\\.(j|t)sx?$': 'ts-jest',
},
moduleNameMapper: {
'\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|md)$':
'<rootDir>/src/mocks/file.js',
'^.+\\.(css|less|scss|md)$': 'identity-obj-proxy',
},
coverageThreshold: {
global: {
lines: 90,
statements: 90,
},
},
};
此外,禁用此特定模块的诊断也不能解决问题。
transform: {
'node_modules/(@myorg)/apple/.+\\.(j|t)sx?$': [
'ts-jest',
{
diagnostics: false,
},
],
'src/.+\\.(j|t)sx?$': 'ts-jest',
'node_modules/(@myorg)/.+\\.(j|t)sx?$': 'ts-jest',
},
package.json
{
"config": {
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
},
"resolutions": {
"babel-eslint-parser/semver": "^7.3.2"
"version": "1.0.0",
"private": true,
"license": "ISC",
"repository": {
"type": "git",
"url": "https://gitlab......"
},
"scripts": {
"build": "webpack --mode=production",
"build:analyse": "webpack --mode=production --env=analyse=true",
"build:ota": "webpack --mode=development",
"build:ota:analyse": "webpack --mode=development --env=analyse=true",
"build:storybook": "build-storybook -c .storybook -o storybook-static",
"commitizen": "git-cz",
"lint:js": "eslint --fix --ext .ts,.tsx src",
"lint:less": "stylelint --syntax less",
"prepare": "husky install",
"prettier": "prettier --write --check 'src/**/*.{ts,tsx,css,json,md}'",
"sonar": "sonar-scanner -Dproject.settings=sonar-project.properties",
"start": "start-storybook -p 9001 -c .storybook",
"test": "NODE_ENV=test && jest --silent --maxWorkers=50%",
"test:coverage": "jest --coverage --ci --silent --maxWorkers=50%",
"test:debug": "NODE_ENV=test && jest -t 'debug*' --maxWorkers=50%",
"test:regression": "yarn run test -c jest.config.regression.js --maxWorkers=50%",
"test:watch": "yarn run test --watch --maxWorkers=25%"
},
"dependencies": {
"@myorg/account-helpers": "^2.6.0",
"@myorg/api": "^5.0.7",
"@myorg/application": "^12.0.0",
"@myorg/browser": "^4.2.0",
"@myorg/card": "^19.3.3",
"@myorg/core-less-imports": "^2.2.18",
"@myorg/description-list": "^11.0.0",
"@myorg/design-tokens": "^10.2.0",
"@myorg/form": "^21.1.2",
"@myorg/form-block": "^9.4.0",
"@myorg/form-block-address": "^15.2.1",
"@myorg/form-block-password-create": "^14.1.0",
"@myorg/form-field-birthday": "^12.1.1",
"@myorg/form-field-checkbox": "^9.1.0",
"@myorg/form-field-datepicker": "^16.7.5",
"@myorg/form-field-iban": "^10.1.1",
"@myorg/form-field-input": "^10.1.0",
"@myorg/form-field-input-radio-button-group": "^14.0.1",
"@myorg/form-field-nationality": "^10.0.0",
"@myorg/form-field-select": "^10.1.0",
"@myorg/form-field-telephone": "^10.1.0",
"@myorg/form-field-username": "^10.1.0",
"@myorg/form-footer": "^9.2.0",
"@myorg/grid": "^2.1.3",
"@myorg/inpage-navigation": "^7.1.0",
"@myorg/apple": "^4.1.2",
"@myorg/modal": "^20.0.0",
"@myorg/monitoring": "^2.1.0",
"@myorg/my-page": "^5.5.0",
"@myorg/notification": "^15.1.1",
"@myorg/panel": "^30.1.0",
"@myorg/providers-application": "^2.1.0",
"@myorg/theme": "^10.18.1",
"@myorg/toggle-content-visibility": "^6.3.1",
"@myorg/tooltip": "^14.0.0",
"@myorg/typography": "^11.2.0",
"@myorg/username-availability": "^1.0.3",
"@myorg/visibility-sensor": "^7.0.1",
"styled-components": "^5.3.6",
"@myorg/form-field-email": "^10.2.1",
"@myorg/data-layer": "^8.0.3",
"@myorg/form-field-password": "^14.3.1",
"@myorg/button": "^18.6.1",
"@myorg/link": "^17.0.1",
"react": "17.0.2",
"react-dom": "17.0.2"
},
"devDependencies": {
"@myorg/test-utils": "^2.0.0",
"@babel/cli": "^7.19.3",
"@babel/core": "^7.20.2",
"@babel/preset-env": "^7.20.2",
"@babel/preset-react": "^7.18.6",
"@babel/preset-typescript": "^7.18.6",
"@babel/register": "^7.18.9",
"@cerner/duplicate-package-checker-webpack-plugin": "^2.3.0",
"@storybook/addon-a11y": "^6.4.19",
"@storybook/addon-essentials": "^6.5.9",
"@storybook/addon-knobs": "^6.4.0",
"@storybook/addon-queryparams": "^6.2.9",
"@storybook/addon-storyshots": "^6.5.9",
"@storybook/addon-storyshots-puppeteer": "^6.5.9",
"@storybook/addon-storysource": "^6.5.9",
"@storybook/react": "^6.5.13",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^12.1.5",
"@testing-library/user-event": "^13.2.1",
"@types/classnames": "2.3.1",
"@types/jest": "^29.2.3",
"@types/jsdom": "16.2.14",
"@types/node": "14.14.28",
"@types/styled-components": "^5.1.23",
"@typescript-eslint/eslint-plugin": "^5.18.0",
"@typescript-eslint/parser": "^5.18.0",
"autoprefixer": "9.8.6",
"babel-eslint-parser": "^7.13.10",
"babel-jest": "^29.3.1",
"babel-loader": "^8.3.0",
"babel-plugin-dynamic-import-node": "^2.3.3",
"babel-plugin-module-resolver": "^4.1.0",
"babel-plugin-require-context-hook": "^1.0.0",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"clean-webpack-plugin": "^4.0.0",
"commitizen": "4.2.4",
"cross-env": "7.0.3",
"css-loader": "5.2.7",
"css-minimizer-webpack-plugin": "1.0.0",
"cz-conventional-changelog": "3.3.0",
"enzyme": "3.11.0",
"eslint": "^8.12.0",
"eslint-plugin-react": "^7.29.4",
"eslint-plugin-react-hooks": "^4.4.0",
"eslint-plugin-unused-imports": "^2.0.0",
"fetch-mock": "9.11.0",
"fetch-mock-jest": "1.5.1",
"file-loader": "6.2.0",
"husky": "^7.0.0",
"identity-obj-proxy": "3.0.0",
"jest": "^29.3.1",
"jest-environment-jsdom": "^29.3.1",
"jest-fetch-mock": "^3.0.3",
"jest-junit": "^15.0.0",
"jest-progress-bar-reporter": "^1.0.25",
"less": "3.12.2",
"less-loader": "7.2.1",
"lint-staged": "12.4.1",
"mini-css-extract-plugin": "^1.6.2",
"mockdate": "3.0.5",
"postcss-loader": "4.1.0",
"preact": "10.8.2",
"preact-render-to-json": "3.6.6",
"prettier": "2.6.2",
"puppeteer": "^13.1.3",
"react": "17.0.2",
"react-dom": "17.0.2",
"sonarqube-scanner": "2.8.1",
"standard-version": "9.3.2",
"style-loader": "2.0.0",
"ts-jest": "^29.0.3",
"typescript": "4.6.4",
"uglifyjs-webpack-plugin": "^2.2.0",
"url-loader": "4.1.1",
"webpack": "4.44.1",
"webpack-bundle-analyzer": "^4.5.0",
"webpack-cli": "4.9.2"
}
}
奇怪的是,这个模块用在测试失败的组件中。
1条答案
按热度按时间gzszwxb41#
最后,TS验证肯定不是问题所在。在
jest.config.ts
中将ts-jest
替换为babel-jest
后,显示了实际错误。测试设置中缺少上下文提供程序。