why do I need to specify all files for karma config even if they are loaded with requirejs

Question

I have the following directory structure:

--app
  |---dots
  |    |---some.js
  |
  |---entry.js
  |---bootstrap.js
  |---karma.conf.js
  |---test-main.js
  |---test
      |---sampleSpec.js

Here is my sampleSpec dependencies:

define(["app/bootstrap", "app/dots/some"], function () {}]

So as I understand it I load bootstrap and some files into browser using requirejs. However, depending on whether I specify dots/* folder in my karma.conf.js file the karma server succeeds or fails to resolve dots/some.js file. What I mean is if I specify the following pattern: 'app/**/*.js' in karma.conf.js:

files: [
  'test-main.js',
  {pattern: 'app/**/*.js', included: false},
  {pattern: 'test/*Spec.js', included: false}
],

The dots/some.js file is loaded into browser, if I specify like this pattern: 'app/*.js' karma server returns 404 - file not found. Why is it so? Why should karma care about the path if I load it using requirejs?

Solution

When you fire karma up, what karma does is:

• It does some pre-process job
• It creates a webpage where your web assets are loaded (css, js, etc...)
• It creates a webserver to serve your assets

The webserver needs to know where you have your own assets and if you want to serve them straight from the page or load them later.

In your karma config file you have several options to configure how you want to load them:

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

proxies: {
  '/img/': 'http://localhost:8080/base/test/images/'
}

In the files array you can put all the resources that you want to be included, watched and served.

If you want instead to use a custom URL (say you have a specific route in your app) you can tell karma how to reflect that custom URL to a static URL or simply to to map it (say you're using a third party service).

If a file is not mapped there karma won't serve it, so when you're requiring it your request will have an HTTP 404 response.
Karma accepts also regexp patterns (minimatch strings) as routes - as specified in the documentation - so your app/**/*.js will match any js files within app at any level, while app/*.js will only match JS files strictly inside the app folder.

In case of a proxy, say you're interested to serve images, karma sets up a static server where http://localhost:8080/base maps your project root directory.

For a full explanation have a look at the karma documentation.

Comments

[MarcoL]

Because it has to create the routing to serve them when required. Karma creates a web server that serves the files you want to test: if you don't load them at startup you still want to reach them later, that's why it wants to know where they are.

[Max Koretskyi]

thanks, so what you're basically saying is that because I can create a custom URL to request dots/some.js file, karma server is not going to automatically map it to app/dots/some.js? Do you have a source code location to check out this mapping in karma's sources?

[MarcoL]

No, I'm saying you have always to say to karma where your files/assets are. And above there's how to say that.

[MarcoL]

Good spot. I've updated the answer here to have proxies as objects. It has always been an object, I just misspelled it.

[jay rangras]

why a specific sequence of files is required while performing karma jasmine in angularjs?