简单玩笑测试中返回值无效

Question

我正在测试 React Native 0.68.2/jest 29.0 的组件视图Home。简单的测试用例是从 jest doc 复制的：

\n

import React from 'react';\nimport { NavigationContainer } from '@react-navigation/native';\nimport { render, cleanup, screen, fireEvent } from "@testing-library/react-native";\nimport App from '../App';\n\ndescribe ('App ', () => {\n    //afterEach(cleanup);\n    test ('shall stack screens', async () => {\n        const component = (<NavigationContainer>\n                             <App />\n                            </NavigationContainer>);\n        const {getByText} = render(component);\n\n        await waitFor(() => getByText('AppSplash'));\n        \n\n    })\n})\n

\n

这是 App.js：

\n

 import React, {useState, useContext, Component} from 'react';\n import { NavigationContainer } from '@react-navigation/native';\n import { createStackNavigator } from '@react-navigation/stack';\n import { SafeAreaProvider } from 'react-native-safe-area-context';\n import SplashScreen from './src/components/splashscreen/SplashScreen';\n import SysError from './src/components/app/SysError';\n import Bye from "./src/components/app/Bye";\n import Verif1 from './src/components/signup/Verif1';\n import Signup from './src/components/signup/Signup';\n import TermCondition from './src/components/common/TermCondition';\n import AppScreen from "./src/components/app/AppScreen";\n\n \n const Stack = createStackNavigator();\n \n export default function App() {\n   return (\n    \n     <SafeAreaProvider>\n       <NavigationContainer>\n         <Stack.Navigator InitialRouteName="AppSplash">\n          <Stack.Screen name="AppSplash" component={SplashScreen} options={{headerShown:false}}/>\n           <Stack.Screen name="AppSysError" component={SysError} options={{headerShown:false}} />\n           <Stack.Screen name="AppScreen" component={AppScreen} options={{headerShown:false}} />\n           <Stack.Screen name="AppVerif1" component={Verif1} options={{headerShown:false}} />\n           <Stack.Screen name="AppSignup" component={Signup} options={{headerShown:false}} />\n           <Stack.Screen name="TermCondition" component={TermCondition} options={{headerShown:false}} />\n           <Stack.Screen name="Bye" component={Bye} options={{headerShown:false}} />\n         </Stack.Navigator>\n       </NavigationContainer>\n     </SafeAreaProvider>\n     \n   );\n };\n

\n

这是 的输出yarn jest。

\n

\xe2\x97\x8f Invalid return value:\n      `process()` or/and `processAsync()` method of code transformer found at \n      "/Users/macair/Documents/code/js/xyz_app6/node_modules/react-native/jest/assetFileTransformer.js" \n      should return an object or a Promise resolving to an object. The object \n      must have `code` property with a string of processed code.\n      This error may be caused by a breaking change in Jest 28:\n      https://jestjs.io/docs/upgrading-to-jest28#transformer\n      Code Transformation Documentation:\n      https://jestjs.io/docs/code-transformation\n

\n

我刚刚开始使用 jest，没有任何解决方案发现此错误有效。

\n

Answer 1

该错误process() or/and processAsync() method of code transformer found at表明问题是jest v28.x不支持react-native v68.x。您需要降级到 jest v27.x 或升级到 React-native v70.x。

请参阅react-native github上的此提交：https://github.com/facebook/react-native/commit/b5ff26b0b97d6cd600bdb9c33af866971ef14f9c

Jest 28 删除了对在变压器的 process 方法中返回字符串的支持（https://jestjs.io/docs/upgrading-to-jest28#transformer）。

此 PR 更改 assetFileTransformer 以返回对象而不是字符串。

上面的提交是对您所看到的问题的修复。它被合并了。如果您仔细查看提交消息，您将在其下面找到与提交关联的标签列表。这些标签将告诉您哪些版本包含此提交。

提交消息显示以下标签。

 v0.70.1  v0.70.0 v0.70.0-rc.4 v0.70.0-rc.3 v0.70.0-rc.2 v0.70.0-rc.1 v0.70.0-rc.0 latest

这些标签告诉我们该提交首先进入 0.70 候选版本，最终登陆 0.70 稳定版本。正如您所期望的，它也存在于 0.70.1 稳定版中。

有关版本的更多信息，请参阅https://reactnative.dev/contributing/release-faq

升级到react-native 70.x 或将Jest 降级到27.x。