Selenium 简明教程
Selenium WebDriver - Multi Select
Selenium Webdriver 可以使用 Select 类在网页的下拉列表中进行多选选项。下拉列表在网页上可以有两种类型 - 单选和多选。
Selenium Webdriver can be used for multi-selection of options in a dropdown on a web page using the Select class. Dropdowns can be two types of on a web page - single selecta and multiple select.
多选下拉列表由称为 select 的标签名标识。此外,其每个选项都由称为 option 的标签名标识。除此之外,多选下拉列表应该具有 multiple 属性。
A multi-select dropdown is identified by the tagname called select. Also, each of its options are identified with the tagname called the option. In addition to it, a multiple select dropdown should have an attribute multiple.
Identification of Multi Select Dropdown in HTML
右键单击网页,然后在 Chrome 浏览器中单击“检查”按钮,这样整个页面的 HTML 代码就会可见。要调查页面上的多选下拉列表,请单击可见 HTML 代码顶部的左上方箭头,如下所示。
Right click on the webpage, and click on the Inspect button in the Chrome browser as a result the HTML code for the whole page would be visible. For investigating a multi-select dropdown on a page, click on the left upward arrow, available to the top of the visible HTML code as highlighted below.
一旦我们单击并指向文本 Multiselect drop down 旁边的下拉列表箭头,其 HTML 代码就会可见,反映 select 标签名(用 <> 括起来),以及 option 标签名内的选项,以及其多重属性。
Once we had clicked and pointed the arrow to the dropdown beside the text Multiselect drop down, its HTML code was visible, reflecting the select tagname(enclosed in <>), and its options within the option tagname, and its attribute multiple.
Basic Multi Select Methods in Select
Selenium webdriver 的 Select 类中有各种方法可以帮助我们同时处理多选 dropdowns 。
There are various methods available in the Select class of Selenium webdriver which helps us to handle both the multiple select dropdowns.
Example
让我们再举一个下面页面的例子,我们在其中访问文本“Multi Select drop down”旁边的多选下拉列表,选择值 Movies, Music & Games, Electronics & Computers ,而 Books 使用上面讨论的方法执行一些验证。
Let us take another example of the below page, where we would access the multi-select dropdown beside the text Multi Select drop down, select the values Movies, Music & Games, Electronics & Computers, and Books perform some validations with the methods discussed above.
Code Implementation
package org.example;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;
import java.util.List;
import java.util.concurrent.TimeUnit;
public class HandlingMultDropdown {
public static void main(String[] args) throws InterruptedException {
// Initiate the Webdriver
WebDriver driver = new ChromeDriver();
// adding implicit wait of 15 secs
driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);
// Opening the webpage where we will get dropdown
driver.get("https://www.tutorialspoint.com/selenium/practice/select-menu.php");
// identify multiple dropdown
WebElement dropdown = driver.findElement(By.xpath("//*[@id='demo-multiple-select']"));
// object of Select class
Select select = new Select(dropdown);
// gets options of dropdown in list
List<WebElement> options = select.getOptions();
for (WebElement opt : options){
System.out.println("Options are: " + opt.getText());
}
// return true if multi-select dropdown
Boolean b = select.isMultiple();
System.out.println("Boolean value for multiple dropdown: "+ b);
// select item by visible text
select.selectByVisibleText("Books");
// select item by value
select.selectByValue("2");
// select item by index
select.selectByIndex(2);
// get all selected options of dropdown in list
List<WebElement> selectedOptions = select.getAllSelectedOptions();
for (WebElement opt : selectedOptions){
System.out.println("Selected Options are: " + opt.getText());
}
// get first selected option in dropdown
WebElement f = select.getFirstSelectedOption();
System.out.println("First selected option is: "+ f.getText());
// deselect option by index
select.deselectByIndex(2);
// get all selected options of dropdown after deselecting 1
List<WebElement> deletedOptions = select.getAllSelectedOptions();
System.out.println("No. options selected after deselecting one option: " + deletedOptions.size());
// deselect all selected items
select.deselectAll();
// get all selected options of dropdown after deselected
List<WebElement> deletedAllOptions = select.getAllSelectedOptions();
System.out.println("No. options selected after deselecting all: " + deletedAllOptions.size());
// Closing browser
driver.quit();
}
}
Options are: Books
Options are: Movies, Music & Games
Options are: Electronics & Computers
Options are: Home, Garden & Tools
Options are: Health & Beauty
Options are: Toys, Kids & Baby
Options are: Clothing & Jewelry
Options are: Sports & Outdoors
Boolean value for multiple dropdown: true
Selected Options are: Books
Selected Options are: Movies, Music & Games
Selected Options are: Electronics & Computers
First selected option is: Books
No. options selected after deselecting one option: 2
No. options selected after deselecting all: 0
Process finished with exit code 0
在上面的示例中,我们通过控制台中的消息获得了下拉列表的所有选项 - Options are: Books, Options are: Movies, Music & Games, Options are: Home, Garden & Tools, Options are: Health & Beauty, Options are: Toys, Kids & Baby, Options are: Clothing & Jewelry, Options are: Sports & Outdoors 。
In the above example, we had obtained all the options of the dropdown with the message in the console - Options are: Books, Options are: Movies, Music & Games, Options are: Home, Garden & Tools, Options are: Health & Beauty, Options are: Toys, Kids & Baby, Options are: Clothing & Jewelry, Options are: Sports & Outdoors.
我们还通过控制台中的消息验证了下拉列表有多个选项 - Boolean value for checking is: true 。我们通过控制台中的消息检索了下拉列表中选定的选项 - Selected Options are: Books, Selected Options are: Movies, Music & Games 和 Selected Options are: Electronics & Computers 。
We had also validated that the dropdown had multiple selection options with the message in the console - Boolean value for checking is: true. We had retrieved the selected options in the dropdown with the message in the console - Selected Options are: Books, Selected Options are: Movies, Music & Games, and Selected Options are: Electronics & Computers.
我们还通过控制台中的消息获得了第一个已选择的选项 - First selected option is: Books 。在取消选择一个已选择的选项后,我们通过控制台中的消息接收了所选选项的数量 - No. options selected after deselecting one option: 2 。
We had also obtained the first selected option with the message in the console - First selected option is: Books. After deselecting the one selected, then we had received the number of selected options with the message in the console - No. options selected after deselecting one option: 2.
最后,我们取消选择下拉列表中所有已选择的选项,因此获得了控制台中的消息 - No. options selected after deselecting all: 0 。
Finally, we deselected all the selected options in the dropdown, and hence obtained the message in the console - No. options selected after deselecting all: 0.
最后,收到了消息 Process finished with exit code 0 ,表示代码成功执行。
Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.
这结束了我们对 Selenium Webdriver - Multi Select 教程的全面讲解。我们首先描述了识别 HTML 中的多选下拉列表,Select 中的基本多选方法,以及说明如何在 Selenium Webdriver 中处理多选下拉列表的示例。
This concludes our comprehensive take on the tutorial on Selenium Webdriver - Multi Select. We’ve started with describing identification of multi select dropdown in HTML, basic multi select methods in Select, and an example to illustrate how to handle multiple select dropdowns in Selenium Webdriver.
这使您对 Selenium Webdriver - 多选有了深入的了解。明智的做法是坚持实践您学到的知识并探索与 Selenium 相关的其他内容,以加深您的理解并拓展视野。
This equips you with in-depth knowledge of the Selenium Webdriver - Multi Select. It is wise to keep practicing what you’ve learned and exploring others relevant to Selenium to deepen your understanding and expand your horizons.