Karma and RequireJS getting files outside base url

Question

I am trying to configure automatic testing using karma. My file structure is as follows

/assests
/css
/font
/img
/js
    /collection
    /lib
    /model
    /plugin
    /spec
    /view
    test-main.js
    main.js
/templates
index.html
karma.conf.js

karma.conf.js:

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', 'requirejs'],

    // list of files / patterns to load in the browser
    files: [
  'js/test-main.js',
      {pattern: 'js/*.js', included: false},
      {pattern: 'js/collection/*.js', included: false},
      {pattern: 'js/lib/**/*.js', included: false},
      {pattern: 'js/lib/**/**/*.js', included: false},
      {pattern: 'js/lib/**/**/**/*.js', included: false},
      {pattern: 'js/model/*.js', included: false},
      {pattern: 'js/model/**/*.js', included: false},
      {pattern: 'js/plugin/*.js', included: false},
      {pattern: 'js/plugin/**/*.js', included: false},
      {pattern: 'js/spec/*.js', included: false},
      {pattern: 'js/spec/**/*.js', included: false},
      {pattern: 'js/view/**/*.js', included: false},
      {pattern: 'js/view/*.js', included: false}
    ],


    // list of files to exclude
    exclude: [
      'js/main.js',
      'js/initScript.js',
      'js/SpecRunner.js'
    ],
    etc. . . 
}

test-main.js:

var allTestFiles = [];
var TEST_REGEXP = /spec/i;

var pathToModule = function(path) {
  return path.replace(/^\/base\//, '').replace(/\.js$/, '');
};

Object.keys(window.__karma__.files).forEach(function(file) {
  if (TEST_REGEXP.test(file)) {
    // Normalize paths to RequireJS module names.
    allTestFiles.push(pathToModule(file));
  }
});

require.config({
  // Karma serves files under /base, which is the basePath from your     config file
  baseUrl: '../',

  //  dynamically load all test files
  deps: allTestFiles,

  // we have to kickoff jasmine, as it is asynchronous
  callback: window.__karma__.start,

  paths: {
    'jquery' : 'lib/jqm/jquery-1.11.2.min',
    'underscore' : 'lib/underscore/underscore',
    'backbone' : 'lib/backbone/backbone',       
    'template' : '../template',
 },

  shim : {
        backbone : {
            deps : [ 'underscore', 'jquery' ],
            exports : 'Backbone'
        }
   }
});

Loading all the js files works nicely. The current problem is that I cannot load any resources outside the base path.

So when my tests attempt to fetch a template (which is under '../template/) karma cannot find those templates and fails.

I cannot change my base path because all the JS modules are under 'js/'.

Is there anyway to load resources outside the base path ?

Answer 1

As you wrote it yourself

 // Karma serves files under /base, which is the basePath from your     config file
 baseUrl: '../',

So it means if you want to be able to access files deeper than that you need to shift all your url with a:

 baseUrl: '../..',

You could also use base/ which will be understood by karma as the basePath of your karmaConf.js

For a better understanding on how the basePath of karma.conf and test-main.js works you can have a look at this: http://monicalent.com/blog/2015/02/11/karma-tests-angular-js-require-j/