babel-jest не обрабатывает ES6 в модулях

Я пытаюсь настроить Jest на основе проекта React, который использует модули ES6. Однако у меня, похоже, проблемы с модулями ES6, я использую babel-jest и считаю, что у меня это настроено правильно (Jest обнаруживает это автоматически).

Jest, похоже, не имеет проблем с использованием импорта ES6, однако, как только он попадает в оператор импорта в одном из импортированных модулей, он задыхается. Это похоже на транспонирование только начального тестового сценария, а не какого-либо из импортированных модулей. Я пробовал различные конфигурации и пытался искать Google без успеха. Запуск тестов без импорта работает нормально.

здесь ошибка:

({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import Predications from './predications';
                                                                                         ^^^^^^
SyntaxError: Unexpected token import

вот соответствующие биты конфигурации:

шутку.conf.в JSON

{
  "testRegex": "/test/spec/.*.js$",
}

.babelrc

{
  "presets": ["es2015", "stage-0", "react"]
}

тестовый скрипт

import React from 'react';
import { mount, shallow } from 'enzyme';
import Slider from 'react-slick';
import Carousel from '../../client/components/carousel/carousel.js'; // test chokes on when I include this module

describe('carousel component', () => {
  it('is a test test case', () => {
    expect(1 + 2).toEqual(3);
  });
});

обновление:

как было предложено, я попытался запустить тест без шутку.conf.js, однако testRegex необходим чтобы Jest нашел мои тесты, я попытался переместить тесты в каталог тестов по умолчанию, и они все еще терпят неудачу.

Я хотел бы уточнить, что сами тесты работают нормально, проблема, похоже, в том, где один из моих импортированных модулей использует ES6, в моем примере выше, если я не импортирую свой компонент карусели, тест работает нормально, как только я импортирую, что тест подавляется инструкцией импорта в этом файле. Кажется, что импортированные модули не получают transpiled.

обновление #2

после определенных розыскных мероприятий выясняется, проблема в том, что Бабель не transpiling ES6 в пределах папки node_modules. Я создал пример репо, чтобы продемонстрировать это здесь: https://github.com/jamiedust/babel-jest-example

Я понимаю, что сторонние модули должны обрабатывать свои собственные транспилирования, однако у нас есть ряд модулей, которые размещаются в нашем собственном реестре npm и повторно используются между проекты, в этих случаях Webpack обрабатывает транспилирование, для тестов Jest нам нужно, чтобы эти node_modules были транспилированы Babel или способ использования нашего webpack, настроенного для этого для нас.

решение

добавьте следующую конфигурацию в пакет.JSON (или конфигурационный файл Jest).

"jest": {
  "transformIgnorePatterns": [
    "/node_modules/(?!test-component).+.js$"
  ]
}

4 ответов


по умолчанию код node_modules игнорируется babel-jest, см. параметр конфигурации Jest transformIgnorePatterns. Я также создал PR на вашем примере РЕПО, так что вы можете видеть это работает.

хотя это работает, я обнаружил, что это очень медленно в реальных приложениях, которые имеют много зависимостей, содержащих модули ES. Кодовая база Jest имеет несколько иной подход к этому, как вы можете найти в "babel-jest преобразование зависимостей" (извините, не буду публиковать более 2 url). Это также может занять гораздо больше времени в Windows, см. "взятие 10 секунд на пустом РЕПО".

Если делать "модульное" тестирование, издевательство, вероятно, лучший способ пойти.


вы можете попробовать добавить плагин transform-es2015-modules-commonjs в файл конфигурации babel только для тестирования. Вот пример файла конфигурации, который говорит babel транспилировать модули только в среде тестирования. Вы можете поместить его под ваши пресеты:

{
  "presets": [
    "react",
    ["es2015", {"modules": false, "loose": true}]
  ],
  "env": {
    "test": {
      "plugins": ["transform-es2015-modules-commonjs"]
    }
  }
}

Вы можете прочитать о плагине здесь:

https://www.npmjs.com/package/babel-plugin-transform-es2015-modules-commonjs

затем, при запуске тестов Jest на в командной строке укажите NODE_ENV=test (возможно, Вам понадобится добавить флаг --no-cache в команду в первый раз после внесения изменений в конфигурацию babel, потому что Jest кэширует вывод babel, но после этого вы можете оставить его:

NODE_ENV=test jest --no-cache

я узнал об этом на семинаре React Брайана Холта в Frontend Masters. https://frontendmasters.com/courses/


я столкнулся с той же проблемой (node_module не транспилирован babel-jest), не будучи в состоянии решить ее.

вместо этого я, наконец, преуспел, насмехаясь над node_module, как описано здесь https://facebook.github.io/jest/docs/manual-mocks.html

NB: установка издевается в __mocks__ вложенные папки не работали для меня. Поэтому я передал макет как второй параметр


еще одна возможная причина. Вавилон теперь игнорирует ваши .babelrc внутри node_modules и использует тот, который предоставляется зависимостью. Если у вас есть контроль над зависимостью, вам нужно будет добавить a .babelrc к нему, и babel будет использовать эти настройки для него.

Это может вызвать проблемы, если ваша зависимость и ваш проект используют разные версии babel или модули.