我该如何测试这个Angular控制器？

Question

I'm discovering Karma great world and I wanted to ask you a simple question about a controller I want to test. Here it is :

angular.module('app', ['ngSanitize'])
.controller('MyController', ['$scope', '$http', function ($scope, $http) {
    $scope.myCtrlData = '';

    $http.get('../../data/file.json').then(function (res) {
    $scope.myCtrlData = res.data.ctrlData;
  });
}]);

It simply feed $scope.myCtrlData with a local json file content.

I started to write a quick test but I am stuck when running it.

describe('Test : MyController', function() {
  var scope, httpBackend, make;

  beforeEach(module('ngSanitize'));
  beforeEach(module('app'));
  beforeEach(inject(function($rootScope, $controller, $httpBackend){
    httpBackend = $httpBackend;
    scope = $rootScope.$new();

    httpBackend.whenGET('../../data/file.json')
    .respond(200, {
        'data': { 'ctrlData': 'Yeah' }
    });

    make = $controller('MyController', { '$scope': scope });

  }));

  it('should get the data', function() {
    httpBackend.flush();
    expect(scope.myCtrlData).toBeDefined();
    expect(scope.myCtrlData).toEqual('Yeah');
  });
});

As a result I get a fail with this log :

PhantomJS 2.1.1 (Mac OS X 0.0.0) BioController should get the data FAILED
    Expected undefined to equal 'Yeah'.
/Users/toto/Projects/awesomeproject/tests/views/yeah/test.js:32:30
PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 1 of 1 (1 FAILED) (0 secs / 0.01 secsPhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.002 secs / 0.01 secs)

Could you please help me to figure out what did I do wrong ?

Thank you very much for your precious help :-)

Answer 1

You need to instantiate the controller.

make = $controller('MyController', { '$scope': scope });

with

$controller('MyController', { '$scope': scope });

Also,

can you modify your code

 it('should get the data', function() { 
    httpBackend.whenGET('../../data/file.json')
    .respond(200, {
        'data': { 'ctrlData': 'Yeah' }
    });
    expect(scope.myCtrlData).toBeDefined();
    expect(scope.myCtrlData).toEqual('Yeah');
    httpBackend.flush();
  });

Remove the httpBackend from the beforeEach and check