量角器点击包装 p-dropdown - 选择值 - 元素在点 (x, y) 处不可点击其他元素将收到点击答案

【问题标题】：Protractor click wrapped p-dropdown - Select value - Element is not clickable at point (x, y) Other element would receive the click量角器点击包装 p-dropdown - 选择值 - 元素在点 (x, y) 处不可点击其他元素将收到点击
【发布时间】：2018-11-07 00:43:41
【问题描述】：

我正在尝试选择我的 p 日历元素。这是一个下拉菜单，然后我想点击打开它。打开后，我想从列表中选择（单击）一个值。

但我什至无法单击我的下拉元素。

选择下拉元素：

input = element(by.css('p-dropdown[formcontrolname="currId"]'));

这行得通。但是现在尝试单击它时：
我收到以下错误：

</p-dropdown> is not clickable at point (841, 415). Other element would receive the click: <a cla

我读到我必须选择标签：

input.$('label').click();

但这也行不通。

</label> is not clickable at point (841, 416). Other element would receive the click: <a class="ui-s

我的 P 下拉元素：

<p-dropdown formcontrolname="currId" id="currId" inputid="currId" placeholder="NONE" 
  styleclass="form-control form-control-sm" 
  class="ng-tns-c6-1 ng-untouched ng-pristine ng-invalid" ng-reflect-filter="true" 
  ng-reflect-style-class="form-control form-control-sm" ng-reflect-placeholder="NONE" 
  ng-reflect-input-id="currId" ng-reflect-options="[object Object],[object Object" 
  ng-reflect-name="currId">
  <div class="ng-tns-c6-1 form-control form-control-sm ui-dropdown ui-widget ui-state-default ui-corner-all ui-helper-clearfix" 
       ng-reflect-klass="form-control form-control-sm" 
       ng-reflect-ng-class="[object Object]" style="width: 96px;">
    <select>
      <option class="ng-tns-c6-1 ng-star-inserted" value="AED">AED</option>
      <option class="ng-tns-c6-1 ng-star-inserted" value="AUD">AUD</option>
      <option class="ng-tns-c6-1 ng-star-inserted" value="BGN">BGN</option>
      <option class="ng-tns-c6-1 ng-star-inserted" value="BRL">BRL</option>
      <option class="ng-tns-c6-1 ng-star-inserted" value="CAD">CAD</option>
      <option class="ng-tns-c6-1 ng-star-inserted" value="CHF">CHF</option>
      <option class="ng-tns-c6-1 ng-star-inserted" value="CLP">CLP</option>
      <option class="ng-tns-c6-1 ng-star-inserted" value="CNY">CNY</option>
      <option class="ng-tns-c6-1 ng-star-inserted" value="COP">COP</option>
    </select>
  </div>
  <div class="ui-helper-hidden-accessible">
    <input class="ng-tns-c6-1" readonly="" role="listbox" type="text" id="currId" aria-label=" ">
  </div>
  <label class="ng-tns-c6-1 ui-dropdown-label ui-inputtext ui-corner-all ui-placeholder ng-star-inserted" ng-reflect-ng-class="[object Object]">NONE</label>
  <div class="ui-dropdown-trigger ui-state-default ui-corner-right">
    <span class="ui-clickable fa fa-fw fa-caret-down" ng-reflect-klass="ui-clickable" ng-reflect-ng-class="fa fa-fw fa-caret-down"></span>
  </div>
  <div class="ng-tns-c6-1 ui-dropdown-panel ui-widget-content ui-corner-all ui-shadow ng-trigger ng-trigger-panelState" ng-reflect-ng-class="ui-dropdown-panel ui-widget-co" style="display: none; opacity: 0;">
    <div class="ui-dropdown-filter-container ng-tns-c6-1 ng-star-inserted" style="">
      <input class="ui-dropdown-filter ui-inputtext ui-widget ui-state-default ui-corner-all" autocomplete="off" type="text">
      <span class="fa fa-search"></span>
    </div>
    <div class="ui-dropdown-items-wrapper" style="max-height: 200px;">
    </div>
  </div>
  </div>
</p-dropdown>

如何选择并点击它？

【问题讨论】：

标签： javascript selenium protractor

【解决方案1】：

看起来a 元素干扰了点击 - 这可能有多种原因。作为最后的手段，您总是可以尝试执行一些 javascript 来将其可见性设置为隐藏：

elem = element(by.css('a.ui-s')

browser.executeScript("arguments[0].style.visibility='hidden'", elem)

【讨论】：

【解决方案2】：

所以问题实际上是之前已经打开但未关闭的其他一些下拉窗口。这覆盖了整个页面和我想要单击的元素。我之前只需要关闭所有其他打开的窗口

【讨论】：

【解决方案3】：

所以问题是input = element(by.css('p-dropdown[formcontrolname="currId"]')); 不可点击，因为a class="ui-s 过度覆盖了您的元素。解决此问题的最佳方法是使用browser.executeScript('');

在你的情况下： browser.executeScript('document.querySelector(\'p-dropdown[formcontrolname="currId"]\').click()');

【讨论】：