Mocha Webstorm Config with Babel / --harmony

Here's the screen cast showing my issue also: https://youtu.be/0HRc3QpfUHM

I've been running my mocha tests via gulp tasks and terminal up till now in Webstorm.  I have Webstorm v.10.0.4.

So here's what that looks like

require("harmonize")();

gulp.task('mocha-bdd-features', function() {
    process.env.PORT = 8001;
    return gulp.src([config.test.src.bdd.features], { read: false })
        .pipe(mocha({
            compilers: {
                js: babel
            },
            reporter: config.test.mocha.reporter,
            ui: 'bdd'
        }))
        .on('error', gutil.log);
});

Note that to put the --harmony flag in so that my entire codebase is aware of it I'm using node-harmonize which enables Node's harmony flag programmatically.

so at the top of my gulp file I have require("harmonize")();

then when run, you see the results in terminal:

So now I figured why not use a mocha config so I can use the nice Test Runner Built-into Mocha.

This was my first attempt to create a mocha test configuration.

I created a new configuration and here's how it's set so far:

Problem is when I run it, the ES6 transpiler isn't being wired up during compile-time and so any ES6 code mocha tests run across, blows up.  I tried adding the flag --compilers js:babel/register but that didn't help the situation.

So again through running tests via a gulp task everything is fine and dandy because I'm uisng that harmonize module through gulp.  So how do I get this happy with webstorm moch and ES6?