Jasmine

Jasmine Demo

by Mike Baranski

HTML

<script src="https://code.angularjs.org/1.4.9/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine-html.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/boot.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.css">
<script src="https://code.angularjs.org/1.4.9/angular-route.js"></script>
<script src="https://code.jquery.com/jquery-2.2.2.js"></script>
<script src="https://code.angularjs.org/1.4.9/angular-mocks.js"></script>
<div style='margin-top: 1em;' ng-controller="MyCtrl">
  Hello, {{name}}!
</div>
<br/>

JavaScript

var myApp = angular.module('myApp', []);
var endpoint = '/echo/json/';
myApp.factory('dataFactory', function($http) {
  var getData = function() {
    var data = $.param({
      json: JSON.stringify({
        name: "Name from Echo Service"
      })
    });
    return $http.post(endpoint, data);
  }

  return {
    getData: getData
  }
});

myApp.controller('MyCtrl', function($scope, dataFactory) {
  $scope.name = 'Original Name';
  dataFactory.getData().then(function(data) {
    $scope.name = data.data.name;
  });
});

describe('Test For Site', function() {
  beforeEach(angular.mock.module('myApp'));
  var $controller;
  var $httpBackend;
  var $q;
  var $rootScope;
  beforeEach(angular.mock.inject(function(_$controller_, _$httpBackend_, _$q_, _$rootScope_) {
    $controller = _$controller_;
    $httpBackend = _$httpBackend_;
    $q = _$q_;
    $rootScope = _$rootScope_;
  }));

  describe('test pageController', function() {
    it('Check that scope.name is pulled from REST service', function() {

      var scope = {};
      $httpBackend.expect('POST', endpoint);
      $httpBackend.whenPOST(endpoint, function(str) {
        return true;
      }).respond({
        name: "Name from Echo Service"
      });

      var controller = $controller('MyCtrl', {
        $scope: scope,
      });
      $httpBackend.flush();
      expect(scope.name).toBe('Name from Echo Service');
    });
  });
});