量角器 - Select 选中所有选项,脚本无法正确选择其中之一

Protractor - Select brings all options selected, script can't correctly pick one of them

以下元素是具有多个选项的 select:

<select _ngcontent-c20="" class="custom-select ng-valid ng-dirty ng-touched" id="unassignedCustomersSE" multiple="" size="5" xpath="1" style="">
  <!---->
  <option _ngcontent-c20="" value="0: Object" class="ng-star-inserted">PGSTEST1 - Regular Customer </option>
  <option _ngcontent-c20="" value="1: Object" class="ng-star-inserted">PGSTEST3 - Multi Client Customer </option>
  <option _ngcontent-c20="" value="2: Object" class="ng-star-inserted">PGSTEST2 - Pegasus MLP </option>
</select>

当我访问显示此元素的页面时,我看到:

所有选项都是默认的,select编辑。

如果我手动执行 selecting 操作(单击其中一个选项),其余部分将被删除 selected,我单击的那个会变成蓝色。

问题是当脚本尝试这样做时,我得到了不同的结果:

我只需要select这个来继续脚本,但它不起作用。

我已经尝试了一些方法,但始终无法正常工作,您能告诉我我做错了什么吗?

elements_access_restrictions.unassigned_customers_select.element(by.cssContainingText('option', data.clients.client_multi_PGSTEST3)).click();
//This click is the button I use to transfer from one select to another
elements_access_restrictions.move_to_assigned_button.click();

这两行的行为方式就像我(手动执行时)按 ctrl + 单击,但如您所见,我没有那样做。

有什么神奇的方法可以完成这项工作吗?我也已经尝试映射所有标签 'option' 并使用它,但结果完全相同。

感谢您的帮助!

EDIT/UPDATE 所以...通过 .click();它不起作用,但是! 有了这个:

     browser.actions()
    .mouseMove(elements_access_restrictions.unassigned_customers_select.element(by.cssContainingText('option', data.clients.client_multi_PGSTEST3)))
    .click()
    .perform();

工作正常,知道为什么吗?

因为没有更好的主意,所以我现在使用移动动作。正常工作

可能你已经继续前进了。如果对您或其他人有帮助...

选项 1:

  • 取消选择所有选项
  • Select 所需选项

var allOptions = element(by.css('select')).all(by.css('option')); allOptions.each((option) => { option.click()}); allOptions.get(1).click();

选项 2: - 取消选择不需要的

var allOptions = element(by.css('select')).all(by.css('option')); allOptions.each((option, index) => { if (index !== 1) { option.click()}});

API 参考:https://www.protractortest.org/#/api?view=ElementArrayFinder

免责声明:总的来说,我不是browser.actions()的粉丝,无论如何我都会避免使用它。有更好更可靠的 API 可用