使用 Selenium Java 从 ReactJS 下拉列表中选择值答案

【问题标题】：Select value from ReactJS dropdown with Selenium Java使用 Selenium Java 从 ReactJS 下拉列表中选择值
【发布时间】：2020-09-17 19:03:04
【问题描述】：

我们有一个带有下拉框的 ReactJS 前端应用程序，当单击它时会显示其中的元素并需要选中复选框，但是如果尝试检查下拉值，它会显示如果单击某处就会消失的属性。

下面是html：

<div class="MuiFormControl-root fullWidth">

<div class="MuiInputBase-root MuiOutlinedInput-root adornedEnd">

<input aria-invalid="false" autocomplete="off" id="checkboxes-tags-demo" placeholder="Select" type="text" class="MuiInputBase-input inputAdornedEnd" aria-autocomplete="list" autocapitalize="none" spellcheck="false" value="">

尝试了以下方法：但它不起作用，没有出现此类元素异常

List<WebElement> countries = driver.findElements(By.xpath("//div[@class='MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth']/div"));
            for(WebElement tag : countries){
            if(tag.getText().trim().equals("TITLE"))
            tag.click();
            }

通过线程： Testing React JS dropdown with Selenium and java

请指导。

【问题讨论】：

是公共网址吗？

标签： reactjs selenium selenium-webdriver

【解决方案1】：

可以通过以下步骤解决问题：

单击下拉菜单的箭头标记 (^) 以展开下拉菜单
然后用户 sendKeys 在下拉菜单的输入元素中向下/向上箭头> 然后 ENTER 键选择值
从字段中提取

driver.findElement(By.xpath("(//*[@alt='Expand'])[1]")).click();

            driver.findElement(By.xpath("//input[@id='tags']")).sendKeys(Keys.ARROW_DOWN);
            System.out.println("clicking arrow down");
            sleep(5);
            driver.findElement(By.xpath("//input[@id='tags']")).sendKeys(Keys.ENTER);
            System.out.println("clicked enter");
            sleep(2);
            driver.findElement(By.xpath("//input[@id='tags']")).sendKeys(Keys.TAB);
            System.out.println("tabbed out");

【讨论】：