Jestjs 与<；Trans>；：您忘记从文件it'；导出组件；在中定义，或者您可能混淆了默认导入和命名导入

错误：未捕获[错误：元素类型无效：应为字符串 （对于内置组件）或类/函数（对于复合 组件）但得到：未定义。您可能忘记导出 组件，或者您可能已经混淆了 默认导入和命名导入

---

这是我在jest中运行测试时遇到的错误。正在测试的React组件使用了

React-i18next

中的

。当我注释这部分代码时，测试按预期工作。

显示的错误非常严重

在我的例子中，

缺少mock。虽然我有

react-i18next

的mock，但由于我有很多组件要测试，其中一些组件正在使用

，而另一些没有，我复制/粘贴测试文件，但完全忘记了检查mock。在替换

后，我花了几个小时才注意到它要从材质ui中创建类似

的文本

jest.mock('react-i18next', () => ({
  withTranslation: () => (Component: any) => {
    Component.defaultProps = {...Component.defaultProps, t: (children: any) => children};
    return Component;
  },
  Trans: ({children}: any) => children, // this line was missing (() => jest.fn() might also work)
}));

---

希望它能为你们中的一些人节省一些时间：）

不要模仿你们不拥有的东西-你们最终会得到一个越来越复杂的react-i18next“模拟，然后如果他们的API发生变化，你们的代码将中断，但你们的测试将继续通过。你们是在建议我从他们的包中使用API进行模拟吗？不知道有类似的事情。React组件中使用的大多数其他npm包都是这种做法吗？我不知道它们是否有；我的观点更多的是测试整体行为，在这种情况下，假设您正在测试的任何组件都会显示一些翻译文本。我不确定我是否理解您的意思。在我们的组件中，我们使用With Translation HoC来注入名称佩斯和我们通过WithTranslation注入t函数作为道具。我认为如果我们不模仿软件包，我们在测试中会遇到问题。