使用 Selenium 和 java 测试 React JS 下拉列表

Testing React JS dropdown with Selenium and java

本文关键字:React JS 下拉列表 测试 java Selenium 使用      更新时间:2023-09-26

>我有一个下拉菜单,它使用 React JS 动态填充值。如何从此下拉列表中选择一个值。你能用一个例子指出我正确的方向吗?

这是页面的 HTML 代码。包含"年份"文本的 Div 是下拉列表。一旦我点击年份,它就给了我几个选项,如 2015、2014、2013 等。但我不确定如何使用硒访问这些值。

<div class="fitment-box__first-select" data-reactid=".2.0.0.0.0.2.1"><span data-reactid=".2.0.0.0.0.2.1.0">My vehicle was made in</span><div class="Select fitment-box__select-year" data-reactid=".2.0.0.0.0.2.1.1"><input type="hidden" name="year" value="" data-reactid=".2.0.0.0.0.2.1.1.0"><div class="Select-control" data-reactid=".2.0.0.0.0.2.1.1.1"><div class="Select-placeholder" data-reactid=".2.0.0.0.0.2.1.1.1.0:$placeholder">Year</div><div class="Select-input " tabindex="0" data-reactid=".2.0.0.0.0.2.1.1.1.1">&nbsp;</div><span class="Select-arrow-zone" data-reactid=".2.0.0.0.0.2.1.1.1.4"><span class="Select-arrow" data-reactid=".2.0.0.0.0.2.1.1.1.4.0"></span></span></div></div></div>

我也有同样的问题,并根据Saurabh的回答找到了解决方案。

WebElement button = driver.findElement(element);
Actions action = new Actions(driver);
action.moveToElement(button).click().build().perform();

使用操作类。下面是一个示例:

Actions act = new Actions(this.getDriver());
act.moveToElement(element).click().build().perform();
act.click(elementValue).build().perform();

标准的硒下拉方法一直对我有用。还有其他选项,例如,如果您不在乎选择哪一年,也可以按索引选择。

Select dropdown = new Select(element)); 
dropdown.selectByVisibleText(year);