Я использую next-i18next
для локализации своего приложения на NextJS версии 9.5.
Мне удалось запустить его на сервере разработки, но я не могу пройти базовый тест в Jest.
Мой компонент заголовка:
import React from 'react';
import { TFunction } from 'next-i18next';
import { withTranslation } from '../../../i18n';
interface HeaderProps {
t: TFunction;
}
const Header: React.FC<HeaderProps> = ({ t }): JSX.Element => {
return (
<>
<h1>
{t('h1')}
</h1>
</>
);
};
Header.getInitialProps = async () => ({
namespacesRequired: ['common'],
});
export default withTranslation('common')(Header);
Это файл спецификации:
import React from 'react';
import { render, screen } from '@testing-library/react';
import Header from './Header';
jest.mock('react-i18next', () => ({
// this mock makes sure any components using the translate HoC receive the t function as a prop
withTranslation: () => Component => {
Component.defaultProps = { ...Component.defaultProps, t: () => "" };
return Component;
}
}));
describe('<Header/>', () => {
test('it should render', () => {
render(<Header />);
screen.debug();
expect(screen.getByRole('heading')).toHaveTextContent(/Text Mining/i);
});
});
Мне потребовалась большая часть сегодняшнего дня, чтобы дойти до этого, и вывод screen.debug()
подтверждает, что нет никакого перевода или резервного текста, только пустой <h1 />
, который должен быть <h1>My app!</h1>
.
Я высмеиваю требуемый withTranslation
метод из react-i18next
, но не уверен, почему тест не проходит.