CODEWITHSUNDEEP
angularjsunit-testing
Valtena
Valtena

Reputation: 21

angular test, can't find variable : $scope

I did read the angular official tutorial and launch test with success. But I tried to make test for a simple controller (when you click on button a boolean change), i have the following error : ReferenceError: Can't find variable: $scope

controller : 

siteLogic = angular.module('siteLogic', []);

siteLogic.controller('siteCtrl', ['$scope',function($scope, initMap) {
  $scope.addingSite=false;

  $scope.changeAddingSite = function(){
    $scope.addingSite= !$scope.addingSite;
  };
}]);

file for test :

  describe('$scope initialisation', function() {

    beforeEach(module('siteLogic'));

    describe('sets the addingSite at the inverse', function() {
      var scope, controller;


      beforeEach(inject(function($controller, $rootScope) {
        scope = $rootScope.$new(); 
        //it's on the next line I have the error indication
        controller = $controller('siteCtrl', { $scope: scope }); 
      }));

      it('sets true if false', function() {
        scope.addingSite = false;
        scope.changeAddingSite();
        expect(scope.addingSite).toEqual(true);
      });

      it('sets false if true', function() {
        $scope.addingSite = true;
        $scope.changeAddingSite();
        expect($scope.addingSite).toEqual(false);
      });
    });
  });

karma.config.js

module.exports = function(config) {
  config.set({
    basePath: '..',
    frameworks: ['jasmine'],
    files: [
      'test/dep/angular-1.3.15/angular.js',
      'test/dep/angular-1.3.15/angular-resource.js',
      'test/dep/angular-1.3.15/angular-route.js',
      'test/dep/angular-1.3.15/angular-mocks.js',
      'lib/map/public/angular/*.js',
      'test/map/*.js'
    ],
    autoWatch: true,
    browsers: ['PhantomJS']
  });
};

Upvotes: 1

Views: 6127

Answers (1)

Krzysztof Safjanowski
Krzysztof Safjanowski

Reputation: 7438

In the second group of test change $scope to scope

  it('sets false if true', function() {
    $scope.addingSite = true; // there is no $scope
    $scope.changeAddingSite();
    expect($scope.addingSite).toEqual(false);
  });


var siteLogic = angular.module('siteLogic', []);

siteLogic.controller('siteCtrl', ['$scope',function($scope) {
  $scope.addingSite=false;

  $scope.changeAddingSite = function(){
    $scope.addingSite= !$scope.addingSite;
  };
}]);

describe('$scope initialisation', function() {

    beforeEach(module('siteLogic'));

    describe('sets the addingSite at the inverse', function() {
      var scope, controller;


      beforeEach(inject(function($controller, $rootScope) {
        scope = $rootScope.$new(); 
        //it's on the next line I have the error indication
        controller = $controller('siteCtrl', { $scope: scope }); 
      }));

      it('sets true if false', function() {
        scope.addingSite = false;
        scope.changeAddingSite();
        expect(scope.addingSite).toEqual(true);
      });

      it('sets false if true', function() {
        scope.addingSite = true;
        scope.changeAddingSite();
        expect(scope.addingSite).toEqual(false);
      });
    });
  });
<link href="http://safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine.css" rel="stylesheet"/>
<script src="http://safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine-2.0.3-concated.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular-mocks.js"></script>

Upvotes: 2

Related Questions