如果微调器被包装器隐藏，如何使用量角器处理微调器答案

【问题标题】：How to handle spinners using protractor if spinner hidden by wrapper如果微调器被包装器隐藏，如何使用量角器处理微调器
【发布时间】：2016-03-29 10:27:48
【问题描述】：

在使用 Protractor 为 Angular 应用程序编写测试期间，我遇到了很多与处理微调器相关的问题，其中一些我解决了，但我不知道如何测试被包装器隐藏的微调器，例如如果父标签有ng-if 或 ng-hide 语句，并且 spinner 的高度和宽度大于 0。我试过用：

spinner.isDisplayed();
browser.wait(EC.visibilityOf(spinner), 5000);

HTML 示例（父标签可能不同）：

 <div class="some purent div">
 <div class="spinner-loader small-loader ng-hide" ng-show="expression">  </div>
</div>

:::

<div class="container">
      <div class="spinner-loader spinner-dark" ng-if="if_statement"></div>
</div>

:::

<div ng-show='exp'>
...
 <div>
...
  <div class='spinner'></div>
 </div>
</div>

但它没有奏效。请帮忙...！

【问题讨论】：

你能提供旋转器可见和隐藏时的 HTML 吗？
添加了几个例子，请注意，spinner 的父标签可能不同，有时 ng-if 和 ng-hide 可能位于更高的几个标签上

标签： javascript angularjs selenium protractor e2e-testing

【解决方案1】：

试试下面的代码。

element.all(by.model('model of your spinner')).each(function (eachElement, index)
{
     eachElement.click();
     browser.driver.sleep(500);
     element(by.css('Unique identifier of the Spinner value you are selecting')).click();
     browser.driver.sleep(500);
});

希望这会有所帮助。 :)

【讨论】：

等待特定的时间是一种不好的做法，因为网页的响应时间是可变的。如果显示元素花费的时间比定义的时间稍长怎么办？

【解决方案2】：

根据您提供的 html 片段，您可以获得可见的微调器：

By.cssLocator(".spinner-loader:not(.ng-hide):not([ng-if]) .spinner")

并获得隐藏的微调器：

By.cssLocator(".spinner-loader.ng-hide .spinner, .spinner-loader[ng-if] .spinner")

【讨论】：

这样的情况呢：
...
...
，和父元素动态可以接收像“display:none”这样的样式，你能不能给点建议？
试图逐个获得答案并不理想。我会首先列出所有案例，然后定义规则，最后构建选择器并在需要时寻求帮助。