Jest from create-react-app not running on Windows

Question

I have a problem running Jest from a clean installed app created using create-react-app on Windows 8.1. After the installation, running the command npm run test, I get the error:

No tests found related to files changed since last commit.

Running jest --watchAll, so bypassing the react-scripts, in the same directory, though, shows:

Test suite failed to run

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:

SyntaxError: E:\demo\src\App.test.js: Unexpected token (7:18)

  5 | it('renders without crashing', () => {
  6 |   const div = document.createElement('div');
> 7 |   ReactDOM.render(<App />, div);
    |                   ^
  8 |   ReactDOM.unmountComponentAtNode(div);
  9 | });

Googling for quite while and following people's suggestions on similar issues, I started adding Babel devDependencies on my package.json. And it became like this:

"devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-proposal-class-properties": "^7.2.3",
    "@babel/plugin-transform-runtime": "^7.2.0",
    "@babel/preset-env": "^7.2.3",
    "@babel/preset-react": "^7.0.0",
    "@babel/register": "^7.0.0",
    "@babel/runtime": "^7.2.0",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.6.0",
    "babel-loader": "^8.0.5",
    "babel-plugin-root-import": "^6.1.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react-optimize": "^1.0.1",
    "jest-transform-stub": "^1.0.0"
  }

I also added the .babelrc file as:

{
    "presets": [
        "@babel/react" ,
        "@babel/env"
    ],
    "plugins": [
        "@babel/plugin-proposal-class-properties"
    ]
 }

And no matter the combinations I try, I always get different errors and this can't be right. Looking at people on the internet, all are able to use the Jest command out of the box with create-react-app.

The last try with all those dependencies results in the following error:

Test suite failed to run

    E:\dev\demo\src\App.test.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import React from 'react';
                                                                                                    ^^^^^

    SyntaxError: Unexpected identifier

      at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)

Any ideas?! I am baffled.

In case you have problems running tests with `npm test`, this is XY problem. A solution could be https://stackoverflow.com/questions/39724017/running-cra-jest-in-non-interactive-mode or possibly `npm test a`. — Estus Flask, Jan 05 '19 at 14:23
For the love of God, `npm test a` is the answer and it works fine. Thanks, @estus. If you want, add your solution as a normal answer, so I can mark it as the right answer. — Dimitris Damilos, Jan 05 '19 at 14:56
I wasn't able to test it myself. Glad it works. Added it to the answer, hope this will help somebody else. — Estus Flask, Jan 05 '19 at 15:01

Estus Flask · Accepted Answer · 2019-01-05T15:00:56.980

23

create-react-app is CLI that generates react-scripts pre-configured setup that includes Webpack and Jest configuration, among other things.

When Jest is used directly as jest, it ignores generated configuration and requires to be configured from scratch.

npm test (defaults to react-scripts test in CRA setup) should be used instead of jest to make use of generated Jest configuration.

In case the problem with npm test is interactive mode:

No tests found related to files changed since last commit. Press a to run all tests, or run Jest with --watchAll

It can be addressed with npm test a.

edited Jan 05 '19 at 15:00

answered Jan 05 '19 at 14:16

Estus Flask

206,104
70
425
565

I've just installed CRA with the typescript template which has App.test.tsx out of the box but when I try your suggestion (pressing `a`) it just says `No tests found, exiting with code 0`. – Thomas Soos Mar 15 '23 at 23:46
@ThomasSoos The error is different, the one from the question means there are no new tests, while in your case no tests at all. As long as it's inside src/ I'd expect it to work. Possibly means that Jest is misconfigured out of the box. In case the problem persists and reproducible with up-to-date CRA, consider asking a new question regarding your case – Estus Flask Mar 16 '23 at 00:05
Yes, it is under the src folder and I'd also expect it to work without any additional configuration. I'll ask around and if noone know I'll post a new question here. Thank you for your reply! – Thomas Soos Mar 17 '23 at 13:09
Just wanted to report back that I found what caused Jest not being able to find the unit tests. One of the project's parent folder had brackets ("[" and "]") in its name. As soon as I removed them Jest found the tests and ran them in a breeze ¯\_(ツ)_/¯ – Thomas Soos Mar 24 '23 at 17:35
@ThomasSoos Thanks for sharing, good to know. It's not uncommon for paths with special chars to cause problems though – Estus Flask Mar 24 '23 at 19:02

Omar Magdy · Answer 2 · 2022-05-27T04:06:04.777

6

Just to clarify the answer of @estus-flask.
There are 2 solutions.

First Solution:

package.json

"scripts": {
  "test": "react-scripts test --watchAll",
  ...
},

And then run

npm test

Second Solution:

Or when you run the tests, run them like this:

npm test .

edited May 27 '22 at 04:06

answered Sep 24 '21 at 16:33

Omar Magdy

2,331
14
13

score 0 · Answer 3 · answered Oct 05 '21 at 15:10

In my case, I am running a an Azure DevOps pipeline, to build and deploy a react app to Azure app service. So I used the following script task to do npm install, npm build and then test as follows.

- script: |
    echo Working dir and file list are as follows.
    echo -----------------------------------------
    pwd
    ls -la
    echo Changing directory to reactonazure
    ehco ----------------------------------
    cd reactonazure
    echo Working dir and file list now after chaning directory are as follows.
    echo ---------------------------------------------------------------------
    pwd
    ls -la
    echo Running npm install
    echo -------------------
    npm install
    echo Running npm build --if-present
    echo ------------------------------
    npm run build --if-present
    echo Running CI=true npm test
    echo ------------------------             
    CI=true npm test
  displayName: 'npm install, build and test'

You can ignore echo, ls, pwd and cd statements. The point in focus it the last one

CI=true npm test

That finally started working. Earlier I had

npm run test --if-present

which gave me the error.

No tests found related to files changed since last commit.

Jest from create-react-app not running on Windows

3 Answers3

First Solution:

Second Solution:

Linked