如何在Selenium Webdriver中选择所有extjs下拉值 [英] how to select all the extjs dropdown values in selenium webdriver

问题描述

我正在尝试从extjs组合框中选择一个选项.
在下面的代码中，listElements仅给出可见的选项(在屏幕上显示)，而不是所有的选项.
在这里只能选择屏幕上可用的选项之一.
我想选择列表底部的值.
我找不到任何选项可以将列表向下拖动以选择所需的选项.

I am trying to a select option from extjs combo box.
Here in the below code listElements is giving only the visible options(which are shown in the screen) and not all the options.
Here am restricted to select one of the options which are available in the screen.
I want to select the value which are in the bottom of the list.
I don't find any option to drag down the list to select the desired option.

 List<WebElement> listElements = TestUtil.getWebDriver().findElements((By.className("x-boundlist-item")));
        for(WebElement ele : listElements){
            if(ele.getText().equals(TestUtil.getValue(DateTimeConstants.TIMEZONE_INPUT_VALUE))){
                ele.click();
                break;
            }
        }

请找到html:

这是组合框html:

<input id="currentTimezone-inputEl" class="x-form-field x-form-text x-form-focus x-field-form-focus x-field-default-form-focus" type="text" style="width: 100%; -moz-user-select: text;" name="dateTimeData.selectedTimezone" value="-- Please Select --" autocomplete="off" aria-invalid="false" data-errorqtip="">  

选项如下所示:

<div id="ext-gen1024" class="x-reset">
<div id="ext-gen1074" class="x-reset">
<div id="ext-gen1076" class="x-css-shadow" role="presentation" style="z-index: 19000; left: -9999px; top: -9995px; width: 355px; height: 296px; box-shadow: 0px 0px 4px rgb(136, 136, 136); display: none;"></div>
<div id="ext-gen1079" class="x-css-shadow" role="presentation" style="z-index: 19000; left: 20px; top: 321px; width: 355px; height: 296px; box-shadow: 0px 0px 4px rgb(136, 136, 136); display: none;"></div>
<div id="boundlist-1022" class="x-boundlist x-boundlist-floating x-layer x-boundlist-default" tabindex="-1" style="left: 20px; top: 317px; width: 355px; z-index: 19001; height: 300px; display: none;">
<div id="boundlist-1022-listEl" class="x-boundlist-list-ct" style="overflow: auto; height: 299px;">
<ul>
<li class="x-boundlist-item" role="option">Africa/Abidjan</li>
<li class="x-boundlist-item" role="option">Africa/Accra</li>
<li class="x-boundlist-item" role="option">Africa/Addis_Ababa</li>
<li class="x-boundlist-item" role="option">Africa/Algiers</li>
<li class="x-boundlist-item" role="option">Africa/Asmara</li>

<li class="x-boundlist-item x-boundlist-selected" role="option">America/St_Lucia</li>
</div>
</div>
</div>

推荐答案

是的，我可以重现此问题.原因是Selenium不会单击不可见元素，每个不可见元素的文本也将为空.

Yes, I can reproduce this issue. The reason is that Selenium won't click on invisible elements, each of the invisible element's text will also be empty.

在这里，大多数组合列表元素都是不可见的，因此ele.getText()不会为您带来任何好处.结果，您将无法将文本与您想要的文本进行比较.

Here most of the combo list elements are invisible, so ele.getText() won't get you anything for them. As a result, you won't be able to compare the text with the one you want.

但是，解决方法是，不使用ele.getText()来获取文本，您可以尝试使用元素的textContent属性来获取文本.另外，Selenium不会单击不可见元素，因此您需要使用Actions click()而不是常规的click().以下是您的操作方法.

However, the workaround is, without using ele.getText() to get the text, you can try use textContent attribute of an element to get the text. Also, Selenium won't click on invisible element, so you need to use Actions click() rather than normal click(). Below is how you can do it.

List<WebElement> listElements = TestUtil.getWebDriver().findElements((By.cssSelector(".x-boundlist:not([style*='display: none'])")));
    for(WebElement ele : listElements){
        if(ele.getAttribute("textContent").equals(TestUtil.getValue(DateTimeConstants.TIMEZONE_INPUT_VALUE))) {
            // print out ele.getAttribute("textContent") if you want
            // ele.click(); ElementNotVisible exception may be thrown
            new Actions(TestUtil.getWebDriver()).click(ele).perform();
            break;
        }
    }
}

这篇关于如何在Selenium Webdriver中选择所有extjs下拉值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！