单元测试 – 如何使用Mocha测试AngularJS代码?

前端之家收集整理的这篇文章主要介绍了单元测试 – 如何使用Mocha测试AngularJS代码?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
基本上,我有相当丰富的Mocha(写成千上万的单元测试),我是新的AngularJS(只写我的第一个项目)。

现在我想知道我如何单元测试所有AngularJS的东西使用摩卡。

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

我想我需要:

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

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

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

如何在测试中引用和实例化该控制器?
这同样适用于服务,指令…

我需要为$ scope创建mock,$ http&公司为自己,还是有一些帮助?

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

一种方法是在测试中使用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>

猜你在找的Angularjs相关文章