本文介绍了测试某些元素是否可见或不可见的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我如何找出一个元素是否可见或隐藏在testacular(茉莉)?

How do I find out if an element is visible or hidden in testacular (jasmine)?

我的DOM如下:

<div class="span5 value-entry">
    <input type="text" ng-model="query.value" placeholder="Enter value" class="input-large" ng-show="genericInput(criteria.attribute)">
    <select ng-model="query.value" ng-options="entry for entry in filteredValue(criteria.attribute)" class="input-medium" ng-show="!genericInput(criteria.attribute)">
        <option value="">-- Select Value --</option>.
    </select>
</div>

无论是选择显示或输入框,但不能同时使用。我想检查哪些元素是可见的(基于其他标准),但我似乎无法弄清楚如何获得code工作。我写了下面的code:

Either the select is shown or the input box, but not both. I wish to check which element is visible (based on some other criteria), but I can't seem to figure out how to get the code working. I have written the following code:

expect(element('.value-entry input').is(':visible')).toBe(true);

不过,我得到一个错误:

But I get an error:

TypeError: Object #<Object> has no method 'is'

我如何检查,如果输入的是可见的,并选择在同一时间(反之亦然)隐藏?

How do I check if the input is visible and the select is hidden at the same time (and vice versa)?

编辑:我想在这里补充,这是一个端到端的测试

EDIT : I wish to add here that this is an end to end test

推荐答案

此行​​为角1.2已经改变,因为 NG-动画

This behavior has changed in Angular 1.2 because of ng-animate.

ngShow 的code是:

var ngShowDirective = ['$animate', function($animate) {
  return function(scope, element, attr) {
    scope.$watch(attr.ngShow, function ngShowWatchAction(value){
      $animate[toBoolean(value) ? 'removeClass' : 'addClass'](element, 'ng-hide');
    });
  };
}];

这意味着它会添加/删除类 NG-隐藏隐藏/显示的元素。

因此​​,正确的方式来测试,如果是隐藏的元素是:

Thus, the right way to test if the element is hidden would be:

expect(element('.value-entry input').hasClass('ng-hide')).toBe(true);

这篇关于测试某些元素是否可见或不可见的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-23 12:33