Question

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

但我甚至无法点击我的下拉元素。

选择下拉元素：

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-dropdown元素：

<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>

如何选择并点击此内容？

Answer 1

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

elem = element(by.css('a.ui-s')＆lt; - 在此处输入className的其余部分

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

Answer 2

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

Answer 3

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

就您而言： browser.executeScript('document.querySelector(\'p-dropdown[formcontrolname="currId"]\').click()');

量角器单击包装p-dropdown - 选择值 - 元素在点（x，y）处不可点击其他元素将收到点击

3 个答案: