使用 useTranslation 进行 next-i18next Jest 测试

问题描述

测试库...总是很有趣。我在 NextJS 项目中使用 next-i18next。我们将 useTranslation 钩子与命名空间一起使用。

当我运行测试时出现警告:

控制台.warn react-i18next:: 你需要使用 initReactI18next 传入一个 i18next 实例

> 33 |   const { t } = useTranslation(['common','account']);
     |                 ^

我已尝试从 react-i18next test examples 进行设置但没有成功。我试过this suggestion too

以及只是试图模拟 useTranslation 没有成功。

是否有更直接的解决方案来避免此警告?测试通过 FWIW...

test('feature displays error',async () => {
    const { findByTestId,findByRole } = render(
      <I18nextProvider i18n={i18n}>
        <InviteCollectEmails onSubmit={jest.fn()} />
      </I18nextProvider>,{
        query: {
          orgId: 666,},}
    );

    const submitBtn = await findByRole('button',{
      name: 'account:organization.invite.copyLink',});

    fireEvent.click(submitBtn);

    await findByTestId('loader');

    const alert = await findByRole('alert');
    within(alert).getByText('Failed attempt');
  });

最后,有没有办法让翻译的纯文本成为结果,而不是命名空间:account:account:organization.invite.copyLink

解决方法

在 describe 块之前或 beforeEach() 中使用以下代码段来模拟需要。

jest.mock("react-i18next",() => ({
    useTranslation: () => ({ t: key => key }),}));

希望这会有所帮助。和平。