Introduction to Karma-Jasmine

Karma-Jasmine is a powerful combination for unit testing in JavaScript. Karma is a test runner that fits well with any JavaScript framework, while Jasmine is a behavior-driven development framework for testing JavaScript code. Together, they provide an efficient and robust testing environment. In this guide, we will delve into the various APIs provided by Karma-Jasmine and demonstrate their use with practical code snippets.

Setting Up Karma-Jasmine

  
  npm install karma --save-dev
  npm install jasmine-core --save-dev
  npm install karma-jasmine --save-dev
  npm install karma-chrome-launcher --save-dev
  

Create a Karma configuration file:

  
  module.exports = function(config) {
    config.set({
      frameworks: ['jasmine'],
      files: [
        'src/**/*.js',
        'test/**/*.spec.js'
      ],
      browsers: ['Chrome'],
      singleRun: true,
    });
  };
  

Basic Jasmine Example

Here is a simple test case in Jasmine:

  
  describe("A suite", function() {
    it("contains spec with an expectation", function() {
      expect(true).toBe(true);
    });
  });
  

Jasmine Matchers

Jasmine matchers provide various ways to compare values:

  
  describe("Matchers", function() {
    it("The 'toBe' matcher compares with ===", function() {
      expect(true).toBe(true);
    });

    it("The 'toEqual' matcher works for objects", function() {
      expect({a: 1}).toEqual({a: 1});
    });

    it("The 'toMatch' matcher is used for regular expressions", function() {
      expect("Hello World").toMatch(/World/);
    });

    it("The 'toBeDefined' matcher checks if a variable is defined", function() {
      var a = {foo: "bar"};
      expect(a.foo).toBeDefined();
    });
  });
  

Spies in Jasmine

Spies are used to track or stub functions:

  
  describe("Spies", function() {
    var foo, bar;
    
    beforeEach(function() {
      foo = {
        setBar: function(value) {
          bar = value;
        }
      };

      spyOn(foo, 'setBar');
      foo.setBar(123);
      foo.setBar(456, 'another param');
    });

    it("tracks that the spy was called", function() {
      expect(foo.setBar).toHaveBeenCalled();
    });

    it("tracks all the arguments of its calls", function() {
      expect(foo.setBar).toHaveBeenCalledWith(123);
      expect(foo.setBar).toHaveBeenCalledWith(456, 'another param');
    });
  });
  

Example Application with Karma-Jasmine

Below is an example of a simple JavaScript calculator application tested with Karma-Jasmine:

  
  // src/calculator.js
  function Calculator() {
      this.add = function(a, b) {
          return a + b;
      };
      this.subtract = function(a, b) {
          return a - b;
      };
      this.multiply = function(a, b) {
          return a * b;
      };
      this.divide = function(a, b) {
          if (b === 0) throw new Error("Divide by Zero Error");
          return a / b;
      };
  }
  

Test cases for the calculator:

  
  // test/calculator.spec.js
  describe("Calculator", function() {
      var calculator;

      beforeEach(function() {
          calculator = new Calculator();
      });

      it("should add two numbers", function() {
          expect(calculator.add(1, 2)).toBe(3);
      });

      it("should subtract two numbers", function() {
          expect(calculator.subtract(5, 3)).toBe(2);
      });

      it("should multiply two numbers", function() {
          expect(calculator.multiply(4, 3)).toBe(12);
      });

      it("should divide two numbers", function() {
          expect(calculator.divide(9, 3)).toBe(3);
      });

      it("should throw error when dividing by zero", function() {
          expect(function() { calculator.divide(1, 0); }).toThrow(new Error("Divide by Zero Error"));
      });
  });
  

With these powerful tools and comprehensive examples, you can effectively harness the capabilities of Karma-Jasmine for your JavaScript projects, ensuring robust and reliable code testing.

Hash: d3ec9171bdc68c9fe51268840ae7444ebfaab5ca0aa2f19a670b89f2e2aa575b