Selenium C# 在 div 中选择一个元素

Question

大家好，我有一个选择，它在 UI 中的绑定位置如下

<div class="choices form-group form-choices" data-type="select-one" dir="ltr" tabindex="-1" role="listbox" aria-haspopup="true" aria-expanded="false">
 <div class="form-control ui fluid selection dropdown" tabindex="0">
  <select lang="en" class="form-control choices__input" type="text" name="data[serviceAmpsDelivered]" ref="selectContainer" dir="ltr" hidden="" tabindex="-1" data-choice="active">
   <option value="6">&lt;span&gt;60&lt;/span&gt;</option>
  </select>
  <div class="choices__list choices__list--single">
   <div class="choices__item choices__item--selectable" data-item="" data-id="38" data-value="6" data-custom-properties="null" aria-selected="true" data-deletable="">
    <span>60</span>
    <button type="button" class="choices__button" aria-label="Remove item: '6'" data-button="">Remove item</button>
   </div>
  </div>
 </div>
 <div class="choices__list choices__list--dropdown" aria-expanded="false">
  <div class="choices__list" role="listbox">
   <div id="choices--data-oa-item-choice-1" class="choices__item choices__item--choice choices__item--selectable is-highlighted" role="option" data-choice="" data-id="1" data-value="1" data-select-text="" data-choice-selectable="" aria-selected="true">
    <span>50</span>
   </div>
   <div id="choices--data-oa-item-choice-2" class="choices__item choices__item--choice choices__item--selectable " role="option" data-choice="" data-id="2" data-value="6" data-select-text="" data-choice-selectable="">
    <span>60</span>
   </div>
   <div id="choices--data-oa-item-choice-3" class="choices__item choices__item--choice choices__item--selectable " role="option" data-choice="" data-id="3" data-value="2" data-select-text="" data-choice-selectable="">
    <span>100</span>
   </div>
   <div id="choices--data-oa-item-choice-4" class="choices__item choices__item--choice choices__item--selectable " role="option" data-choice="" data-id="4" data-value="5" data-select-text="" data-choice-selectable="">
    <span>150</span>
   </div>
   <div id="choices--data-oa-item-choice-5" class="choices__item choices__item--choice choices__item--selectable " role="option" data-choice="" data-id="5" data-value="3" data-select-text="" data-choice-selectable="">
    <span>200</span>
   </div>
   <div id="choices--data-oa-item-choice-6" class="choices__item choices__item--choice choices__item--selectable " role="option" data-choice="" data-id="6" data-value="4" data-select-text="" data-choice-selectable="">
    <span>400</span>
   </div>
  </div>
 </div>

我可以选择 div 并打开下拉菜单，但我无法选择项目

WebElement element= (WebElement)driver.FindElement(By.XPath("/html/body/div[1]/div/div[1]/app/div/div[2]/div[2]/div/div[2]/app/div/div/div/div[2]/div[2]/div[2]/app/div/div/div/forms-app/div/div/div/div[1]/div[1]/div[1]/div[2]/div[2]/div[1]/div[1]"));
Helper.JavaScriptClick(_driver, element);

WebElement elementValue= (WebElement)driver.FindElement(By.XPath("/html/body/div[1]/div/div[1]/app/div/div[2]/div[2]/div/div[2]/app/div/div/div/div[2]/div[2]/div[2]/app/div/div/div/app/div/div/div/div[1]/div[1]/div[1]/div[2]/div[2]/div[1]/div[2]/div/div[4]"));
        Helper.JavaScriptClick(_driver, elementValue);

Answer 1

如果您想从下拉列表中选择项目，您 如果您使用父标签作为 div 然后跟随子标签，可以检查每个元素的 ID 是否唯一。

xpath

项目 1.

//div[@id='choices--data-oa-item-choice-1']/span

xpath

项目 2.

//div[@id='choices--data-oa-item-choice-2']/span

等等。

---

如果你想选择一个特定的，你可以参数化该值。 假设您想从下拉列表中选择

150

。

var itemval="150";
WebElement element= (WebElement)driver.FindElement(By.XPath($"//div[starts-with(@id,'choices--data-oa-item-choice-')]/span[text()='{itemval}']"));
Helper.JavaScriptClick(_driver, element);

Answer 2

好吧，经过一些尝试和错误后我得到了解决方案

WebElement ddlControl= (WebElement)_driver.FindElement(By.XPath("//select[contains(@name,'controlName"));
Helper.JavaScriptClick(_driver, ddlControl);
TimeSpan timeToWait = new TimeSpan(0, 0, 10);
WebDriverWait waitForElemet = new WebDriverWait(_driver, timeToWait);
waitForElemet.Until(ExpectedConditions.ElementToBeClickable(By.XPath("//div[contains(@id,'ControlId')]//following::span[text()='50']"))).Click();