Question

我使用Protractor在角度应用程序上运行E2E。我遇到了一个非常奇怪的问题。我正在使用Bootstrap Dropdown，它有一些选项。我需要点击其中一个选项。我提到了这个试图做类似事情的答案，但对我来说并不起作用： Protractor - how to select heavily nested dropdown element?

我的结构如下：

<div id="fc-more-btn" class="btn-group btn-group-sm dropdown" role="group" dropdown="" is-open="ctrl.fcDropdown">
    <button type="button" class="btn btn-default dropdown-toggle filetree-btn" tooltip="More Actions" tooltip-trigger="mouseenter" tooltip-placement="bottom" ng-disabled="ctrl.sd.noSelections" dropdown-toggle="" aria-haspopup="true" aria-expanded="false">
      <span class="fa fa-caret-down"></span>
    </button>
    <ul class="dropdown-menu filetree-dropdown" role="menu">
      <li>
        <a class="btn fc-dropdown-link" ng-disabled="ctrl.sd.noSelections||(ctrl.sd.multipleSelections||!ctrl.sd.dirSelected)" ng-click="ctrl.createNewFile()">
          New File
        </a>
      </li>
      <li>
        <a class="btn fc-dropdown-link" ng-disabled="ctrl.sd.noSelections||(ctrl.sd.multipleSelections||!ctrl.sd.dirSelected)" ng-click="ctrl.createNewDir()">
          New Folder
        </a>
      </li>
      <li>
        <a class="btn fc-dropdown-link" ng-disabled="ctrl.sd.noSelections" ng-click="ctrl.copyFiles()">
          Copy
        </a>
      </li>
      <li>
        <a class="btn fc-dropdown-link" ng-disabled="ctrl.clipboardEmpty||ctrl.sd.noSelections||(ctrl.sd.multipleSelections||!ctrl.sd.dirSelected)" ng-click="ctrl.pasteFiles()" disabled="disabled">
          Paste
        </a>
      </li>
      <li>
        <a class="btn fc-dropdown-link" ng-disabled="ctrl.sd.noSelections||ctrl.sd.multipleSelections" ng-click="ctrl.renameFile()">
          Rename
        </a>
      </li>
    </ul>
  </div>

在我的测试中，我试图点击重命名链接。

我写的代码是：

element(by.css('.dropdown-toggle')).click().then(function(){
  //click on rename
});

在运行测试时，下拉切换按钮上有一个小闪烁，似乎单击了该按钮。但是，未显示应显示的下拉列表。

因此，我无法模拟点击重命名。我做错了吗？

Answer 1

尝试通过cssContainingText进行选择，对下拉列表和嵌套元素非常有帮助！

element(by.cssContainingText('option', 'Rename')).click();

量角器点击下拉切换

1 个答案: