serve binary data with karma and browerify

Question

I am using karma + jasmine + browserify to run my tests.

If I try to serve extra data with karma, my test is not working anymore and it tells me "Can't find variable: require".

If I do not try to serve any additional data, it works as expected.

How can I serve data with browserify then?

If I remove "{pattern: 'app/data/dcm/fruit', included: false, watched: false, served: true}" in the following configuration file, "require" is not undefined anymore, but of course I can not access the data I want my test to load.

karma.conf:

// Karma configuration
// Generated on Tue Apr 14 2015 09:16:02 GMT+0200 (CEST)
'use strict';

module.exports = function(config) {
  config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',

    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine', 'browserify'],

    // list of files / patterns to load in the browser
    files: [
      'app/**/*.test.js',
      {pattern: 'app/data/dcm/fruit', included: false, watched: false, served: true}
    ],

    // list of files to exclude
    // exclude: [
    //   'app/doc/**/*.js',
    //   'app/examples/**/*.js'
    // ],

    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
      'app/**/*.test.js': ['browserify']
    },

    browserify: {
      debug: true,
      transform: [ 'glslify', 'babelify' ]
    },

    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    //    reporters: ['progress'],

    // web server port
    port: 9876,

    // enable / disable colors in the output (reporters and logs)
    colors: true,

    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_DEBUG,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: false,

    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['PhantomJS'],

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: true
  });

dummy test file:

/* globals describe, it, expect, beforeEach*/
'use strict';

var vjsParsersDicom = require('../parsers/parsers.dicom.js');

var datasets = [];
// fruit dataset
var data = {
  name: 'fruit',
  url: 'base/data/dcm/fruit',
  nbOfFrames: 60
};
datasets.push(data);

// for(var i=0; i<datasets.length; i++){
      var i = 0;
  describe('Parsing ' + datasets[i].name, function() {

    // before each, load the data...
    var dataset;
    beforeEach(function(done) {

      window.console.log(datasets[i].url);
      // fetch the data!
      var oReq = new XMLHttpRequest();
      oReq.open('GET', datasets[i].url, true);
      oReq.responseType = 'arraybuffer';

      oReq.onload = function (oEvent) {
        var arrayBuffer = oReq.response; // Note: not oReq.responseText
        if (arrayBuffer) {
          dataset = vjsParsersDicom.parseArrayBuffer(arrayBuffer);
          done();
        }
      };
      oReq.send(null);
    });


    it('contains expected number of frames', function() {
      expect(true).toBe(true);
    });
  });
// }

The error:

