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

0
votes

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.

1
reactjsjestjs
Are you importing any css files inside your components? - El Aoutar Hamza
yes. css files are imported to my components - CrazySynthax

1 Answers

1
votes

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

Then add this to your package.json : 

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