本文介绍了如何在硒鼓webdriver中处理ExtJS的组合框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述 你好我有一个基于ExtJS的UI。我已经知道,在ExtJS中,组合框不是真正的组合框,而是输入文本字段,下拉框的图像和列表的组合。现在我可以识别控件,但是我坚持从列表中选择值。在HTML源代码中,我看到列表显示为单独的div,当我们点击下拉列表时,它会被附加在源的末尾。找到下拉控件的HTML源代码。 { < div id =ext-gen678class =x-form-field-wrap x -form-b​​tn-plugin-wrapstyle =width:556px;> < div id =ext-gen676class =x-form-field-wrap x-form-field-trigger-wrap x-trigger-wrap-focusstyle =width:521px;> ; < input id =ext-gen677type =hiddenname =GHVOg:#concat#〜inputFld〜ISGP_UNIV:ft_t_isgp.prnt_iss_grp_oi​​d:0value => < input id =GHVOg:Mixh8:0class =x-form-text x-form-field gs_dropDown_input gs_req x-form-invalid x-form-focustype =textautocomplete = offsize =24style =width:504px;> < img id =trigger-GHVOg:Mixh8:0class =x-form-trigger x-form-arrow-triggeralt =src =../../ ext / resources /images/default/s.gif\"> } 的下拉列表: < div id =ext-gen726class =x-layer x-combo- list x-resizable-pinnedstyle =position:absolute; z-index:12007; visibility:visible; left:294px; top:370px; width:554px; height:123px; font-size:11px;> < div id =ext-gen727class =x-combo-list-innerstyle =width:554px; margin-bottom:8px; height:114px;> < div class =x-combo-list-item>< / div> < div class =x-combo-list-item> 12h Universe< / div> < div class =x-combo-list-item> 1h Universe< / div> < div class =x-combo-list-item> 24h Universe< / div> < div class =x-combo-list-item> 2h Universe< / div> < div class =x-combo-list-item x-combo-selected> 4h Universe< / div> 现在我从列表中选择了值,因为列表的div元素没有附加到控制。 另请参考屏幕截图,我有多个类似的控件[命名为将安全添加到Universe] 在屏幕截图中,您可以看到多个下拉菜单(添加对Universe的安全性)突出显示,所有下拉菜单都相同值出现在列表中。那么我如何从下拉列表中识别这些值。 我想知道ExtJS如何维护与组合框小部件的下拉div元素的映射,以便我可以使用相同的逻辑来标识列表。任何人都可以告诉我如何在selenium webdriver中做这个事情?解决方案你注意到只有一个页面上可见的 x-combo-list (让我知道如果你可以同时打开两个组合列表) 因此,你只需要关心可见的一个 x-组合列表。 Css选择器: .x-combo-list [style * ='visibility:visible;'] .x-combo-list-item Xpath: // * [contains(@class,'x-combo-list')and contains(@风格,'visibility:visible;')] // * [contains(@class,'x-combo-list-item')] //未测试的java代码,仅用于逻辑 public void clickComboItem(WebElement input,String target){ input.click (); //单击输入以弹出组合列表列表< WebElement> comboItems = driver.findElements(By.cssSelector(。x-combo-list [style * ='visibility:visible;'] .x-combo-list-item)); (int i = 0; i< = comboItems.size(); i ++){ WebElement item = comboItems.get(i); if(item.getText()。eqauls(target)){ item.click(); break; } } } //可编译C#版本 public void ClickComboItem(IWebElement input,string target){ input.Click(); IList< IWebElement> comboItems = driver.findElements(By.CssSelector(。x-combo-list [style * ='visibility:visible;'] .x-combo-list-item)); comboItems.First(item => item.Text.Trim()== target).Click(); } Hi i have a ExtJS based UI. I have come to know that in ExtJS the combo box is not a real combo box but a combination of input text field, image of drop down box and a list. Now i am able to identify the control but i am stuck at selecting the value from the list. In the HTML source i see that the list is appearing as a seperate div and gets attached at the end of the source when we click on the drop down. find below the HTML source of the drop down control.{<div id="ext-gen678" class="x-form-field-wrap x-form-btn-plugin-wrap" style="width: 556px;"><div id="ext-gen676" class="x-form-field-wrap x-form-field-trigger-wrap x-trigger-wrap-focus" style="width: 521px;"><input id="ext-gen677" type="hidden" name="GHVOg:#concat#~inputFld~ISGP_UNIV:ft_t_isgp.prnt_iss_grp_oid:0" value=""><input id="GHVOg:Mixh8:0" class="x-form-text x-form-field gs_dropDown_input gs_req x-form-invalid x-form-focus" type="text" autocomplete="off" size="24" style="width: 504px;"><img id="trigger-GHVOg:Mixh8:0" class="x-form-trigger x-form-arrow-trigger" alt="" src="../../ext/resources/images/default/s.gif">}find below the HTML source of the drop down list:<div id="ext-gen726" class="x-layer x-combo-list x-resizable-pinned" style="position: absolute; z-index: 12007; visibility: visible; left: 294px; top: 370px; width: 554px; height: 123px; font-size: 11px;"><div id="ext-gen727" class="x-combo-list-inner" style="width: 554px; margin-bottom: 8px; height: 114px;"><div class="x-combo-list-item"></div><div class="x-combo-list-item">12h Universe</div><div class="x-combo-list-item">1h Universe</div><div class="x-combo-list-item">24h Universe</div><div class="x-combo-list-item">2h Universe</div><div class="x-combo-list-item x-combo-selected">4h Universe</div>Now i have problem selecting the value from the list as the div element of the list is not attached to the control.Also please refer the screen shot, where i have multiple similar controls [Named "Add Security to Universe"]In the screen shot you can see multiple drop downs [Add security to Universe] highlighted and all the drop downs have same value appearing in the list. so how can i identify these values from the drop down list.I was wondering how ExtJS maintains mapping of the drop down div elements with the combo Box widget so that i could use the same logic for identifying the list. Can anyone tell me how can i go about doing this thing in selenium webdriver? 解决方案 Did you notice that there will be only one visible x-combo-list on the page? (Let me know if you can open up two combo lists at the same time)Therefore you only need to care about the visible one x-combo-list. Css selector: .x-combo-list[style*='visibility: visible;'] .x-combo-list-itemXpath: //*[contains(@class, 'x-combo-list') and contains(@style, 'visibility: visible;')]//*[contains(@class, 'x-combo-list-item')]// untested java code, just for the logicpublic void clickComboItem(WebElement input, String target) { input.click(); // click input to pop up the combo list List<WebElement> comboItems = driver.findElements(By.cssSelector(".x-combo-list[style*='visibility: visible;'] .x-combo-list-item")); for (int i = 0; i <= comboItems.size(); i++) { WebElement item = comboItems.get(i); if (item.getText().eqauls(target)) { item.click(); break; } }}// compilable C# versionpublic void ClickComboItem(IWebElement input, string target) { input.Click(); IList<IWebElement> comboItems = driver.findElements(By.CssSelector(".x-combo-list[style*='visibility: visible;'] .x-combo-list-item")); comboItems.First(item => item.Text.Trim() == target).Click();} 这篇关于如何在硒鼓webdriver中处理ExtJS的组合框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!
10-29 11:51