Angular JS - 使用 Karma / Jasmine 测试具有页面重定向的功能答案

【问题标题】：Angular JS - Testing a Function With a Page Redirect Using Karma / JasmineAngular JS - 使用 Karma / Jasmine 测试具有页面重定向的功能
【发布时间】：2014-03-13 20:35:34
【问题描述】：

我的 Angular 控制器中有一个函数，如下所示：

$scope.myFunction = function(){
    $scope.myVariable = "something";
    $scope.myOtherVariable = "something else";
    window.location.href = "/path/to/page"; 
}

一个简单的 Jasmine 测试涵盖了上述功能，如下所示：

describe('my test', function(){
    it('should pass', function(){
        scope.myFunction();
        expect(scope.myVariable).toBe('something');
        expect(scope.myOtherVariable).toBe('something else');     
    });
});

上述测试本身通过，但随后 Karma 在控制台中抛出以下错误：

您的一些测试重新加载了整个页面！

页面重定向导致 Karma 发出此警告。解决此问题的最佳方法是什么？

我考虑过在 Jasmine 测试中同时给出匿名函数和 Angular 名称，然后在原始函数中使用 arguements.callee.caller.name 来确定该函数是被自己调用还是被 Jasmine 调用.不幸的是，arguments.callee.caller.name 总是返回 undefined，我怀疑这是由 Angular 和 Jasmine 相互链接的方式引起的。

【问题讨论】：

这个问题实际上并没有出现在我的代码中，但它确实给了我一个火花，点燃了我自己的修复，所以感谢发布它！如果您好奇，由于您的问题，我为自己解决的问题是stackoverflow.com/questions/31947852/…。谢谢，C§

标签： angularjs jasmine karma-runner karma-jasmine

【解决方案1】：

很久没问这个问题了，但是下面的方法应该更干净：

通过将原始函数更改为使用 Angular 的 $window 服务而不是浏览器窗口对象，可以编写不需要修改生产代码或考虑任何运行时参数的测试。这当然要求 $window 是找到该函数的控制器的依赖项。

使用angular-mocks/ngMock，类似：

var fakeWindow = {
  location: {
    href: ''
  }
}
// instantiate controller with mock window
beforeEach(inject(function($controller) {
  $controller('YourCtrlName', {
    $window: fakeWindow
  });
}));

应该允许测试通过，假设控制器不需要 $window 来做其他事情。

【讨论】：

我认为最完美的答案
在大多数浏览器中，window.location 是不可写属性，因此提供您自己的假对象是模拟这些不可写属性的最佳方式。
这应该是公认的答案。您不必更改目标代码即可以当前接受的答案的方式运行测试。

【解决方案2】：

您可以创建一个执行导航的函数，例如

$scope.Navigate = function() {
    window.location.href = "/path/to/page";
};

在某些服务中甚至更好

app.factory('navigator', function() {
    return {
        Navigate: function(path) {
            window.location.href = path;
        }
    };
});

然后在您的测试中，您可以在 Navigate 上使用间谍，以确保调用了导航，但实际上并没有调用导航。

【讨论】：