【问题标题】:Unable to select option in drop down protractorjs e2e tests无法在下拉 protractorjs e2e 测试中选择选项
【发布时间】:2017-05-09 03:09:15
【问题描述】:

我正在尝试从下拉列表中选择一个选项,以使用量角器进行角度 e2e 测试。
这里是select选项的代码sn-p:

<div class="width70">
  <span title="" class="k-widget k-dropdown k-header width100 ng-scope ng-dirty ng-valid-parse ng-touched ng-invalid ng-invalid-required k-invalid" unselectable="on" role="listbox" aria-haspopup="true" aria-expanded="true" tabindex="0" aria-owns="" aria-disabled="false" aria-readonly="false" aria-busy="false" style="" aria-activedescendant="9e8e661a-e100-4c17-bceb-3de8ac876316">
    <span unselectable="on" class="k-dropdown-wrap k-state-default"><span unselectable="on" class="k-input ng-scope">Select Customer</span><span unselectable="on" class="k-select"><span unselectable="on" class="k-icon k-i-arrow-s">select</span></span></span>
    <select kendo-drop-down-list="" required="" name="customer" ng-model="arrayView.selectedCustomer" k-options="arrayView.customerList" k-rebind="arrayView.customerList" validationmessage="Select Customer" class="width100 ng-scope ng-dirty ng-valid-parse ng-touched ng-invalid ng-invalid-required k-invalid" data-role="dropdownlist" style="display: none;" aria-invalid="true">
        <option value="" selected="selected">Select Customer</option>
        <option value="615">option A</option>
        <option value="139">option B</option>
        <option value="1476">option C</option>
        <option value="570">option D</option>......`


下一页提到的方法我几乎都试过了
How to select option in drop down protractorjs e2e tests
他们似乎都不适合我。
我什至无法找到“选择”(“选项”的父级)标签。
但我可以成功点击 div.span.span 元素。

此外,当我单击下拉菜单时,我会看到一个搜索框以及所有选项。我附上相同的图片
请帮我。我尝试了几种方法,但似乎没有任何效果。

【问题讨论】:

  • 你用的是angularjs还是kendo.js。
  • 我正在使用 angularjs
  • 不太确定,Wappalyzer 将“Angular material”和“Kendo UI”都显示为网络框架。
  • @ramesh-rajendran 让我们在 kendo ui 中说一下,那么解决方案是什么?

标签: javascript angularjs selenium testing protractor


【解决方案1】:
var selectOptionFromDrpdwn = function (ngModelLocator, option) {     
  //arguments are strings
  element(by.model(ngModelLocator))
    .element(by.cssContainingText('option', option))
    .click();
}

说明:

上面有两个参数:定位器和要选择的选项的值。定位器可以是任何东西,但这里我使用的是 ng-model,如果您使用其他任何东西,则必须相应地更改定位器功能。

在定位的元素中,我找到了使用 [cssContainingText 定位器][1] 来单击的选项。唯一的缺点是选项值是完全类型的,它不能取部分值名称。否则,您可以使用选项编号逻辑并相应地传递一个数字以被点击:

element(by.model(ngModelLocator)).all(by.tagName('option').get(optionNumber).click();

【讨论】:

  • 虽然这段代码 sn-p 可以解决问题,但including an explanation 确实有助于提高帖子的质量。请记住,您是在为将来的读者回答问题,而这些人可能不知道您提出代码建议的原因。
猜你喜欢
  • 2013-11-05
  • 2018-07-22
  • 1970-01-01
  • 1970-01-01
  • 2017-09-15
  • 2018-12-28
  • 1970-01-01
  • 1970-01-01
  • 2020-01-10
相关资源
最近更新 更多