当前位置: 首页 > 面试题库 >

AngularJS ui路由器:测试ui-sref

夏景胜
2023-03-14
问题内容

我正在尝试测试一些视图,这些视图<a ui- sref='someState'>link</a>用于链接到应用程序中的其他状态。在我的测试中,我触发了对此元素的点击,如下所示:

element.find('a').click()

如果状态切换为,该如何测试someState$state在我的控制器中像这样使用时,这很容易:

// in my view
<a ng-click="goTo('someState')">link</a>

// in my controller
$scope.goTo = function(s) {
  $state.go(s)
};

// in my tests
spyOn($state, 'go');
element.find('a').click()
expect($state.go).toHaveBeenCalled()

但是当我使用时,我ui-sref不知道要监视什么对象。如何验证我的应用程序处于正确状态?


问题答案:

我自己找到的。在查看了角度ui路由器源代码后,我在ui-sref指令中找到了以下行:

// angular-ui-router.js#2939
element.bind("click", function(e) {
  var button = e.which || e.button;
  if ( !(button > 1 || e.ctrlKey || e.metaKey || e.shiftKey || element.attr('target')) ) {
    // HACK: This is to allow ng-clicks to be processed before the transition is initiated:
    $timeout(function() {
      $state.go(ref.state, params, options);
    });
    e.preventDefault();
  }
});

当元素收到点击时,$state.go会包装在$timout回调中。因此,在测试中,您必须注入$timeout模块。然后$timeout.flush()像这样做:

element.find('a').click();
$timeout.flush();
expect($state.is('someState')).toBe(true);


 类似资料:
  • 问题内容: 我有一个控制器,它从中获取值并将其发送到其他状态: 我不确定如何对该测试方法进行单元测试。我该如何验证go方法已被调用或对Karma / AngularJS进行某种处理? 问题答案: 这两种声音听起来都可以用Jasmine间谍来完成。 这里有一个很好的间谍的cheatsheet http://tobyho.com/2011/12/15/jasmine-spy- cheatsheet/

  • 问题内容: 这是一个具有提交功能的控制器: 这是我的考验 我得到的错误是: views / appBar.html是我的templateUrl: 因此,以某种方式ui-router使我的$ httpBackend指向此位置而不是我的提交功能。使用$ httpBackend进行的所有测试都存在相同的问题。 有什么解决办法吗? 问题答案: 采取这个要点 https://gist.github.com/

  • 英文原文:http://emberjs.com/guides/testing/testing-routes/ 单元测试方案和计算属性与之前单元测试基础中说明的相同,因为Ember.Route集成自Ember.Object。 路由测试可以通过集成测试或者单元测试来进行。集成测试对路由的测试具有更好地覆盖性,因为路由通常用来执行过渡和数据加载,这些测试在完整上下文中更加容易测试,而独立上下文则没有那么

  • 问题内容: 我在应用程序中测试路由器时遇到了一些麻烦,该应用程序是基于Angular ui路由器构建的。我要测试的是状态转换是否适当地更改了URL(稍后将进行更复杂的测试,但这是我开始的地方。) 这是我的应用程序代码的相关部分: 和测试代码: 关于Stackoverflow的类似问题(以及官方ui路由器测试代码)表明,将$ state.go调用包装在$ apply中应该足够了。但是我已经做到了,状

  • 问题内容: 角度ui路由器的示例演示在起始页面具有以下链接: “ ui-router”的完整网址为或 “关于”的完整网址为或 当我使用durandalJS时,存在一个限制,即默认URL只是“ /”,不能有“ / ui-router”。 Angular ui路由器插件有相同的限制吗? 问题答案: 请参阅此处,默认路由有一个“其他”选项。

  • 问题内容: 我有一个 父母 州和许多孩子州。如果我希望在与孩子中的一个孩子在一起时在父母上工作,则需要执行此“ hack”操作: 这是非常丑陋的方式,我有很多孩子,所以这似乎不是很好的解决方案。有人对此问题有其他解决方案吗? 问题答案: 您只能检查而不是检查状态