Question

我正在使用React Testing库，我需要获取文本的翻译，我们在setupTest文件中模拟了react-intl库：

jest.mock('react-intl', () => {
  const reactIntl = require.requireActual('react-intl');
  const intl = reactIntl.createIntl({
    locale: 'en'
  });

  return {
    ...reactIntl,
    useIntl: () => intl
  };
});

但是我不知道如何在测试中使用它，请问有人可以使用该库为我提供测试的完整说明，以获取翻译吗？我试图通过这种方式做到这一点：

let intl = useIntl();
      let i18n = {
        header: intl.formatMessage({
          id: 'header.mybenefits',
          defaultMessage: 'header.mybenefits'
        })
      };

但是在任何地区都有intl消息。

致谢。

Answer 1

不要嘲笑它，尝试直接用IntlProvider包装您的组件，或者甚至更好的是，创建一个辅助器render，在其中您用IntlProvider包装并用它来呈现它：< / p>

import {IntlProvider} from 'react-intl`;
import {render} from '@testing-library/react';

const renderWithReactIntl = (component, locale, messages) => {
  return render(<IntlProvider locale={locale} messages={messages}>
                 {component}
                </IntlProvider>
  );
};

在您的test()或it()中，将您的未连接组件包裹在renderWithReactIntl中：

const { /testing library selector goes here/ } 
  = renderWithReactIntl(<YourComponent />, messages, locale)

如何与Jest一起使用react-intl

1 个答案: