how to fix 404 warnings for images during karma unit testing

Question

I'm unit testing one of my directives (angularjs) using grunt/karma/phantomjs/jasmine. My tests run fine

describe('bar foo', function () {     beforeEach(inject(function ($rootScope, $compile) {         elm = angular.element('<img bar-foo src="img1.png"/>');         scope = $rootScope.$new();         $compile(elm)();         scope.$digest();     }));     .... }); 

but I do get these 404s

WARN [web-server]: 404: /img1.png WARN [web-server]: 404: /img2.png ... 

Although they do nothing, they do add noise to the log output. Is there a way to fix this ? (without changing karma's logLevel of course, because I do want to see them)

Answer 1

That is because you need to configurate karma to load then serve them when requested ;)

In your karma.conf.js file you should already have defined files and/or patterns like :

// list of files / patterns to load in the browser files : [   {pattern: 'app/lib/angular.js', watched: true, included: true, served: true},   {pattern: 'app/lib/angular-*.js', watched: true, included: true, served: true},   {pattern: 'app/lib/**/*.js', watched: true, included: true, served: true},   {pattern: 'app/js/**/*.js', watched: true, included: true, served: true},   // add the line below with the correct path pattern for your case   {pattern: 'path/to/**/*.png', watched: false, included: false, served: true},   // important: notice that "included" must be false to avoid errors   // otherwise Karma will include them as scripts   {pattern: 'test/lib/**/*.js', watched: true, included: true, served: true},   {pattern: 'test/unit/**/*.js', watched: true, included: true, served: true}, ],  // list of files to exclude exclude: [  ],  // ... 

You can have a look here for more info :)

EDIT : If you use a nodejs web-server to run your app, you can add this to karma.conf.js :

proxies: {   '/path/to/img/': 'http://localhost:8000/path/to/img/' }, 

EDIT2 : If you don't use or want to use another server you can define a local proxy but as Karma doesn't provide access to port in use, dynamically, if karma starts on another port than 9876 (default), you will still get those annoying 404...

proxies =  {   '/images/': '/base/images/' }; 

Related issue : https://github.com/karma-runner/karma/issues/872