循环将选择下拉列表中的所有元素答案

【问题标题】：Loop that will select all elements in a dropdownlist循环将选择下拉列表中的所有元素
【发布时间】：2016-08-01 20:09:01
【问题描述】：

我进入并为每个下拉菜单创建了 id 标签。我尝试创建一个循环来选择下拉列表中的每个制造商，而无需编写 300 多行代码，因为某些下拉列表中有很多选项。我试过了，想不出办法。例如，第二个下拉列表是“source_manufacturer”。

这是我尝试过的：

var expected = ['COMFORT-AIRE', 'Daewoo', 'GE'];
var els = element.all(by.id('source_manufacturer'));
for (var i = 0; i < expected.length; ++i) {
expect(els.get(i).getText()).toEqual(expected[i]);
}

这里是html代码：

<select id="source_manufacturer" ng-class="{'btn btn-default' :   !$root.isMobile.iOS()}" class="form-control ng-valid btn btn-default ng-not-empty ng-touched ng-dirty ng-valid-parse" ng-model="manufacturer" ng-options="m.name for m in manufacturers">

`<option selected="selected" value="object:439" label="COMFORT-AIRE">COMFORT-AIRE</option>  
....
<option value="object:443" label="Whirlpool">Whirlpool</option></select>`

这是错误消息：失败：索引超出范围。尝试访问索引处的元素：1，但只有 1 个元素与定位器 By(css selector, *[id="source_manufacturer"]) 匹配。我想测试是否可以选择每一个并且它实际上会发生变化。

预期显示列表中的每个元素，而不是单个元素。

这就是我点击列表中每个单独元素的方式：

    element(by.id('source_manufacturer')).click().
    element(by.cssContainingText('option', 'GE')).click();

【问题讨论】：

如果您将代码放入 JSfiddle，您会得到更好的响应。但是实际上没有看到任何实际操作，看起来您是通过 id 获取的，根据定义，它必须是唯一的，因此只会产生一个元素。您需要遍历子节点。
jsfiddle.net/5owyt0tt by id 选择唯一的下拉列表。必须有一种方法可以选择下拉列表中的每个选项。
我不确定您所说的“选择每个选项”是什么意思，但如果您的意思是要选择所有选项，您必须首先通过将“multiple”属性添加到选择标签。其次，这段代码会选择所有这些（我假设你使用的是 jQuery，因为这个问题有 jQuery 标签） $('#source_manufacturer option').each(function () { $(this).attr('选择'，真）；}）；但是就是说，最好在创建表单时设置 selected 属性。也许我完全错过了你想要做的事情。
jsfiddle.net/5owyt0tt/1
这个问题不应该有jQuery标签。这是一个特定于 Protractor 的问题，具有特定于 Protractor 的解决方案。

标签： javascript html angularjs protractor

【解决方案1】：

首先，您应该确保您确实有多个select 元素和source_manufacturer id。然后，您应该使用 each() 而不是常规的 for 循环。而且，我会在here建议的选择选项结构上使用一个优雅的抽象：

var expected = ['COMFORT-AIRE', 'Daewoo', 'GE']
var selects = element.all(by.id('source_manufacturer'));
selects.each(function (select, index) {
    var selectWrapper = SelectWrapper(select);
    selectWrapper.selectByPartialText(expected[index]);

    expect(selectWrapper.getSelectedOptions().first().getText()).toEqual(expected[index]);
});

【讨论】：

我创建了 select-wrapper.js 结构并尝试实现您的建议。我收到以下错误：“失败：无法读取未定义的属性 'selectByPartialText'”
@jmd1002 请检查您是否已正确导入并实例化它。谢谢。