Подтвердить что ты не робот

Как издеваться над субкомпонентами при модульном тестировании компонента React с помощью Jest

У меня есть компонент React, который я пытаюсь написать несколько тестов. Я сломал его до самого простого теста.

jest.dontMock('../Overlay.react.js');

import React from 'react';
import ReactDOM from 'react-dom';

var Overlay = require('../Overlay.react.js'); // this is the culprit!

describe('Overlay', () => {
    it('should work', () => {
        expect(true).toEqual(true);
    });
});

При требовании компонента, который я пытаюсь проверить, он, кажется, не издевается над своими подкомпонентами. В верхней части Overlay.react.js у меня есть следующий импорт: import LoadingSpinner from 'loadingIndicator/LoadingIndicatorSpin.react'; При запуске моего теста я получаю следующую ошибку:

  • SyntaxError:/Users/dev/work/react-prototype/src/components/root/routes/components/subset1/components/Overlay.react.js: /Users/dev/work/react -prototype/src/components/root/routes/components/loadingIndicator/LoadingIndicatorSpin.react.js: /Users/dev/work/react -prototype/src/components/root/routes/components/loadingIndicator/sass/style.sass: Неожиданный токен ILLEGAL

Кажется, что вместо того, чтобы насмехаться над компонентами, он идет прямо к суб-компоненту sass файла и бросает подгонку. Я понимаю, что Джест издевается над всем, кроме того, что вы говорите, чтобы не издеваться.

Каков правильный способ сформулировать эти тесты, чтобы подкомпоненты не приводили к взрыву jest при импорте во время теста?

4b9b3361

Ответ 1

Если вам потребуются ваши файлы SASS и LESS и CSS в основном компоненте, а не в каждом подкомпоненте, вы не получите эту проблему, поскольку сами тестируете компоненты.

Есть несколько других решений, упомянутых в этом выпуске, если вам не нравится тот, который я предоставил. Проблема 334