nico@OSXLAP01821:~/work/gitroot/vjs$ ./node_modules/karma/bin/karma start
DEBUG [plugin]: Loading karma-* from /Users/nico/work/gitroot/vjs/node_modules
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-browserify.
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-chrome-launcher.
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-dart.
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-firefox-launcher.
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-jasmine.
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-mocha.
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-phantomjs-launcher.
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-sauce-launcher.
DEBUG [plugin]: Loading plugin /Users/nico/work/gitroot/vjs/node_modules/karma-spec-reporter.
DEBUG [framework.browserify]: created browserify bundle: /var/folders/g9/pdmxn9d17d50xghb4_yx84hh0005jg/T/e2e0ee5672a57d5a9e676449ef8d0462.browserify
DEBUG [framework.browserify]: add bundle to config.files at position 0
INFO [karma]: Karma v0.12.31 server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
DEBUG [temp-dir]: Creating temp dir at /var/folders/g9/pdmxn9d17d50xghb4_yx84hh0005jg/T/karma-18408756
DEBUG [launcher]: /Users/nico/work/gitroot/vjs/node_modules/phantomjs/lib/phantom/bin/phantomjs /var/folders/g9/pdmxn9d17d50xghb4_yx84hh0005jg/T/karma-18408756/capture.js
DEBUG [framework.browserify]: building bundle
DEBUG [framework.browserify]: bundling
INFO [framework.browserify]: 454 bytes written (0.00 seconds)
INFO [framework.browserify]: bundle built
DEBUG [framework.browserify]: updating app/modules/parsers/parsers.dicom.test.js in bundle
DEBUG [web-server]: serving: /Users/nico/work/gitroot/vjs/node_modules/karma/static/client.html
DEBUG [web-server]: serving: /Users/nico/work/gitroot/vjs/node_modules/karma/static/karma.js
DEBUG [web-server]: upgrade /socket.io/1/websocket/9aVjgD27TyfoPeZwwQcQ
DEBUG [karma]: A browser has connected on socket 9aVjgD27TyfoPeZwwQcQ
INFO [PhantomJS 1.9.8 (Mac OS X)]: Connected on socket 9aVjgD27TyfoPeZwwQcQ with id 18408756
DEBUG [launcher]: PhantomJS (id 18408756) captured in 2.577 secs
DEBUG [framework.browserify]: resetting bundle
DEBUG [framework.browserify]: bundling
INFO [framework.browserify]: 386169 bytes written (2.01 seconds)
INFO [framework.browserify]: bundle updated
DEBUG [watcher]: Resolved files:
    /Users/nico/work/gitroot/vjs/node_modules/jasmine-core/lib/jasmine-core/jasmine.js
    /Users/nico/work/gitroot/vjs/node_modules/karma-jasmine/lib/boot.js
    /Users/nico/work/gitroot/vjs/node_modules/karma-jasmine/lib/adapter.js
    /var/folders/g9/pdmxn9d17d50xghb4_yx84hh0005jg/T/e2e0ee5672a57d5a9e676449ef8d0462.browserify
    /Users/nico/work/gitroot/vjs/app/modules/parsers/parsers.dicom.test.js
    /Users/nico/work/gitroot/vjs/app/data/dcm/fruit.dcm
    /Users/nico/work/gitroot/vjs/app/data/dcm/series/36444280.dcm
    /Users/nico/work/gitroot/vjs/app/data/dcm/series/36444294.dcm
    /Users/nico/work/gitroot/vjs/app/data/dcm/series/36444308.dcm
    /Users/nico/work/gitroot/vjs/app/data/dcm/series/36444322.dcm
    /Users/nico/work/gitroot/vjs/app/data/dcm/series/36444336.dcm
DEBUG [web-server]: serving: /Users/nico/work/gitroot/vjs/node_modules/karma/static/context.html
DEBUG [web-server]: serving (cached): /Users/nico/work/gitroot/vjs/node_modules/jasmine-core/lib/jasmine-core/jasmine.js
DEBUG [web-server]: serving (cached): /Users/nico/work/gitroot/vjs/node_modules/karma-jasmine/lib/boot.js
DEBUG [web-server]: serving (cached): /Users/nico/work/gitroot/vjs/node_modules/karma-jasmine/lib/adapter.js
DEBUG [web-server]: serving (cached): /var/folders/g9/pdmxn9d17d50xghb4_yx84hh0005jg/T/e2e0ee5672a57d5a9e676449ef8d0462.browserify
DEBUG [web-server]: serving (cached): /Users/nico/work/gitroot/vjs/app/modules/parsers/parsers.dicom.test.js
PhantomJS 1.9.8 (Mac OS X) ERROR
  ReferenceError: Can't find variable: require
  at /Users/nico/work/gitroot/vjs/app/modules/parsers/parsers.dicom.test.js:1


DEBUG [karma]: Run complete, exiting.
DEBUG [launcher]: Disconnecting all browsers
DEBUG [framework.browserify]: cleaning up

Answer 1

Karma was confused by what I was trying to serve. We have to be more specific about the data being served.

Also, Karma can not serve arbitrary binary data such as DICOM (.dcm). First we have to rename the.dcm files to .dcm.tar.

It seems we can only serve files, so to serve all files I should use:

files: [
      'app/**/*.test.js',
      {pattern: 'app/data/**/*', included: false, watched: false, served: true}
    ]

and to serve only files with a given extension:

files: [
      'app/**/*.test.js',
      {pattern: 'app/data/**/*.dcm.tar', included: false, watched: false, served: true}
    ]