'react-i18next: withNamespaces is not a function' 测试时

Question

我在 typescript 项目上使用 react-i18next。我使用的是 translate() HOC，但它已被弃用，所以我已经迁移到 withNamespaces()。过去一切都很好。

现在当我启动应用程序时一切正常，但在测试期间它严重失败：

FAIL  src/containers/MainMenu/MainMenu.test.tsx
Test suite failed to run

TypeError: react_i18next_1.withNamespaces is not a function

  at Object.<anonymous> (src/components/AppMenu/AppMenu.tsx:17:35)
  at Object.<anonymous> (src/components/AppMenu/index.ts:3:17)
  at Object.<anonymous> (src/containers/MainMenu/MainMenu.tsx:18:17)
  at Object.<anonymous> (src/containers/MainMenu/MainMenu.test.tsx:42:18)
  at process._tickCallback (internal/process/next_tick.js:68:7)

这是我的 AppMenu 组件：

我的应用程序是一个非常标准的 Create-React-App 安装。

import {TranslationFunction} from 'i18next';
import * as React from 'react';
import {withNamespaces, WithNamespaces} from 'react-i18next';
import {NavLink} from 'react-router-dom';

export interface IAppMenuProps extends WithNamespaces {
    items: IAppMenuItem[];
    t: TranslationFunction;
}

function AppMenu({items, t}: IAppMenuProps): JSX.Element {
    return (
        // ... some stuff here
    );
}

export default withNamespaces()(AppMenu);

失败的测试文件：

import * as React from 'react';
import {BrowserRouter as Router} from 'react-router-dom';
import {create} from 'react-test-renderer';
import MainMenu from './MainMenu';

describe('MainMenu', () => {
    test('Snapshot test', async () => {
        const comp = create(
            <Router>
                <MainMenu />
            </Router>
        );

        expect(comp).toMatchSnapshot();
    });
});

我的应用是标准的 Create-React-App 安装，所以测试运行开玩笑。

找不到使它正常工作所缺少的东西以及为什么它在测试期间失败而不是在运行时失败。

谢谢！

Answer 1

非常愚蠢的问题..我忘记了我有一个用于 react-i18next 的自动模拟文件。所以我只需要在这个模拟中将 translate 函数更改为 withNamespaces。

'react-i18next: withNamespaces is not a function' 测试时

'react-i18next: withNamespaces is not a function' when testing

i18next

reactjs

jestjs

create-react-app

react-i18next