Use angularjs directive templates from $templateCache in karma tests

Question

I know how to load templates in my karma tests using the ng-html2js preprocessor. However, in our project we have a templates.js file already that looks like so:

angular.module("myApp").run(
    ["$templateCache", function($templateCache) {
        $templateCache.put(
            "app/directive-template.html",
            "<span>Some fancy template.</span>");
    ...
});

It is generated with the gulp-angular-templatecache plugin. This works great for production but fails for tests. The file is included in the karma.conf.js and loads correctly, but the run-function is only executed after the tests have executed.

How can I make karma wait for the run phase so the templates are loaded before the tests are executed?

score 1 · Answer 1 · edited May 23 '17 at 12:33

if you beforeEach your myApp module, then your template will be loaded

I use gulp ng-hmtl2js to create my template.js file and the entry looks like this:

    //app template
gulp.task('template_app', function () {
    return gulp.src('./app/**/*.tpl.html')
        .pipe(ngHtml2Js({
            moduleName: "template.app"
        }))
        .pipe(concat('app.template.js'))
        .pipe(gulp.dest('./app'));
});

then in my test I do:

beforeEach(module('template.app'));

See the answer that helped me @ https://stackoverflow.com/a/28832167/1843436

Use angularjs directive templates from $templateCache in karma tests

1 Answers1