I am using React, Google Material IO Components to build an app. From a while when I am running JEST for my tests I see this error mentioned below.
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
Here's what you can do:
• To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
• If you need a custom transformation specify a "transform" option in your config.
• If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html
Details:
C:\Users\sganesh\Documents\gateway-web\packages\payments\node_modules\@material\textfield\helper-text\index.js:23
export * from './component';
^^^^^^
SyntaxError: Unexpected token export
2 | import { useState, useEffect, useRef } from "react";
3 | import { MDCTextField } from "@material/textfield";
> 4 | import { MDCTextFieldHelperText } from "@material/textfield/helper-text";
| ^
5 | import { MDCChipSet } from "@material/chips";
6 | import { MDCFloatingLabel } from "@material/floating-label";
7 | import { MDCTextFieldCharacterCounter } from '@material/textfield/character-counter';
at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
at Object.<anonymous> (src/PaymentContainer/PaymentDetails/common/ChipInput/ChipInput.tsx:4:1)
The Jest Configuration is as follows:-
const base = require('../jest.config.base.js')
// Individual pod can add their add own custom jest config
module.exports = {
...base,
"setupFiles": ['<rootDir>/src/setupTests.ts'],
transformIgnorePatterns: [
"<rootDir>/node_modules/?!(@rmwc|@material)/"
]
};
The Base Jest Config is:
module.exports = {
roots: ["<rootDir>/src"],
transform: {
"^.+\\.(ts|tsx)$": "ts-jest",
".+\\.(css|scss)$": "<rootDir>/node_modules/jest-css-modules-transform"
},
moduleFileExtensions: [
"ts",
"tsx",
"js",
"tsx"
],
"snapshotSerializers": ["enzyme-to-json/serializer"],
verbose: true
};
