Use karma-ng-html2js-preprocessor

Author: ashawley

app/main/mainDirective.js

@@ -3,8 +3,8 @@
 angular.module('mainModule')
   .directive('mainDirective', function () {
     return {
-      template: '<h1>{{greeting}}</h1>'
-      // templateUrl: 'main/mainView.html'
+      // template: '<h1>{{greeting}}</h1>'
+      templateUrl: 'main/mainView.html'
     };
   }
 );

karma.conf.js

@@ -4,6 +4,10 @@ module.exports = function(config) {
 
     basePath: '.',
 
+    ngHtml2JsPreprocessor: {
+      stripPrefix: 'app/'
+    },
+
     files: [
       'app/lib/jquery/dist/jquery.js',
       'app/lib/angular/angular.js',
@@ -22,13 +26,18 @@ module.exports = function(config) {
       'app/main/mainComponent.js',
       'app/app.js',
       'app/appConfig.js',
+      'app/main/mainView.html',
       'test/**/*Spec.js'
     ],
 
     exclude: [
       '**/*~'
     ],
 
+    preprocessors: {
+      'app/main/mainView.html': ['ng-html2js']
+    },
+
     frameworks: ['jasmine'],
 
     browsers: [

package-lock.json

@@ -23,6 +23,7 @@
     "karma-firefox-launcher": "^0.1.7",
     "karma-jasmine": "^0.2.3",
     "karma-junit-reporter": "^0.4.2",
+    "karma-ng-html2js-preprocessor": "^1.0.0",
     "karma-phantomjs-launcher": "^1.0.3",
     "path": "^0.12.7",
     "phantomjs-prebuilt": "^2.1.16",

package.json

@@ -3,6 +3,7 @@
 describe('mainDirective', function() {
 
   beforeEach(module('mainModule'));
+  beforeEach(module('main/mainView.html'));
 
   var element;
   var scope;