Как найти транспортир дядя / двоюродный брат элементы

Question

У меня есть следующий HTML с несколькими элементами, равными этому. Мне нужен способ в транспортире, чтобы найти этот уникальный элемент (который я использую cssContainedText с ".list-group-item-heading", "Аналоговый вывод", потому что это уникально для этого элемента), а затем перейти к бабушке и дедушке ('.ba-object-item'), чтобы я мог добраться до дяди ('.ba-value'), чтобы убедиться, что он отображает 1 %

Мне также нужно будет в конечном итоге добраться до элемента двоюродного брата ('.marengo-Physical-Output'), чтобы определить, что значок отображается правильно.

Каков наилучший подход для обхода DOM в этом случае?

<div class="ba-object-item">
  <div class="ba-text">
    <h5 class="list-group-item-heading text-primary">Analog output</h5>
    <span class="list-group-item-text">%R%'AO</span>
  </div>
  <div class="ba-value text-primary">1 %</div>
  <div class="ba-icon">
    <i class="icon icon-large marengo-physical-output" ng-reflect-klass="icon icon-large" ng-reflect-ng-class="marengo-physical-output"></i>
  </div>

Answer 1

Это не связано с protractor, Это о css или же xPath, Вы можете найти много полезной информации здесь

Answer 2

Ключевой момент вашей проблемы - решить, как найти <div class="ba-object-item">, вы можете попытаться найти DIV который включает в себя H5 и H5текст Analog output XPath следующим образом:

var baItem = element(
            by.xpath('//div[@class="ba-object-item"][./div/h5[text()="Analog output"]]'));

// or
var baItem = element(
            by.xpath('//div[@class="ba-object-item"][.//h5[text()="Analog output"]]'));

var baValue = baItem.element(by.css('div.ba-value'));

var baIcon = baItem.element(by.css('i.marengo-physical-output'))