量角器-使用CSS选择器查找元素

Question

我正在一个有角度的页面上运行量角器e2e测试，我不想检查某些下拉框来选择它们的选项。 我从angular生成了以下html代码：

<select class="ng-pristine ng-valid ng-touched" id="idxyz" ng-model="model" ng-options="xxx">
    <option selected="selected" value="object:null"></option>
    <option label="Steuerung 1" value="number:1">Steuerung 1</option>
    <option selected="selected" label="Programme" value="number:2">Programme</option>
    <option label="Steuerung 2" value="number:3">Steuerung 2</option>
</select>

这是我用来获取所选选项的量角器代码。

expect(element(by.css("select[ng-model='model'] option[selected='selected']")).getAttribute("value")).toBe("Programme");

您可能已经注意到-有两个选项为selected='selected' 。

仅在使用量角器运行测试时才是这种情况。 手动执行相同操作时，只有真正选择的选项才具有selected='selected'属性。

谁能解释为什么会这样？ css选择器应仅返回一个选项元素，因为只能选择一个。 但是由于有两个具有选定属性的属性-量角器会给我以下警告：

警告-为定位器By.cssSelector（“ select [ng-model ='model'] option [selected ='selected']”）找到多个元素-将使用第一个结果

第一个结果是实际上没有选择的空选项。

安装程序以运行测试：

• 角度的：1.4.4
• 咕unt声：0.4.5
• 量角器：2.5.1
• grunt-量角器运行器：2.1.0

Answer 1

要解决该问题，您还需要检查以number开头的value ：

select[ng-model=model] option[selected=selected][value^=number]

或者，我们可以检查value不等于object:null ：

select[ng-model=model] option:not([value="object:null"])[selected=selected]

请注意，为了简化选择选项的处理，请考虑使用自定义包装，请参见：

• 选择->选项抽象