Почему jest не может анализировать символы в файлах CSS, несмотря на использование трансформера? - PullRequest
Новая
       37

Почему jest не может анализировать символы в файлах CSS, несмотря на использование трансформера?

0 голосов
/ 07 февраля 2019

Описание

Я настраиваю шутку над существующим проектом, и у моего бегуна, похоже, возникают проблемы при разборе символов, и он выдает ошибку SyntaxError: Invalid or unexpected token.

Исследования уже проведеныout:

Уже пытались использовать трансформаторы в конфигурации jest и насмехаться с styleMock.js, чтобы вернуть module.exports = {} в moduleNameMapper.Также пытались обновить и настроить различные версии Babel.

Есть идеи?См. Ниже.

Ошибка в консоли: 

 FAIL  src/App.spec.js
  ● Test suite failed to run

\node_modules\react-notifications\lib\Notifications.css:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){@charset "UTF-8";
                                                                                         ^

SyntaxError: Invalid or unexpected token

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/ScriptTransformer.js:440:17)
  at Object.<anonymous> (node_modules/react-notifications/lib/NotificationContainer.js:21:22)

Тест App.js: 

import React from 'react';
import { shallow } from 'enzyme';
import { App } from './App'

describe('MyComponent', () => {
    test('Smoke test - Renders without crashing', () => {
        const app = shallow(<App debug/>);

        expect(app).toMatchSnapshot();
    });
});

Настройка Jest: 

"jest": {
"verbose": true,
"clearMocks": true,
"collectCoverage": true,
"moduleNameMapper": {
  "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/assetsTransformer.js",
  "\\.(css|less|scss|sass)$": "<rootDir>/assetsTransformer.js"
},
"snapshotSerializers": [
  "enzyme-to-json/serializer"
],
"moduleDirectories": [
  "src",
  "node_modules"
],
"transform": {
  "^.+\\.(js|jsx)$": "babel-jest",
  ".+\\.(css|styl|less|sass|scss)$": "<rootDir>/node_modules/jest-css-modules-transform",
  "^.+\\.tsx?$": "<rootDir>/node_modules/ts-jest/preprocessor.js"
},
"setupFilesAfterEnv": [
  "<rootDir>/src/setupTests.js"
],
"moduleFileExtensions": [
  "css",
  "scss",
  "js",
  "json",
  "jsx"
],
"transformIgnorePatterns": [
  "/node_modules/(?!test-component).+\\.js$",
  "node_modules/?!(antd|rc-.+)/",
  "/node_modules/(?!lodash-es)"
]

}

Настройка Babel: 

{
"env": {
    "development": {
        "presets": [
            "@babel/preset-env",
            "@babel/preset-react",
        ],
        "plugins": [
            "react-hot-loader/babel",
            "babel-plugin-lodash",
            "@babel/plugin-proposal-class-properties",
            "@babel/plugin-syntax-dynamic-import",
            "transform-es2015-modules-commonjs"
        ]
    },
    "test": {
        "presets": [
            "@babel/preset-env",
            "@babel/preset-react",
        ],
        "plugins": [
            "react-hot-loader/babel",
            "babel-plugin-lodash",
            "@babel/plugin-proposal-class-properties",
            "@babel/plugin-syntax-dynamic-import",
            "transform-es2015-modules-commonjs"
        ]
    }
}

}

...