使用 AngularJS HotTowel 中的 vm“ControllerAs”语法时从单元测试文件访问 $scope答案

【问题标题】：accessing $scope from unit test file when using the vm "ControllerAs" syntax from AngularJS HotTowel使用 AngularJS HotTowel 中的 vm“ControllerAs”语法时从单元测试文件访问 $scope
【发布时间】：2014-10-01 04:44:36
【问题描述】：

请参见此处，例如：http://www.johnpapa.net/angularjss-controller-as-and-the-vm-variable/

正如标题所暗示的，我正在按照本教程 [http://tech.pro/tutorial/1473/getting-started-with-angularjs-unit-testing] 设置单元测试，一切都很好，除了 我似乎无法访问 vm 变量作为我的$scope.

dashboard.js

var controllerId = 'dashboard';
angular.module('app')
    .controller(controllerId, ['common', 'datacontext', dashboard]);


function dashboard(common, datacontext) {
    var getLogFn = common.logger.getLogFn;
    var log = getLogFn(controllerId);

    var vm = this;      
    vm.title = 'Dashboard';

dashboard.Spec.js

describe("app module", function() {
    beforeEach(module("app"));

    describe("dashboard", function() {
        var scope,
            controller;

        beforeEach(inject(function($rootScope, $controller) {
            scope = $rootScope.$new();
            controller = $controller;
        }));

        it("should assign Dashboard as title", function() {
            controller("dashboard", {
                $scope: scope
            });
            expect(scope.title).toBe("Dashboard");
        });
    });
});

我已经尝试过：当我直接在控制器依赖项中命名“$scope”并将“title”属性设置为它时，它可以工作（测试通过）。但是，我想保持模式不变。

我也试过直接在依赖项中传入 $scope 并将控制器参数命名为“vm”...

Karmas 测试失败消息是：Expected undefined to be 'Dashboard'

感谢任何帮助！

【问题讨论】：

标签： angularjs angularjs-scope jasmine karma-runner hottowel

【解决方案1】：

啊，现在很明显...我可以通过引用在测试中创建的控制器来访问 vm 变量：

 it("should assign Dashboard as title", function () {
       var vm = controller("dashboard", { $scope: scope });
       expect(vm.title).toBe("Dashboard");
    });

【讨论】：

当控制器不需要时，为什么必须将$scope 注入控制器进行测试？我认为使用 ControllerAs 的整个想法是停止使用范围？
@Junaid 你是对的，但我认为对于单元测试你必须更明确，因为你没有范围继承或 $window。（当您使用 console.log(this) 时似乎使用了哪个 controllerAs 语法）
我只是设法在没有$scope 变量的情况下做到了这一点。也就是说，在beforeEach，我做了controller = $controller，而在实际测试中我做了var vm = controller("dashboard")——没有$rootScope或$scope任何地方
@Tom 我做了和你描述的完全一样的方法。但是，我总是收到表明需要 $scope 的错误。所以，我必须这样做var vm = controller('dashboard', { $scope: {}});

【解决方案2】：

你也可以这样做：

it("should assign Dashboard as title", function () {
    var controller = controller("dashboard as vm", { $scope: scope });

    expect(scope.vm.title).toBe("Dashboard");
});

【讨论】：