Incorrect Results from Angular Code Coverage

Currently using Angular.js, Karma, Karma-coverage (Istanbul), and Jasmine for my stack.

While conducting Code Coverage analysis on my app, I encountered an issue which leads to my question - Service A is showing up as covered by tests (in green) even though it actually has no associated tests.

I have a suspicion that the cause of this issue might be:

  • Service A is utilized by Controller B.
  • Controller B has test coverage results displaying accurately as covered by tests.
  • However, while testing Controller B, Service A is not being mocked.

It seems like due to Service A indirectly being called by the tests of Controller B, the incorrect result is being obtained.

Any insights or suggestions? Is my suspicion correct? Are there any workarounds to ensure accurate test coverage results in this scenario?

Appreciate your help!

javascriptangularjsjasmineistanbulkarma-coverage

Answer №1

Regrettably, this is how code coverage is determined. When the code runs, it counts as being "covered". Fortunately, there are steps you can take to minimize some of the inaccurate results. One option is to mock your dependencies!

For instance, you can use a jasmine spy instead of the real service in the following example:

describe('Controller Tests', function() {
  var $scope, mockServiceA;
  
  beforeEach(module('app', function($provide) {
    mockServiceA = jasmine.createSpyObj('mockServiceA', ['foo']);
    $provide.value('ServiceA', mockServiceA);
  }));

  beforeEach(inject(function($rootScope, $controller) {
    $scope = $rootScope.$new();
    $controller('ControllerB', {
      $scope: $scope
    });
  }));
  
  describe('ControllerB', function() {
    it('should call mock service', function() {
      expect(mockServiceA.foo).not.toHaveBeenCalled();
      $scope.useServiceA();
      expect(mockServiceA.foo).toHaveBeenCalled();
    });
  });
});

Check out this functional Plunker for an example: http://plnkr.co/edit/x8gQQNsHT0R5n5iJSxKw?p=info

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

RegEx not triggering Mongoose hooks

