Я новичок в response-testing-library / jest и пытаюсь написать тест, чтобы проверить, правильно ли выполняется навигация по маршрутам (с использованием response-router-dom).До сих пор я следовал README и этому учебнику по использованию.
Один из моих компонентов использует scrollIntoView в локальной функции, и это заставляет тестпотерпеть поражение.
TypeError: this.messagesEnd.scrollIntoView is not a function
45 |
46 | scrollToBottom = () => {
> 47 | this.messagesEnd.scrollIntoView({ behavior: "smooth" });
| ^
48 | }
49 |
50 |
Это функция в моем компоненте chatbot:
componentDidUpdate() {
this.scrollToBottom();
}
scrollToBottom = () => {
this.messagesEnd.scrollIntoView({ behavior: "smooth" });
}
И это пример тестов, которые не пройдены:
test('<App> default screen', () => {
const { getByTestId, getByText } = renderWithRouter(<App />)
expect(getByTestId('index'))
const leftClick = {button: 0}
fireEvent.click(getByText('View Chatbot'), leftClick) <-- test fails
expect(getByTestId('chatbot'))
})
Я пыталсяиспользовать фиктивную функцию, однако ошибка по-прежнему сохраняется.
Здесь назначен this.messageEnd:
<div className="chatbot">
<div className="chatbot-messages">
//render messages here
</div>
<div className="chatbot-actions" ref={(el) => { this.messagesEnd = el; }}>
//inputs for message actions here
</div>
</div>
Я ссылался на код из этого вопроса о переполнении стека: Какпрокрутите вниз, чтобы реагировать?
РЕШЕНИЕ
test('<App> default screen', () => {
window.HTMLElement.prototype.scrollIntoView = function() {};
const { getByTestId, getByText } = renderWithRouter(<App />)
expect(getByTestId('index'))
const leftClick = {button: 0}
fireEvent.click(getByText('View Chatbot'), leftClick)
expect(getByTestId('chatbot'))
})