Run "node test" as part of Visual Studio Team Services build task with results in "tests" tab

Question

I have a project that contains tests that I am running with Mocha from the command line. I have set up a test script in my packages.json, which looks as follows:

"test": "mocha ./**/*.spec.js --reporter dot --require jsdom-global/register"

I have currently got a simple task set up in Visual Studio Team Services, which just runs the npm test command, this runs Mocha within a console and continues/fails the build depending on whether the tests pass.

What I'd like to be able to do is have the results of my tests populate the "tests" tab in the build definition after it's run. In the same way that I can get this tab populated if I'm running tests on C# code.

I've tried using Chutzpah for this, but it's overly complicated and seems to require that I jump through all sorts of hoops that mean changing my tests and writing long config files. I already have loads of tests written, so really don't want to have to do that. When it did finally discover any of my tests, it complained about require and other things related to Node modules.

Is what I'm asking for actually possible? Is there a simple way of achieving this that's compatible with running my tests in Node?

Answer 1

I've found a good way of doing it that requires no third-party adapter (eg. Chutzpah). It involves getting Mocha to output its report in an XML format, and setting up Visual Studio Team Services to publish the results in an extra step of the build definition.

I installed mocha-junit-reporter (https://www.npmjs.com/package/mocha-junit-reporter) and altered my test script to the following:

"test": "mocha ./temp/**/*.spec.js --reporter mocha-junit-reporter --require jsdom-global/register"

I then created a new step in my build definition using the "Publish Test Results" task. I set the result format to "JUnit" and added the correct path for the outputted test-results.xml file created by the reporter.

It is worth noting that although Mocha comes with an "XUnit" reporter, this format appears to not work correctly with VSTS even though it's listed as an option.

The results of npm test now show up in the "tests" tab alongside any other tests from MSTest etc.

Answer 2

I'm using karma and got this to work in the same way as @dylan-parry suggested. Some excepts below in case it helps others:

package.json

  "scripts": {
    "test": "cross-env NODE_ENV=test karma start"
  }

karma.conf.js

const webpackCfg = require('./webpack.config')('test');

module.exports = function karmaConfig(config) {

  config.set({
    reporters: ['mocha', 'coverage', 'junit'],
    junitReporter: {
      outputDir: 'coverage',
      outputFile: 'junit-result.xml',
      useBrowserName: false
    }
  })
...

TFS

It may also be worth adding I'm using branch policies on my git branch to prevent PR's being merged if the tests fail, info via this link:

https://www.visualstudio.com/en-us/docs/git/branch-policies

Here's the output in TFS:

Next step is to get the coverage working too!