When performing queries on my mongo collections, I am attempting to call specific hooks for them. DispatchRequest.findOneAndUpdate({user_name:"umesh"},{email:"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="cdac8 ...

javascriptnode.jsmongodbmongoose

Automatically generated list items are failing to react to the active class

I am facing an issue with two divs in my project. The first div uses the Bootstrap class list-group and is populated with a basic example provided by Bootstrap. The second div is supposed to be populated with list-group-items obtained from an AJAX GET requ ...

javascripttwitter-bootstrap

Unable to invoke the jQuery function within CakePHP3

I am having trouble calling the jQuery function mentioned below in my CakePHP3 MVC project. There are no error messages, but nothing seems to be happening. The code is set up so that jQuery gets included automatically. The function I am trying to call sh ...

javascriptjqueryhtmlcakephp

Issue with writing JSON data to a file in node.js

When I try to write JSON objects from the Twitter API to a file using the fs.appendFile method, all that gets written is "[object Object]". The JSON objects look fine when logged to the console, so I'm not sure why this is happening. For example, the ...

javascriptjsonnode.js

Timeout error occurred in Async.js because the callback was already triggered

Whenever I execute index.js, I encounter an ETIMEDOUT or ECONNRESET error followed by a Callback was already called error. Initially, my assumption was that the issue stemmed from not including a return before calling the onEachLimitItem callback. Consequ ...

javascriptnode.jscallbackpromiseasync.js

Learn the process of dynamically populating an HTML table with data using JavaScript and JSON

I have developed a code snippet to dynamically add an HTML table without using jQuery. The code serves as an application from the server to the client, where the client receives a JSON object to parse into a string. Here is how you can add an HTML table ...

javascripthtmljson

Components in React are unable to be accessed

I'm a complete beginner when it comes to React and I'm facing issues with organizing my components into separate files. The error message I encounter is: ERROR in ./src/App.js 5:0-34 Module not found: Error: You attempted to import /components/ ...

javascriptreactjs

Is it possible for the req.url path in expressjs to represent a different URL?

Recently, I discovered some suspicious requests being sent to my node-express server. In response, I created a middleware to record the request URLs. After logging these requests, I noticed that most of them started with '/', but there were also ...

javascriptnode.jsexpresssecuritywebsecurity

Guide on Validating and Updating an embedded item within a mongoDB Collection Document

How do I go about updating the values of an embedded object within a mongoDB document? The values displayed for {{service.id}} and {{service.username}} in the table template are correct. However, I am unsure of the correct way to access them within the sa ...

javascriptmongodbmeteor

Adding HTML content to a DOM element using Angular

Looking to create a directive that can dynamically append HTML content within a div element. Specifically, I need this directive to handle HTML data fetched from the server using an $http post request. <div id="invoice_template_preview" ng-bind-h ...

angularjsangularjs-directive

Customizing checkboxes in React with JSS: A step-by-step guide

I'm currently working on customizing CSS using JSS as my styling solution, which is proving to be a bit complex while following the w3schools tutorial. https://www.w3schools.com/howto/howto_css_custom_checkbox.asp HTML: <label class="container"& ...

javascriptcssreactjsjss

If the PHP variable evaluates to true, then a CJuiDialog in Yii view will open

I am attempting to open the CJuiDialog if the $check value equals true in the view part. <?php if($check==true) { js:function(){$('#dialogDisplay').dialog('open');} } $this->beginWidget('zii.widgets.jui.CJuiDialog', ...

javascriptphpjqueryformsyii

Show a modal when the axios request is finished

EDIT: After some exploration, I've shared the solution I found in case it helps others facing a similar issue. I'm currently working on building a reusable Bootstrap 5 modal child component within Vue3. The goal is to pass an ID as a prop from t ...

javascripttypescriptaxiosvuejs3bootstrap-5

The error message thrown is: "Unable to assign value to property 'formGroup' as it is not defined

There's a particular component structure as shown below: import { Component, Input } from '@angular/core'; import { WorkingHours } from '../../../../../hours'; import { FormGroup } from '@angular/forms'; @Component({ ...

angulartypescriptunit-testingjasmine

What is the process to ensure a promise resolves as an object in the view?

I am attempting to create a wrapper for a third-party library that will return an object that resolves into a format suitable for display in the view, similar to how $resource() functions. I understand that I can manually use .then() on the promise and set ...

angularjsangular-promisengresource

Rounded Corners on an HTML5 Canvas Triangle

Hi there, I'm relatively new to working with HTML5 Canvas and I'm currently attempting to create a triangle with rounded corners. So far, I've experimented with: ctx.lineJoin = "round"; ctx.lineWidth = 20; However, I haven't been suc ...

javascripthtmlcanvas

Every time I try to use AgGrid selectors, they consistently come back with null results, even though the

I currently have an ag grid in my application: <app-my-component> <ag-grid-angular [gridOptions]="gridOptions" (gridReady)="setGridReady()"> </ag-grid-angular> </app-my-component> When running Karma- ...

javascriptangularjasminekarma-jasmineag-grid

Issues with Autofocus while Searching and Selecting from Dropdown menu

Here is the JavaScript code I am using: <script type="text/javascript"> function handleSelectionChange(selectElement, nextField) { nextField.focus(); } function handleKeyPress(event, currentField, nextField) { i ...

javascripthtmljquerycssbootstrap-4

Issue encountered while validating password using regex pattern?

There seems to be an issue with password validation when requiring 1 upper case, 1 lower case, 1 number, and 1 special character. methods: { validateBeforeSubmit() { this.$validator.localize('en', dict) this.$validator.validate ...

javascriptregexvue.jsvee-validate

Automatically submitting the selection when it changes

I am facing an issue with a selection form that is supposed to update the database on change using jQuery, but it seems like nothing is happening. Can anyone provide assistance with this problem? <SELECT name='status' id='status'> ...

javascriptphpjquery