<Trans> 出现笑话错误：您忘记从定义它的文件中导出组件，或者您可能混淆了默认导入和命名导入

Question

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

这是我在玩笑中运行测试时遇到的错误。正在测试的 React 组件使用<Trans>来自react-i18next. 当我评论那部分代码时，测试正在按预期工作。

Answer 1

显示的错误非常非常非常错误。

就我而言，它缺少模拟<Trans>。虽然我有模拟react-i18next，但由于我有很多组件需要测试，其中一些正在使用，<Trans>有些没有，所以我复制/粘贴测试文件，但完全忘记检查模拟。在我替换<Trans>为来自material-ui的文本后，我花了几个小时才注意到它<Typography>......

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)
}));

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