#reactjs #unit-testing #jestjs #react-testing-library #react-test-renderer
#reactjs #модульное тестирование #jestjs #react-testing-library #react-test-renderer
Вопрос:
Я не могу понять, почему некоторые учебные пособия используют react-test-renderer
с react-testing-library
,
Насколько я понимаю, react-test-renderer
это библиотека, которая может создавать чистый объект из компонента react и преобразовывать его в json snapshot!
import TestRenderer from 'react-test-renderer';
function Link(props) {
return <a href={props.page}>{props.children}</a>;
}
const testRenderer = TestRenderer.create(
<Link page="https://www.facebook.com/">Facebook</Link>
);
expect(testRenderer).toMatchSnapshot();
Теперь я могу сделать то же самое с Testing library
:
import { render } from '@testing-library/react;
test('create link snapshot', () => {
const {container} =
render(<Linkpage="https://www.facebook.com/">Facebook</Link>);
expect(container.firstChild).toMatchSnapshot();
})
Я действительно не могу понять, почему мне нужно использовать react-test-renderer
вместе с testing-library
, что может react-test-renderer
сделать testing-library
не может?
Комментарии:
1. Из того, что я понял из документов RTL, RTL — это много синтаксического сахара вокруг / над react-test-renderer, при этом, за более чем 3 года работы в react я никогда не использовал react-test-renderer (за исключением, возможно, некоторых пользовательских модульных тестов react hooks). тестирование). Ранее я использовал jestjs / enzyme, прежде чем перейти на jestjs / RTL. Никогда не оглядывался назад.
2. «почему мне нужно использовать react-test-renderer вместе с testing-library» кто сказал, что вам нужно? Можете ли вы привести пример использования средства визуализации тестов с библиотекой тестирования?
3. MB в этих руководствах показана разница между ними: здесь у вас есть облегченный «unittest-подобный» рендеринг объекта, здесь у вас есть полный рендеринг в DOM.
4. @DrewReese я думаю, что RTL — это нечто большее, чем просто синтаксический сахар для RTR, оба работают по-разному, RTR не зависит от DOM, RTL зависит от запросов узла DOM, как я понял
5. @CodeEagle Хм, я думаю, ты прав… RTL говорит, что он строится поверх библиотеки тестирования DOM. Я думаю, что, возможно, я объединил их на основе API RTL, а именно
act
метода.
Ответ №1:
Средство визуализации
react-test-renderer — это самая базовая библиотека утилит, которая поставляется с React. Из документации React:
Этот пакет предоставляет средство визуализации React, которое можно использовать для визуализации компонентов React в объекты чистого JavaScript, независимо от DOM или собственной мобильной среды.
@testing-library /реагировать
Библиотека тестирования React является частью семейства библиотек тестирования, построена поверх react-test-renderer и представляет собой довольно легкое решение.
Он предоставляет утилиты для тестирования React и следует идее избегать подробных тестов реализаций.
Фермент
Фермент намного сложнее и тяжелее. Это дает вам гораздо больше возможностей, но не только к лучшему: становится слишком легко проводить тестирование деталей реализации.
* Обратите внимание, что: тестирование деталей реализации в корне плохо * Обратите внимание, что: Фермент мертв. (Поддержки React 18 не будет). Подробнее читайте здесь
Читать дальше:
Вы можете перейти по ссылке ниже, чтобы узнать больше об этих инструментах и их плюсах и минусах. вы также можете увидеть полное сравнение и опыт после их использования в течение многих лет.
https://morintd.medium.com/react-testing-understand-and-chose-the-right-tools-858236d3c4e1