Изучаю React testing library по туториалам. Делаю все как рассказывают. Для экспериментов выбрал один из старых тренировочных проектов на Реакт. У меня по каким-то причинам не работает ни один стандартный, даже самый простой тест - всегда ошибка:
TypeError: expect(...).toBeInTheDocument is not a function
Установка jest-dom не помогает.
Пробовал, например, тестировать отрисовку этого компонента (публикую в сокращениях):
const Todo: React.FC = () => {
return (
<WrappedTodo error={error}>
<div className="head">
<h3>My To Do List</h3>
<div className="controls">
<Input
type="text"
placeholder='введите что-нибудь'
value={value}
handleChange={handleChange}
/>
<Button
text='Добавить'
type='button'
handleClick={handleClick}
/>
</div>
<p className='error'>Вы ничего не ввели</p>
</div>
</WrappedTodo>
);
};
export default Todo;
Создал файл Todo.test.js на одном уровне с Todo.tsx. Написал тест:
import { render, screen } from "@testing-library/react";
import Todo from "./Todo";
test('render Todo', () => {
render(<Todo/>);
const linkElement = screen.getByText(/My To Do List/i);
expect(linkElement).toBeInTheDocument();
})
Пробовал альтернативный синтаксис:
test('render Todo', () => {
const { getByText } = render(<Todo/>);
const linkElement = getByText(/My To Do List/i);
expect(linkElement).toBeInTheDocument();
})
Еще варианты:
test('render Todo', () => {
render(<Todo/>);
const linkElement = screen.getByText(/Добавить/i);
expect(linkElement).toBeInTheDocument();
})
test('render Todo', () => {
render(<Todo/>);
const linkElement = screen.getByPlaceholderText('введите что-нибудь');
expect(linkElement).toBeInTheDocument();
})
Ни один вариант не работает - консоль пишет ошибку.