测试AngularJS范围变量

我想实现一个依赖于范围变量的测试。我想启用ng-switch-when来解析表达式。这就是我想要（UPDATE使用$ rootScope）做：测试AngularJS范围变量

it('should switch on array changes', inject(function($rootScope, $compile) { 
    element = $compile(
    '<div ng-switch="select">' + 
     '<div ng-switch-when="test[0]">test[0]:{{test[0]}}</div>' + 
    '</div>')($rootScope); 
    expect(element.html()).toEqual('<!-- ngSwitchWhen: test[0] -->'); 
    $rootScope.test = ["leog"]; 
    $rootScope.select = "leog"; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('test[0]:leog'); 
}));

我的问题是我对这个工作的实施并没有得到范围变量“测试”，以评估并按我的预期工作。这里是执行：

var ngSwitchWhenDirective = ngDirective({ 
    transclude: 'element', 
    priority: 800, 
    require: '^ngSwitch', 
    compile: function(element, attrs) { 
    return function(scope, element, attr, ctrl, $transclude) { 
     var expr = scope.$eval(attrs.ngSwitchWhen), 
      ngSwitchWhen = expr !== undefined ? expr : attrs.ngSwitchWhen; 
     ctrl.cases['!' + ngSwitchWhen] = (ctrl.cases['!' + ngSwitchWhen] || []); 
     ctrl.cases['!' + ngSwitchWhen].push({ transclude: $transclude, element: element }); 
    }; 
    } 
});

有没有人知道我在做什么错？任何帮助将不胜感激。

提前致谢！

UPDATE

我想弄清楚，这是一个如何NG-开关它正在从角团队测试的例子。只是为了表明我以类似的方式进行测试，但没有达到预期的结果。

此外，我忘记将我的代码转换为$ rootScope，直到现在您所看到的是我尝试创建新范围以避免依赖$ rootScope进行更改的尝试之一。

it('should switch on value change', inject(function($rootScope, $compile) { 
    element = $compile(
     '<div ng-switch="select">' + 
     '<div ng-switch-when="1">first:{{name}}</div>' + 
     '<div ng-switch-when="2">second:{{name}}</div>' + 
     '<div ng-switch-when="true">true:{{name}}</div>' + 
     '</div>')($rootScope); 
    expect(element.html()).toEqual(
     '<!-- ngSwitchWhen: 1 --><!-- ngSwitchWhen: 2 --><!-- ngSwitchWhen: true -->'); 
    $rootScope.select = 1; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('first:'); 
    $rootScope.name="shyam"; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('first:shyam'); 
    $rootScope.select = 2; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('second:shyam'); 
    $rootScope.name = 'misko'; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('second:misko'); 
    $rootScope.select = true; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('true:misko'); 
}));

来源

2013-12-09 LeoG

它在测试之外工作吗？测试运行时element.text（）会返回什么？ – UnicodeSnowman

是的，它可以在真实的用例上工作。当测试运行** element.text（）时**为''（空字符串）。调试它我发现编译内部函数的范围变量没有“test”属性，就像我对真实用例所做的那样。也许这与范围可视性有关。 – LeoG

这可能会揭示我的无知，但你能确认你的测试目标吗？看起来你已经发布了ngSwitch的AngularJS源码：当你试图测试它吗？ –

因此，在移动一些代码后，我发现在编译要测试的元素之前，应该定义变量没有涉及到使$ rootScope变化来测试该功能，谢谢@Jonathan的提示

这是工作代码测试用例：

it('should evaluate expressions to match switch value', inject(function($rootScope, $compile) { 
    $rootScope.array = ["leog", ".me"]; 
    $rootScope.obj = {"key": "value"}; 
    $rootScope.$apply(); 
    element = $compile(
    '<div ng-switch="select">' + 
     '<div ng-switch-when="obj.key">obj.key:{{obj.key}}</div>' + 
     '<div ng-switch-when="array[0]">array[0]:{{array[0]}}</div>' + 
     '<div ng-switch-when="array[1]">array[1]:{{array[1]}}</div>' + 
    '</div>')($rootScope); 
    expect(element.html()).toEqual('<!-- ngSwitchWhen: obj.key -->' + 
           '<!-- ngSwitchWhen: array[0] -->' + 
           '<!-- ngSwitchWhen: array[1] -->'); 
    $rootScope.select = "value1"; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('obj.key:value'); 
    $rootScope.select = "leog"; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('array[0]:leog'); 
    $rootScope.select = ".me"; 
    $rootScope.$apply(); 
    expect(element.text()).toEqual('array[1]:.me'); 
}));

感谢大家

来源

2013-12-22 18:36:25 LeoG

$ scope。$ apply需要在要执行的括号内部有一个函数，这是缺少测试代码的地方。为了在测试中让事情发生，我使用$ scope。$ digest（）（而不是$ scope。$ apply（）;这会启动一个手动摘要循环，否则测试不会运行

来源

2013-12-18 15:44:03 MBielski

已经测试过您的两种可能的解决方案，而且什么都没有。无论如何感谢@MBielski – LeoG

测试AngularJS范围变量

回答

相关问题