GulpJs - add browserify, reactify and rewireify to karma gulp task

Question

I currently use following command to

• add all my test scripts into suite.js
• transform my jsx

• use rewireify to add getter and setter methods for testing

  browserify -e app/src/tests/suites.js -t reactify -t rewireify -o app/src/tests/bundle.js
  

Then :

karma start

I have to run this everytime I make a change to code. Can anyone please tell me how I can set this up in a watch task to do this everytime I save?

Many thanks

EDIT:

Would gulp-concat be an option, something like this?

gulp.task('test', function () {
gulp.src([
    './App/src/tests/**/*.js'
]).pipe(concat('suites.js'))
    .pipe(rewireify())
    .pipe(reactify())
    .pipe(gulp.dest('./App/src/tests/concatBundle.js'))
    .pipe(karma({
        configFile: 'karma.conf.js',
        action: 'run'
    }))
    .on('error', function(err) {
        throw err;
    });
});

Answer 1

GulpJs is just a bunch of code written in Node, so you can use any Node code inside your gulp file. You can use child_process.spawn to run arbitrary commands. For example, you could include something like the following inside your watch task. Node documentation

var spawn = require('child_process').spawn,
    cmd = spawn('browserify', ['-e', 'app/src/tests/suites.js', '-t', 'reactify', '-t', <... list each arg as an array item ...>] );

spawn.stdout.on('data', function (data) {
  console.log('stdout: ' + data);
});

spawn.stderr.on('data', function (data) {
  console.log('stderr: ' + data);
});

spawn.on('close', function (code) {
  console.log('child process exited with code ' + code);
  //Your command is finished here... so you could kick off another command like 'karma start'
});