使用选择列表元素
与其它元素相比,选择列表具有特殊的行为。
现在,Select 对象将为您提供一系列命令,允许您与 <select>
元素进行交互。
如果您使用的是 Java 或 .NET,请确保您已在代码中正确引入了支持包。请参阅下面任何示例中来自 GitHub 的完整代码。
请注意,此类仅适用于 HTML 元素 select
和 option
。可以使用 JavaScript 覆盖层使用 div
或 li
设计下拉菜单,此类不适用于这些下拉菜单。
类型
Select 方法的行为可能会有所不同,具体取决于所使用的 <select>
元素的类型。
单选
这是一个标准的下拉对象,只能选择一个选项。
<select name="selectomatic">
<option selected="selected" id="non_multi_option" value="one">One</option>
<option value="two">Two</option>
<option value="four">Four</option>
<option value="still learning how to count, apparently">Still learning how to count, apparently</option>
</select>
多选
此选择列表允许一次选择和取消选择多个选项。 这仅适用于带有 multiple
属性的 <select>
元素。
<select name="multi" id="multi" multiple="multiple">
<option selected="selected" value="eggs">Eggs</option>
<option value="ham">Ham</option>
<option selected="selected" value="sausages">Sausages</option>
<option value="onion gravy">Onion gravy</option>
</select>
创建类
首先找到一个 <select>
元素,然后使用它初始化一个 Select
对象。 请注意,从 Selenium 4.5 开始,如果 <select>
元素被禁用,则无法创建 Select
对象。
WebElement selectElement = driver.findElement(By.name("selectomatic"));
Select select = new Select(selectElement);
select_element = driver.find_element(By.NAME, 'selectomatic')
select = Select(select_element)
var selectElement = driver.FindElement(By.Name("selectomatic"));
var select = new SelectElement(selectElement);
select_element = driver.find_element(name: 'selectomatic')
select = Selenium::WebDriver::Support::Select.new(select_element)
it('Select an option', async function () {
val selectElement = driver.findElement(By.name("selectomatic"))
val select = Select(selectElement)
列表选项
可以获取两个列表
所有选项
获取 <select>
元素中所有选项的列表
List<WebElement> optionList = select.getOptions();
option_list = select.options
IList<IWebElement> optionList = select.Options;
option_list = select.options
val optionList = select.getOptions()
选定选项
获取 <select>
元素中选定选项的列表。 对于标准选择列表,这仅是一个包含一个元素的列表,对于多选列表,它可以包含零个或多个元素。
List<WebElement> selectedOptionList = select.getAllSelectedOptions();
selected_option_list = select.all_selected_options
IList<IWebElement> selectedOptionList = select.AllSelectedOptions;
selected_option_list = select.selected_options
val selectedOptionList = select.getAllSelectedOptions()
选择选项
Select 类提供了三种选择选项的方法。 请注意,对于多选类型的选择列表,您可以为要选择的每个元素重复这些方法。
文本
根据其可见文本选择选项
select.selectByVisibleText("Four");
select.select_by_visible_text('Four')
select.SelectByText("Four");
select.select_by(:text, 'Four')
const countElement = await driver.findElement(By.css("option[value='still learning how to count, apparently']"))
select.selectByVisibleText("Four")
值
根据其 value 属性选择选项
select.selectByValue("two");
select.select_by_value('two')
select.SelectByValue("two");
select.select_by(:value, 'two')
assert.equal(true, await fourElement.isSelected())
select.selectByValue("two")
索引
根据其在列表中的位置选择选项
select.selectByIndex(3);
select.select_by_index(3)
select.SelectByIndex(3);
select.select_by(:index, 3)
assert.equal(true, await twoElement.isSelected())
select.selectByIndex(3)
禁用选项
具有 disabled
属性的选项可能无法被选中。
<select name="single_disabled">
<option id="sinlge_disabled_1" value="enabled">Enabled</option>
<option id="sinlge_disabled_2" value="disabled" disabled="disabled">Disabled</option>
</select>
Assertions.assertThrows(UnsupportedOperationException.class, () -> {
select.selectByValue("disabled");
});
with pytest.raises(NotImplementedError):
select.select_by_value('disabled')
Assert.ThrowsException<InvalidOperationException>(() => select.SelectByValue("disabled"));
expect {
select.select_by(:value, 'disabled')
}.to raise_exception(Selenium::WebDriver::Error::UnsupportedOperationError)
const select = await new Select(selectElement)
await assert.rejects(async () => {
await select.selectByValue("disabled")
Assertions.assertThrows(UnsupportedOperationException::class.java) {
select.selectByValue("disabled")
}
取消选择选项
只有多选类型的选择列表才能取消选择选项。 您可以为要选择的每个元素重复这些方法。
select.deselectByValue("eggs");
select.deselect_by_value('eggs')
select.DeselectByValue("eggs");
select.deselect_by(:value, 'eggs')
assert.equal(true, await gravyElement.isSelected())
select.deselectByValue("eggs")