失败：元素不可见（量角器 AngularJS）答案

【问题标题】：Failed: element not visible (Protractor AngularJS)失败：元素不可见（量角器 AngularJS）
【发布时间】：2017-09-17 22:26:10
【问题描述】：

显然 Protractor 在我的应用程序的菜单中找不到这个元素，上面的元素没问题。我的代码是：

this.openMenu("toogleMenuButton")
let prodLink = element(by.id("menu12"));

if (prodLink.isPresent()) {
  prodLink.click();
  browser.sleep(500);
} else {
  return false;
}

HTML代码是：

<a _ngcontent-c13="" 
   appaccordiontoggle="" 
   class="relative mat-ripple" 
   md-ripple="" 
   routerlinkactive="open" 
   style="margin-left: 47px" 
   ng-reflect-class-base="relative" 
   ng-reflect-router-link-active="open" 
   id="menu12">
   <span _ngcontent-c13="">Produtos</span>
</a>

有人可以帮帮我吗？

【问题讨论】：

标签： html angularjs protractor

【解决方案1】：

您需要代码来等待元素可见（存在于 DOM 中并且也可见 - 高度和宽度大于 0）。我等待了 30 秒：

var EC = protractor.ExpectedConditions;
var prodlink = element(by.id('menu12'));
browser.wait(EC.visibilityOf(element(by.id('menu12'))), 30000, "prod link element is not visible").then(function() {
   prodlink.click();
}

【讨论】：

如果您能够解释它如何/为什么解决问题，这将是一个更好的答案。
browser.wait(条件, 超时, timeout_message);用于在超时时间内等待某事使条件为真，如果在超时前条件不为真，将抛出超时消息； EC.visibilityOf(element) 检测元素是否可见。
有向下滚动的可能吗？我怎么能做到？超时内条件不成立。

【解决方案2】：

分析：
您的代码有错误

if (prodLink.isPresent())

正如我们所知，所有 Protractor API 都是异步的并返回承诺。当 Javascript Enginee 执行这一行时，Javascript 得到一个 promise 对象而不是布尔值，实际上这个 IF 语句将始终为真，因为 promise 对象不为 null，并且量角器很可能没有检测到页面中存在的链接，因为所有与页面是异步的。

解决方案：
正确代码如下：

this.openMenu("toogleMenuButton")
let prodLink = element(by.id("menu12"));

prodLink.isPresent().then(function(present){
  if(present) {
     prodLink.click();
     return true;
  }
  return false;
});

我的代码只是为了指出你的错误，点击链接的正确编码方式应该是“Sanja Paskova”方式。

【讨论】：