[英]Selecting a value from <md-select> tag using Selenium Webdriver
I am using Selenium Webdriver and working on automating an AngularJS Web App on Chrome. 我正在使用Selenium Webdriver并致力于在Chrome上自动化AngularJS Web App。 It was going pretty well until I hit a dropdown list on the app. 在我点击应用程序的下拉列表之前,它一直很顺利。 My test keeps crashing everytime I try to select a value from it. 每当我尝试从中选择一个值时,我的测试就会一直崩溃。 I have been doing my research on this and I have only seen 2 solutions (both of which I have tried but don't work) 我一直在研究这个问题,我只看到了两个解决方案(我已经尝试了但都没有工作)
Select
object. 使用Select
对象。 This doesn't work because the html tag is not <select>
, its <md-select>
and this fails the test. 这不起作用,因为html标记不是<select>
,它的<md-select>
,这使测试失败。 driver.findElement(By.xpath("xpath to dropdown list")).click();
然后我尝试只需单击下拉元素并单击值 - driver.findElement(By.xpath("xpath to dropdown list")).click();
and driver.findElement(By.xpath("xpath do dropdown value")).click();
和driver.findElement(By.xpath("xpath do dropdown value")).click();
With example 2, I also tried creating it as a WebElement
variable and calling click()
separate, but this did not work either. 在示例2中,我还尝试将其创建为WebElement
变量并单独调用click()
,但这也不起作用。
Any ideas on how I can solve this issue? 关于如何解决这个问题的任何想法?
HTML for the dropdown list 下拉列表的HTML
<div ng-switch-when="dropdown" class="ng-scope">
<zf-form-dropdown>
<div class="dropdown">
<div layout="row">
<div flex="50" class="quote-label">
<p ng-bind-html="::label" class="ng-binding">Title</p>
</div>
<div ng-show="false" flex="10" class="tooltip-icon ng-hide" ng-click="showToolTip(field.get('toolTip'))" role="button" tabindex="0" aria-hidden="true"><img src="img/item-question@2x.png"></div>
<md-select flex="" ng-disabled="quote.isRated() || !input.enabled" ng-change="onDropdownChange()" ng-model="input.value" class="ng-valid md-default-theme ng-touched ng-dirty" role="combobox" id="select_0Q9" aria-haspopup="true" aria-expanded="false" aria-labelledby="select_label_0I1" tabindex="0" aria-disabled="false" aria-invalid="false" aria-owns="select_menu_0Q8"><md-select-label class="md-select-label md-placeholder" id="select_label_0I1"><span></span><span class="md-select-icon" aria-hidden="true"></span></md-select-label></md-select>
</div>
</div>
</zf-form-dropdown>
</div>
HTML for the value I want to select 我想要选择的值的HTML
<md-option ng-value="::item.val" ng-selected="item.checked" ng-repeat="item in getOpts()" tabindex="0" class="ng-scope" role="option" aria-selected="false" id="select_option_0QD" value="MR">
<div class="md-text ng-binding">Mr</div>
<div class="md-ripple-container"></div>
</md-option>
The xpath for the dropdown list is //*[@id="select_0Q9"]
The xpath for the dropdown value is //*[@id="select_option_0QD"]
下拉列表的xpath为//*[@id="select_0Q9"]
下拉值的xpath为//*[@id="select_option_0QD"]
If you are sure that your Xpath is fine then you can also click using javascriptexecutor so try it out like below:- 如果你确定你的Xpath很好,你也可以点击使用javascriptexecutor,所以试试如下: -
WebElement element= driver.findElement(By.xpath("//md-option[@id='select_option_0QD']/div[1]"));
JavascriptExecutor executor = (JavascriptExecutor) driver;
executor.executeScript("arguments[0].click();", element);
Please feel free to locate the element in above code as per your convenience . 请随意根据您的方便在上面的代码中找到元素。
As per me your xpath of dropdown should be like below:- 按照我的说法,您的下拉列表的xpath应如下所示: -
//md-option[@id='select_option_0QD']
And xpath of first div which I suppose want to click is:- 我想要点击的第一个div的xpath是: -
//md-option[@id='select_option_0QD']/div[1]
Change [1] to [2] if you want 2nd value. 如果您想要第二个值,请将[1]更改为[2]。
In an another aspect you can also store all your element in the list(As you know you can't use select) and click them as per your need or all. 在另一个方面,您还可以将所有元素存储在列表中(如您所知,不能使用select)并根据需要或全部单击它们。
For that you need to use xpath like:- 为此,您需要使用xpath,如: -
//md-option[@id='select_option_0QD']/div
Now implement it into code:- 现在将其实现为代码: -
List<WebElement> allelemts = driver.findElements(By.xpath("//md-option[@id='select_option_0QD']/div"));
for(WebElement ele: allelemts){
driver.findElement(By.xpath("//md-option[@id='select_option_0QD']")).click();
JavascriptExecutor executor = (JavascriptExecutor) driver;
executor.executeScript("arguments[0].click();", ele);
}
Hope it will help you :) 希望它能帮到你:)
Since you are receiving a NoSuchElementException
exception, I believe the issue lies in Selenium not able to identify the element. 由于您收到NoSuchElementException
异常,我认为问题在于Selenium无法识别该元素。 Try any of the following wait
methods and then try to click the element. 尝试以下任何wait
方法,然后尝试单击该元素。
Explicit Wait: (Most Preferred) 明确等待:(最喜欢的)
WebDriverWait wait = new WebDriverWait(driver, 20);
WebElement element = wait.until(ExpectedConditions.elementToBeClickable(By.id("elementID")));
or 要么
WebDriverWait wait = new WebDriverWait(driver, 20);
WebElement element = wait.until(ExpectedConditions.presenceOfElementLocated(By.id("elementID")));
Implicit Wait: 隐含等待:
driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
Sleep: (Try to avoid this unless absolutely necessary) 睡觉:(除非绝对必要,尽量避免这种情况)
Thread.sleep(1000);
EDIT: Added code to check for element's presence using findElements
method. 编辑:添加代码以使用findElements
方法检查元素的存在。
Before using any of these wait
methods you could also check for the presence of your element using findElements
method. 在使用任何这些wait
方法之前,您还可以使用findElements
方法检查元素是否存在。
List<WebElement> element = driver.findElements(By.id("elementId"));
if (element.size() == 0) {
System.out.println("Element not found");
} else{
System.out.println("Element found");
}
I have finally solved the issue! 我终于解决了这个问题!
I got the Selenium IDE and recorded a session where I got as far as selecting the dropdown menu and selecting my value. 我得到了Selenium IDE并记录了一个会话,我选择下拉菜单并选择我的值。 I then exported the file as a java test case and was able to read the lines where it selected the values, and they were; 然后我将文件导出为java测试用例,并且能够读取选择值的行,它们是;
driver.findElement(By.cssSelector("#select_08D > #select_label_005 > span.md-select-icon")).click();
driver.findElement(By.id("select_option_08H")).click();
So first off they both do not use xpath
to find the elements, the dropdown menu itself is found with the cssSelector
and the value is found by the id
. 所以首先他们都不使用xpath
来查找元素,使用cssSelector
找到下拉菜单本身,并且id
找到值。
I am just cross referencing again and the id
for the value is select_option_08H
but while I am looking at Google Console I can see the id
for the value is select_option_189
我只是再次交叉引用,值的id
是select_option_08H
但是当我查看Google控制台时,我可以看到该值的id
是select_option_189
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.