Jest: why does it fail with SyntaxError: Unexpected token . for css class?

Question

I wrote a React application and used jest to write unit tests.

when I run it by "jest --config=jest.config.json --watch" I get the following error:

Test suite failed to run

/home/user/Projects/react-game/src/Square.css:1
({"Object.>
":function(module,exports,require,__dirname,__filename,global,jest){.bluePawn, .blueMasterPawn, .redPawn, .redMasterPawn { ^ SyntaxError: Unexpected token .
  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/ScriptTransformer.js:289:17)
  at Object.<anonymous> (src/MasterPawn.js:3:1)
  at Object.<anonymous> (src/Utils.js:3:19)

I just want to note that compiler marks ".bluePawn" which is a class name. Therefore, I understand that it cannot read class name.

It looks like something that has to do with configurations. I was searching on the web, and didn't find any solution that could help me.

Are you importing any `css` files inside your components? – Hamza El Aoutar May 02 '18 at 21:59 — Hamza El Aoutar, May 02 '18 at 21:59
yes. css files are imported to my components – CrazySynthax May 02 '18 at 22:00 — CrazySynthax, May 02 '18 at 22:00

score 1 · Answer 1 · answered May 02 '18 at 22:03

1

Create an empty css file named stub.css inside src.

Then add this to your package.json :

"jest": {
    "moduleNameMapper": {
      ".*css$": "<rootDir>/src/stub.css",
    },

answered May 02 '18 at 22:03

Hamza El Aoutar

5,292
2
17
23

thanks, but now I see that the error has changed: https://stackoverflow.com/questions/50144229/jest-why-does-it-fail-with-typeerror-path-must-be-a-string-received-undefined – CrazySynthax May 02 '18 at 22:08
It looks like an error related to the tests themselves, and not the config of `jest` – Hamza El Aoutar May 02 '18 at 22:13

Jest: why does it fail with SyntaxError: Unexpected token . for css class?

1 Answers1

Linked