Как мне смоделировать и настроить значения функции, импортированной из пакета npm, используя Jest?

Question

Я использую isMobileOnly из пакета npm "act-device-detect "в моем компоненте React (SampleComponent.js).

Я бы хотел настроить возвращаемое значение isMobileOnly в моих юнит-тестах.

Я пробовал ручные макеты Jest, как указано в ссылке ниже: https://jestjs.io/docs/en/manual-mocks

Но, похоже, это не работает для меня.

Я также пробовал: шутка шутка шутник

import {isMobileOnly} from 'react-device-detect;

В моих юнит-тестах я хотел бы смоделировать функцию isMobileOnly таким образом, чтобы иметь возможность настроить ее возвращаемое значение на «true». Значением по умолчанию является «ложь».

Answer 1

Наконец-то! Я понял это сам после нескольких часов борьбы. Вот что я сделал:

1. Создана папка __mocks__ на том же уровне, что и каталог node_modules, в котором доступен пакет «Resact-Device-Detect». Примечание: меньший регистр важен для __mocks__.
2. Создан файл с именем «act-device-detect.js »в папке __mocks__.

3. Добавлен следующий код:

   const deviceDetect = jest.genMockFromModule('react-device-detect');
   deviceDetect.isMobileOnly = true;
   module.exports = deviceDetect;
   

4. В тестовом файле я импортировал «isMobileOnly», как и в оригинале компонент:

   import { isMobileOnly } from 'react-device-detect';
   

5. Теперь я могу изменить значение «deviceDetect.isMobileOnly» на true или false в проверенный файл в соответствии с необходимостью модульного теста.

Для получения более подробной информации, смотрите официальную документацию здесь https://jestjs.io/docs/en/manual-mocks

Спасибо @Roman за помощь!

Answer 2

Вы можете переопределить User Agent для тестирования, поэтому пакет react-device-detect будет идентифицировать его так, как Вам нужно, здесь , как это сделать.

Эта тема также должна быть полезной.