Karma tests fail but debug shows pass

Question

I'm having an issue where I run my jasmine unit tests in Karma, and one of my unit tests that depends on an external template (AngularJS directive) doesn't pass. When I go into DEBUG mode in the browser and I view the console however, it shows that this unit test is passing and I can confirm this when I step through the unit test in the browser debugger.

I have other unit tests that also depend on external templates that are passing in Karma as expected, but just this particular test is failing in Karma, but passing the in browser console.

Does anyone have any ideas what might be causing this behavior?

EDIT:

Here's what Karma shows:

TypeError: Unable to get value of the property 'then': object is null or undefined

My project handles templates a little differently than AngularJS typically handles them. We have a templateService we created where it retrieves the correct template based on the templateUrl of a directive which looks like this

templateUrl: "navigation-template"

So I've set up Karma to pull the templates and store them in the templateCache. Then I extract the templates with the key Karma used (the file path) and re-insert them into the templateCache with the templateUrl the directive is expecting. Here's how I do it

var template = '<div>' + templateCache.get(templateFilePath) + '</div>'; }
// template files contain multiple templates so this filters out the one I want
template = $("[TemplateId='" + directiveTemplateUrl + "']", template).html();
templateCache.put(directiveTemplateUrl, template);

For all of the other tests, this works fine, but one in particular is producing the error above. What's more interesting is that if I add console logs like this

var template = '<div>' + templateCache.get(templateFilePath) + '</div>';
if (template.indexOf("undefined") > -1) { throw new Error("Template not in cache."); }
template = $("[TemplateId='" + directiveTemplateUrl + "']", template).html();
if (!template) { throw new Error("Template not found."); }
templateCache.put(directiveTemplateUrl, template);

It logs out that the template wasn't found.

Error: Template not in cache.,Error: Unexpected request: GET navigation-template No more request expected

If I DEBUG in the browser (the DEBUG button when Karma loads the browser), I can confirm the template is there and in the browser console (not the command line where Karma is running, but the F12 developer tools in the browser) it logs out that the test was successful like this

LOG: SUCCESS ButtonsDirectives NavigationDirective Should render a loading message 

Here's what I know:

There are no significant differences between the failing unit test and the passing ones. It is unrelated to the order in which the unit tests run (this one just happens to run first).

Answer 1

I've figured it out. It turns out the template of the failing unit test contained the following:

<a href="javascript:void(0)" ... > ... </a>

While the unit tests themselves were similar, the failing test is the only template with this particular tag in it.

I was running my unit tests through Karma using IE 9 and javascript:void(0) turns out to have problems in IE 9 (I think it's the browser, not sure if this would cause an issue in other browsers. I cannot confirm with my current setup). Removing javascript:void(0) from the anchor tag resolves my issue.

EDIT:

Confirmed, it is a bug with IE 9. It works fine in Chrome.