在AngularJs应用程序上使用Mocha设置单元测试

时间:2014-01-27 06:19:12

标签: angularjs unit-testing mocha karma-runner

我正在尝试使用mocha在我的webapp上设置单元测试。我的webapp使用AngularJs,因为我还是这个框架的新手,所以我很难设置它。

事实上,有没有办法通过使用除了摩卡之外的其他东西来设置它?我的意思是,是否可以在没有Karma或任何其他测试运行器(并且没有浏览器)的情况下设置我的单元测试?

这是我要测试的代码:

define(['angular'], function (angular) {
var module = angular.module('MyModule', []);

module.controller('MyController', ['$scope', '$window', function ($scope, $window) {
        $scope.test = function () {
            $window.alert('Not implemented yet.');
        };
    }]);

    return module;
});

这是我的测试代码:

require("chai");
require('../lib/angular/angular-mocks');

describe("Unit testing example", function() {

    beforeEach(angular.mock.module('MyModule'));

    it('should test nothing', function() {
        expect(true).to.be.true;
    })

});

当我尝试执行此操作时,收到此错误:

angular.mock = {};
^
ReferenceError: angular is not defined

感谢您的帮助!

2 个答案:

答案 0 :(得分:4)

是的,您需要为Angular代码提供某种浏览器环境的东西。有多种选择:

  • jsdom

  • PhantomJS等无头解决方案。

  • 实际浏览器。

这些解决方案中的每一个都提供了一个逐渐接近“真实”的浏览器环境。

您所需要的完全取决于:

  • 最小的AngularJS要求。我不使用AngularJS所以我不知道这个最小值是什么。

  • 您的自己的代码需要的最小值

例如,我使用jsdom进行单元测试,以便在DOM树中上下导航。 Jsdom非常适合这一点。但是,当我尝试使用jsdom来测试使用MutationObserver的代码时,这不起作用,因为jsdom不提供此API。我不得不使用真正的浏览器来执行这些测试。

请注意:如果您完全关心跨浏览器兼容性没有将测试代码替换为实际的浏览器。就在昨天,我诊断出在Safari中只发生 的问题。使用Safari之外的其他任何东西都无法捕获此问题来测试有问题的代码。

答案 1 :(得分:0)

对于那些使用jsdom进行测试的人

添加以下内容可为我解决一天的问题

require('mutationobserver-shim')
global.MutationObserver = global.window.MutationObserver

当然,您需要npm yarn安装mutationobserver-shim

希望这会有所帮助