如何在jasmine测试中为角度项目注入依赖项_Jasmine_Angularjs

如何在jasmine测试中为角度项目注入依赖项

jasmine angularjs

如何在jasmine测试中为角度项目注入依赖项,jasmine,angularjs,Jasmine,Angularjs,以下是测试规范文件： describe('Test main controller', function(){ it('Should initialize value to Loading', function(){ $scope = {} ctrl = new mainNavController($scope) expect($scope.wksp_name).toBe('Loading')

以下是测试规范文件：

describe('Test main controller', function(){
        it('Should initialize value to Loading', function(){
            $scope = {}
            ctrl =  new mainNavController($scope)
            expect($scope.wksp_name).toBe('Loading')
        })
    })

这是控制器文件

function mainNavController($scope) {
    $scope.wksp_name = 'Loading...'
    $scope.$on('broadCastWkspNameEvent', function (e, args) {
        $scope.wksp_name = args
    })
}

mainNavController.$inject=['$scope']

但是我的测试失败了，因为

Object#没有方法“$on”

我正在使用茉莉花的基本设置

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>Jasmine Spec Runner</title>

  <link rel="shortcut icon" type="image/png" href="testlib/jasmine-1.2.0/jasmine_favicon.png">
  <link rel="stylesheet" type="text/css" href="testlib/jasmine-1.2.0/jasmine.css">
  <script type="text/javascript" src="testlib/jasmine-1.2.0/jasmine.js"></script>
  <script type="text/javascript" src="testlib/jasmine-1.2.0/jasmine-html.js"></script>

  <!-- include source files here... -->
  <script type="text/javascript" src="/static_files/js/test-specs/main-nav-spec.js"></script>

  <!-- include spec files here... -->
  <script type="text/javascript" src="/static_files/js/common/jquery/latest.js"></script>
  <script type="text/javascript" src="/static_files/js/common/angular/angular-1.0.1.min.js"></script>
  <script type="text/javascript" src="/static_files/js/common/angular/angular-resource-1.0.1.min.js"></script>
  <script type="text/javascript" src="/static_files/js/section/main-nav-controller.js"></script>

  <script type="text/javascript">
    (function() {
      var jasmineEnv = jasmine.getEnv();
      jasmineEnv.updateInterval = 1000;

      var htmlReporter = new jasmine.HtmlReporter();

      jasmineEnv.addReporter(htmlReporter);

      jasmineEnv.specFilter = function(spec) {
        return htmlReporter.specFilter(spec);
      };

      var currentWindowOnload = window.onload;

      window.onload = function() {
        if (currentWindowOnload) {
          currentWindowOnload();
        }
        execJasmine();
      };

      function execJasmine() {
        jasmineEnv.execute();
      }

    })();
  </script>

</head>

<body>
</body>
</html>


茉莉花跑步者
（功能（）{
var jasmineEnv=jasmine.getEnv（）；
jasmineEnv.updateInterval=1000；
var htmlReporter=new jasmine.htmlReporter（）；
jasmineEnv.addReporter（htmlReporter）；
jasmineEnv.specFilter=函数（spec）{
返回htmlReporter.specFilter（spec）；
};
var currentWindowOnload=window.onload；
window.onload=函数（）{
如果（currentWindowOnload）{
currentWindowOnload（）；
}
茉莉花（）；
};
函数execJasmine（）{
jasminev.execute（）；
}
})();

我做错了什么？我无法理解这个东西应该如何工作：）

测试代码的主要问题是它试图使用新操作符“手动”创建控制器实例。这样做时，AngularJS没有机会注入依赖项。您应该做的是允许AngularJS注入依赖项：

var $scope, ctrl;

//you need to inject dependencies first
beforeEach(inject(function($rootScope) {
    $scope = $rootScope.$new();        
}));

it('Should initialize value to Loading', inject(function($controller) {
    ctrl = $controller('MainNavController', {
        $scope: $scope
    });
    expect($scope.wksp_name).toBe('Loading...');
}));

以下是完整JSFIDLE的链接：

在上述示例中，有两件事值得注意：

您可以使用ngMock模块中的inject（）方法来注入依赖项：

要创建控制器实例（支持依赖项注入），请使用$controller服务：

最后一句话：我建议以大写字母开始命名控制器-这样我们就不会把它们与变量名混淆。

我同意pkozowski的回答，但为了更直接地回答您的问题，您需要去掉“$on”

如果您的$scope看起来像：

$scope = {
  $on: function() {}
}

@pkozlowski.opensource给出了很好的答案。再详细说明一下。。。有时，断言控制器确实调用了

$scope.

上的$on也很方便。在这种情况下，您可以监视

$scope.$on

，如下所述：

beforeEach(inject(function($rootScope) {
    $scope = $rootScope.$new();        
    spyOn($scope, '$on').andCallThrough();
}));

然后您可以断言，上的

$on是用您的事件名和一些函数作为参数调用的：
it('Should bind to "broadCastWkspNameEvent"', inject(function($controller) {
    ctrl = $controller('MainNavController', {
        $scope: $scope
    });
    expect($scope.$on).toHaveBeenCalledWith('broadCastWkspNameEvent', jasmine.any(Function));
}));

这个答案对6适用吗？