尝试在React Native上运行Jest,发生多个错误,最后一个是:TypeError:无法读取未定义的属性'createAnimatedComponent'

问题描述

我是Jest的新手。我正在尝试使用最基本的测试来运行它:

//App-test.js
import 'react-native';
import React from 'react';
import App from '../App';


// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer';

it('renders correctly',() => {
  const tree = renderer.create(<App />).toJSON();
  expect(tree).toMatchSnapshot();
});

但是我一直收到错误消息:●测试套件无法运行

TypeError: Cannot read property 'createAnimatedComponent' of undefined

  at Object.<anonymous> (node_modules/react-native-screens/lib/commonjs/index.js:27:23)
  at Object.<anonymous> (node_modules/react-navigation-tabs/lib/commonjs/navigato/createBottomTabNavigator.tsx:10:1)

我的package.json中的jest配置看起来像这样:

 "jest": {
    "preset": "react-native","globals": {
      "__DEV__": true
    },"transformIgnorePatterns": [
      "node_modules/(?!react-native-screens|react-navigation-tabs)/","node_modules/(?!react-native-payfort-sdk|react-native|Hacktor|react-native-button|react-navigation)/"
    ],"haste": {
      "defaultPlatform": "android","platforms": [
        "android","ios"
      ]
    }
  }

我的babel.config.js看起来像这样:

// babel.config.js
module.exports = function(api) {
  api.cache(true);
  const presets = [
    [
      '@babel/preset-env',{
        modules: 'auto',useBuiltIns: 'entry'
      }
    ],'@babel/react','@babel/preset-flow'
  ];
  const plugins = [
    '@babel/plugin-transform-flow-strip-types','@babel/plugin-proposal-class-properties','@babel/transform-runtime','add-module-exports',];

  return {
    presets,plugins
  };
};

我不知道该怎么办。我的代码太满了,因为使用最基本的设置,我遇到了所有错误。我还在运行一个基本的附加测试,如下所示:

const functions = require('./functions');

test('Adds 2+2 to equal 4',()=> {
    expect(functions.add(2,2)).toBe(4);
});

效果很好。

编辑: 我像这样重做TransformIgnorePatterns:

 "transformIgnorePatterns": [
      "node_modules/(?!(jest-)?react-native|react-navigation|@react-native-community|@react-navigation/.*)"
      
    ],

错误仍然是: ●测试套件无法运行

TypeError: Cannot read property 'createAnimatedComponent' of undefined

  at Object.<anonymous> (node_modules/react-native-screens/lib/commonjs/index.js:27:23)
  at Object.<anonymous> (node_modules/react-navigation-tabs/lib/commonjs/navigators/createBottomTabNavigator.tsx:10:1)

解决方法

您能尝试一下吗?

"transformIgnorePatterns": [
      "node_modules/(?!(jest-)?react-native|react-navigation|@react-native-community|@react-navigation/.*)"
    ],