在 React Native 上运行 Jest/Enzyme 测试时出现 Babel 错误
经过巨大的软件包升级后,在我们的应用程序上运行 Jest 测试时,我们遇到了这个错误:
TypeError: [BABEL] /home/grubshka/devel/project/src/engine/models/Hive.ts: Cannot add property 1, object is not extensible
at Array.push (<anonymous>)
at node_modules/@babel/core/lib/config/full.js:314:26
at Function.<anonymous> (node_modules/@babel/core/lib/gensync-utils/async.js:25:3)
at evaluateSync (node_modules/gensync/index.js:251:28)
at Function.sync (node_modules/gensync/index.js:89:14)
at sync (node_modules/@babel/core/lib/gensync-utils/async.js:68:25)
at sync (node_modules/gensync/index.js:182:19)
at onFirstPause (node_modules/gensync/index.js:210:24)
错误的第一个路径是相当随机的,有时它来自反应本机文件...
在本地计算机上,如果我们随机运行测试特定文件,经过一些测试后它开始工作,并且在所有测试工作之后,似乎某处有一些缓存...... 在 CI 上,它永远不起作用。
这是我们的主要配置文件:
// babel.config.js
module.exports = {
presets: [
'module:metro-react-native-babel-preset',
'@babel/preset-typescript',
'@babel/preset-flow'
],
plugins: [
['@babel/plugin-transform-flow-strip-types'],
['@babel/plugin-proposal-decorators', { legacy: true }],
['@babel/plugin-proposal-class-properties', { loose: true }]
],
env: {
production: {
plugins: ['react-native-paper/babel']
}
}
}
// jest.config.js
const { defaults: tsjPreset } = require('ts-jest/presets')
module.exports = {
...tsjPreset,
preset: 'react-native',
globals: {
'ts-jest': {
tsconfig: 'tsconfig.jest.json',
babelConfig: true
}
},
transform: {
...tsjPreset.transform,
'^.+\\.jsx?$': '<rootDir>/node_modules/react-native/jest/preprocessor.js',
'^.+\\.tsx?$': 'ts-jest'
},
/*
transformIgnorePatterns: [
'node_modules/(?!(react-native|react-native-elements|react-native-vector-icons|react-native-ratings|react-native-status-bar-height|react-native-maps|react-native-maps-super-cluster|@beeobs)/)'
],
transformIgnorePatterns: [
'<rootDir>/node_modules/react-native/react-native-fs/.+'
],
*/
testRegex: '(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$',
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
modulePathIgnorePatterns: ['<rootDir>/dist/'],
setupFiles: ['./jest.setup.js'],
setupFilesAfterEnv: [
'jest-enzyme',
'<rootDir>/jest.env.js'
],
testEnvironment: 'enzyme',
testEnvironmentOptions: {
enzymeAdapter: 'react16'
}
}
// tsconfig.json
{
"compilerOptions": {
"target": "esnext", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
"lib": [
"es6",
"dom"
], /* Specify library files to be included in the compilation. */
"allowJs": true, /* Allow javascript files to be compiled. */
"jsx": "react-native", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
"noEmit": true, /* Do not emit outputs. */
"isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
"strict": true, /* Enable all strict type-checking options. */
"strictPropertyInitialization": false, /* Enable strict checking of property initialization in classes. */
"moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
"baseUrl": "./", /* Base directory to resolve non-absolute module names. */
"typeRoots": [ /* List of folders to include type definitions from. */
"./types",
"./node_modules/@types"
],
"noImplicitAny": false,
"allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
"resolveJsonModule": true, /* Resolve JSON files as modules, used for localization as of right now */
"experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
"emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
"skipLibCheck": true
},
"exclude": [
".yalc",
"node_modules/*",
"babel.config.js",
"metro.config.js",
"jest.config.js",
"**/*.test.tsx",
"**/__mocks__/**",
".eslintrc.js"
],
"include": [
"**/*.ts",
"**/*.tsx",
"**/*.js",
"**/*.jsx"
]
}
如果需要,我可以提供更多配置文件。
谢谢 !
After a huge package upgrade, when running Jest tests on our application, we have this error :
TypeError: [BABEL] /home/grubshka/devel/project/src/engine/models/Hive.ts: Cannot add property 1, object is not extensible
at Array.push (<anonymous>)
at node_modules/@babel/core/lib/config/full.js:314:26
at Function.<anonymous> (node_modules/@babel/core/lib/gensync-utils/async.js:25:3)
at evaluateSync (node_modules/gensync/index.js:251:28)
at Function.sync (node_modules/gensync/index.js:89:14)
at sync (node_modules/@babel/core/lib/gensync-utils/async.js:68:25)
at sync (node_modules/gensync/index.js:182:19)
at onFirstPause (node_modules/gensync/index.js:210:24)
The first path for the error is quite random, sometimes it's from react-native files...
On a local computer, if we randomly run tests on specific files, after some tests it starts working, and after this all tests works, seems like there is some cache somewhere...
On the CI, it never works.
Here's our main configuration files :
// babel.config.js
module.exports = {
presets: [
'module:metro-react-native-babel-preset',
'@babel/preset-typescript',
'@babel/preset-flow'
],
plugins: [
['@babel/plugin-transform-flow-strip-types'],
['@babel/plugin-proposal-decorators', { legacy: true }],
['@babel/plugin-proposal-class-properties', { loose: true }]
],
env: {
production: {
plugins: ['react-native-paper/babel']
}
}
}
// jest.config.js
const { defaults: tsjPreset } = require('ts-jest/presets')
module.exports = {
...tsjPreset,
preset: 'react-native',
globals: {
'ts-jest': {
tsconfig: 'tsconfig.jest.json',
babelConfig: true
}
},
transform: {
...tsjPreset.transform,
'^.+\\.jsx?
// tsconfig.json
{
"compilerOptions": {
"target": "esnext", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
"lib": [
"es6",
"dom"
], /* Specify library files to be included in the compilation. */
"allowJs": true, /* Allow javascript files to be compiled. */
"jsx": "react-native", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
"noEmit": true, /* Do not emit outputs. */
"isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
"strict": true, /* Enable all strict type-checking options. */
"strictPropertyInitialization": false, /* Enable strict checking of property initialization in classes. */
"moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
"baseUrl": "./", /* Base directory to resolve non-absolute module names. */
"typeRoots": [ /* List of folders to include type definitions from. */
"./types",
"./node_modules/@types"
],
"noImplicitAny": false,
"allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
"resolveJsonModule": true, /* Resolve JSON files as modules, used for localization as of right now */
"experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
"emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
"skipLibCheck": true
},
"exclude": [
".yalc",
"node_modules/*",
"babel.config.js",
"metro.config.js",
"jest.config.js",
"**/*.test.tsx",
"**/__mocks__/**",
".eslintrc.js"
],
"include": [
"**/*.ts",
"**/*.tsx",
"**/*.js",
"**/*.jsx"
]
}
I can provide more config files if required.
Thanks !
: '<rootDir>/node_modules/react-native/jest/preprocessor.js',
'^.+\\.tsx?
I can provide more config files if required.
Thanks !
: 'ts-jest'
},
/*
transformIgnorePatterns: [
'node_modules/(?!(react-native|react-native-elements|react-native-vector-icons|react-native-ratings|react-native-status-bar-height|react-native-maps|react-native-maps-super-cluster|@beeobs)/)'
],
transformIgnorePatterns: [
'<rootDir>/node_modules/react-native/react-native-fs/.+'
],
*/
testRegex: '(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)
I can provide more config files if required.
Thanks !
,
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
modulePathIgnorePatterns: ['<rootDir>/dist/'],
setupFiles: ['./jest.setup.js'],
setupFilesAfterEnv: [
'jest-enzyme',
'<rootDir>/jest.env.js'
],
testEnvironment: 'enzyme',
testEnvironmentOptions: {
enzymeAdapter: 'react16'
}
}
I can provide more config files if required.
Thanks !
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
更新 Jest 和 Babel(以及我们所有的模块)修复了该错误......
Updating Jest and Babel (and all our modules) fixed the bug...