115

The Jest documentation suggests using npm test to execute tests.

Is there a way of watching your source and tests to rerun Jest tests automatically when relevant files have been changed?

Martin Dow
  • 5,273
  • 4
  • 30
  • 43

9 Answers9

194

Thanks to Erin Stanfill for pointing out, Jest already has support for automatically re-running. The better configuration for package.json would be

{
  "scripts": {
    "test": "jest"
  }
}

To turn on the watch mode, just use

$ npm run test -- --watch

Or

$ yarn run test --watch
Philippe Fanaro
  • 6,148
  • 6
  • 38
  • 76
wuct
  • 10,057
  • 2
  • 19
  • 22
  • An important thing to point out is that nodemon will interrupt the tests and start again if a change happens while the tests are running. `grunt watch` will not, it will continue the current test-run ignoring changes that occur while the tests are running. – portenez Mar 07 '16 at 15:37
  • It might be a better edit to just remove the first answer? The edit works great for me, and it was, at a glance, confusing to read both together. – SimplGy Apr 05 '17 at 01:19
  • I have a file named string.utility.spec.js, and this will be picked up an run when I execute "npm run test", but not when I run "npm run test -- --watch". Renaming the file to "string.spec.js" will cause it to be picked up and run. Weird. – TigerBear Apr 11 '18 at 11:28
  • @TigerBear You can overwrite this behavior, see https://facebook.github.io/jest/docs/en/configuration.html#testmatch-array-string – wuct Apr 12 '18 at 09:16
  • why do we need -- before --watch? – Vishal Anand Sep 02 '18 at 05:30
  • 1
    @VishalAnand npm will pass all the arguments after the -- directly to the script. [link](https://docs.npmjs.com/cli/run-script). – wuct Sep 05 '18 at 03:39
  • 4
    watch can also be added to "scripts": { "test": "jest --watch" }, and then you can just use npm run test – Saif Asad May 26 '19 at 00:37
  • You can even `yarn test --watch`! – Nero Vanbiervliet Feb 26 '20 at 18:15
43

If you have npm test configured, you can just run npm test -- --watch.

Erin Stanfill
  • 1,278
  • 11
  • 18
10

As a complement suggestion you can add "--watchAll" into your package.json file like this:

"scripts": {       
  "test": "jest --watchAll"
},

Each time you run npm test, the watch mode will be enable by default.

For more info npm CLI docs

rphsantos
  • 111
  • 1
  • 4
3

Start you tests in watch mode.

jest --watch fileName.test.js

As per documentation

Run tests that match this spec name (match against the name in describe or test, basically).

jest -t name-of-spec
// or in watch mode
jest --watch -t="TestName"
dipenparmar12
  • 3,042
  • 1
  • 29
  • 39
1

  1. install a couple of Grunt packages:

    npm install grunt-contrib-watch grunt-exec --save-dev

  2. make a Gruntfile.js with the following:

    module.exports = function(grunt) {
    grunt.initConfig({
        exec: {
            jest: 'node node_modules/jest-cli/bin/jest'
        },
        watch: {
            files: ['**/*.js'],
            tasks: ['exec:jest']
        }
    });
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-exec');
}

  3. then simply run:

    grunt watch
chharvey
  • 8,580
  • 9
  • 56
  • 95
bjfletcher
  • 11,168
  • 4
  • 52
  • 67
1

This example shows how to use gulp to run your Jest tests using jest-cli, as well as a tdd gulp task to watch files and rerun Jest tests when a file changes:

var gulp = require('gulp');
var jest = require('jest-cli');

var jestConfig = {
    rootDir: 'source'
};

gulp.task('test', function(done) {
    jest.runCLI({ config : jestConfig }, ".", function() {
        done();
    });
});

gulp.task('tdd', function(done) {
    gulp.watch([ jestConfig.rootDir + "/**/*.js" ], [ 'test' ]);
});

gulp.task('default', function() {
    // place code for your default task here
});
Martin Dow
  • 5,273
  • 4
  • 30
  • 43
  • For some reason despite I use the default `__tests__` folder it does not work with this `jestConfig`. After reading the [docs](https://facebook.github.io/jest/docs/api.html#config-rootdir-string) and playing a bit this works for me: `var jestConfig = { rootDir: "__tests__" }` – Jaime Agudo Mar 29 '16 at 15:30
0

If you want to run a single file in watch mode:

yarn run test --watch FileName.test.jsx
wriozumi
  • 569
  • 6
  • 6
0

I personally use the npm package jest-watch-typeahead.

You need to do 3 steps:

  1. Install npm packege:

npm install --save-dev jest jest-watch-typeahead

  1. Add to jest.config.js next code:
module.exports = {
  watchPlugins: [
    'jest-watch-typeahead/filename',
    'jest-watch-typeahead/testname',
  ],
};
  1. Run Jest in watch mode

yarn jest --watch

Ihor
  • 131
  • 1
  • 2
0
you can add the following script to watch all your js files for changes
{
  "scripts": {
    "test": "jest",
    "watch": "jest --watch .js"
  }
}
  • you can run npm test to run your tests ones and you can run npm run watch to run your tests every time you make changes to your test files and save them
Ubda Nam
  • 1
  • 1