Selenium: как найти элемент из HTML, предоставленного через CssSelector или XPath

Question

Вот кнопка на странице:

<button data-purpose="add-section-btn" type="button" 
        class="ellipsis btn btn-default btn-block">
   <span class="a3 udi udi-plus-square"></span>
   <!-- react-text: 255 --> <!-- /react-text -->
   <!-- react-text: 256 -->Add Section<!-- /react-text -->
</button>

Когда я пытаюсь найти ее, используя следующий код:

var btns = _driver.FindElements(By.TagName("button"));
var sectionTitle = btns.Where(x => x.GetAttribute("data-purpose") == "add-section-btn");

Возвращает ноль.

Если я попробую следующий XPath:

var btn = _driver.FindElement(By.XPath("//button[data-purpose=\"add-section-btn\"]"));

, то получу исключение.

Как найти такую ​​кнопку?

Answer 1

В соответствии с HTML , который вы указали, элемент с текстом в виде Добавить секцию в качестве элемента Элемент реагирования вам нужно вызвать WebDriverwait , чтобы элемент был видимым , и вы можете использовать любую из следующих стратегий локатора :

• CssSelector :

  var btn = new WebDriverWait(_driver, TimeSpan.FromSeconds(10)).Until(ExpectedConditions.ElementIsVisible(By.CssSelector("button.ellipsis.btn.btn-default.btn-block[data-purpose='add-section-btn']")));
  

• XPath :

  var btn = new WebDriverWait(_driver, TimeSpan.FromSeconds(10)).Until(ExpectedConditions.ElementIsVisible(By.XPath("//button[@class='ellipsis btn btn-default btn-block' and @data-purpose='add-section-btn'][normalize-space()='Add Section']")));
  

Answer 2

Попробуйте,

var btn = _driver.FindElement(By.XPath("//button[@data-purpose='add-section-btn']"));