Question

基本上，我对Mocha很有经验（编写成千上万的单元测试），而且我对AngularJS很新（只写了我的第一个项目）。

现在我想知道如何使用Mocha对所有AngularJS内容进行单元测试。

我知道Mocha在浏览器中运行，我已经这样做了。但是我如何构建和设置东西？

我想我需要：

加载AngularJS
加载摩卡
加载我的测试

在每个测试中，我需要加载一个控制器，一个服务，......进行测试。我怎么做？我没有使用require.js或类似的东西，文件只是脚本文件，基本上有以下内容：

angular.controller('fooController', [ '$scope', function ($scope) {
  // ...
}]);

如何在测试中引用和实例化该控制器？服务，指令......也是如此......

我是否需要为$scope，$http＆amp;合。对我自己，还是有一些帮助？

请注意，我知道有Karma测试跑步者（以前称为Testacular），但我不想完全切换我的测试跑步者。

Answer 1

这样做的一种方法是在测试中使用Angular $injector：

<强> myModule_test.js

suite('myModule', function(){
  setup(function(){
    var app = angular.module('myModule', []);
    var injector = angular.injector(['myModule', 'ng']);
    var service = injector.get('myService');
  });

  suite('myService', function(){
    test('should return correct value', function(){
       // perform test with an instance of service here
    });
  });
});

您的html应该与此类似：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>myModule tests</title>
  <link rel="stylesheet" media="all" href="vendor/mocha.css">
</head>
<body>
  <div id="mocha"><p><a href=".">Index</a></p></div>
  <div id="messages"></div>
  <div id="fixtures"></div>
  <script src="vendor/mocha.js"></script>
  <script src="vendor/chai.js"></script>
  <script src="angular.min.js"></script>
  <script src="myModule.js"></script>
  <script>mocha.setup('tdd')</script>
  <script src="myModule_test.js"></script>
  <script>mocha.run();</script>
</body>
</html>

Answer 2

如果您正在创建一个没有任何依赖关系并且不一定是角度特定的角度服务，您可以以角度无关的方式编写模块，然后为其编写单独的小角度包装，或者测试角度的存在，并有条件地为它创建服务。

以下是我用于创建可在角度，浏览器和节点模块中使用的模块的方法示例，包括mocha测试：

(function(global) {
    //define your reusable component
    var Cheeseburger = {};

    if (typeof angular != 'undefined') {
        angular.module('Cheeseburger', [])
            .value('Cheeseburger', Cheeseburger);
    }
    //node module
    else if (typeof module != 'undefined' && module.exports) {
        module.exports = Cheeseburger
    }
    //perhaps you'd like to use this with a namespace in the browser
    else if (global.YourAppNamespace) {
        global.YourAppNamespace.Cheeseburger = Cheeseburger
    }
    //or maybe you just want it to be global
    else {
        global.Cheeseburger = Cheeseburger
    }
})(this);

如何使用Mocha测试AngularJS代码？

2 个答案: