Реагирует на шутку, чтобы соответствовать снимку, сбой при тестировании компонента с дочерними компонентами

#javascript #unit-testing #reactjs #jestjs

#javascript #модульное тестирование #reactjs #jestjs

Вопрос:

У меня есть некоторые компоненты с дочерними компонентами из сторонних дополнений / библиотек. Я использую Jest для своего модульного теста и toMatchSnapshot() метода. Я попытался исключить дочерние компоненты с jest.unmock('ChildComponet.js') помощью, и я получаю эту ошибку:

jest.unmock(‘ChildComponet.js ‘) был вызван, но автоматическая блокировка отключена. Удалите ненужный вызов jest.unmock или включите автоматическую блокировку для этого теста с помощью jest.enableAutomock(); . Это предупреждение, вероятно, является результатом изменения конфигурации по умолчанию в Jest 15.

Я включил jest.enableAutomock(); , и теперь у меня есть эта ошибка:

Ошибка типа: не удается прочитать свойство ‘DEFINE_MANY’ неопределенного

Я поместил это в свой package.json, но ничего не происходит:

«unmockedModulePathPatterns»: [«rootDir / node_modules / react»]

Есть идеи?

правильный ли способ выполнить модульное тестирование компонентов в React?

Ответ №1:

Самый простой способ макетировать компоненты react, которые я нашел до сих пор, — это использовать:

 jest.mock('component', ()=> 'ComponentName')
 

перед вами инструкция импорта модуля, который вы хотите протестировать.

Первым параметром является либо имя глобального модуля npm, либо путь к вашему локальному компоненту (обратите внимание, что путь относительно вашего тестового файла). Второй параметр — это просто функция, которая возвращает строку (я всегда возвращаю то же имя, которое я использую в jsx). Это приведет к созданию дамп-компонента, который ничего не делает, но имеет то же имя, что и ваш исходный компонент. Таким образом, в вашем снимке вы не увидите никакой разницы, кроме того, что издеваемый компонент не будет отображать дочерние элементы.

Теперь к полученным вами сообщениям об ошибках.

jest.unmock(‘ChildComponet.js ‘) был вызван, но автоматическая блокировка отключена…

Проблема в том, что вы используете jest.unmock вместо jest.mock . В Jest есть функция автоматического моделирования всех зависимостей ваших модулей. С включенным автомоделированием вы можете использовать jest.unmock , чтобы получить реальную имплантацию для некоторых важных библиотек, таких как Lodash или moment. Поскольку функция автоматического макета сбивала с толку многих людей, они решили сделать ее необязательной. Tldr вы пытались удалить что-то, над чем не издевались в первую очередь, поскольку вы не включили автоматическое редактирование.

Ошибка типа: не удается прочитать свойство ‘DEFINE_MANY’ неопределенного

Когда вы включаете автоматическое редактирование, каждый импортированный модуль заменяется на undefined . Я не могу много сказать о unmockedModulePathPatterns настройке, но я считаю, что вы должны использовать тот же шаблон, который вы используете для импорта модуля, поэтому, если он глобальный, вам не нужно указывать в нем путь к node_modules папке.

Комментарии:

1. Большое вам спасибо. Я тестирую его.