Есть ли смысл использовать react-test-renderer с react-testing-library?

#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