Protractor - get the sibling element of the parent element when filtered via child element

Question

I am working on a protractor test wherein there are multiple headers of the same element type but differs only on the text it shows. To have those headers validate if they're displayed, an xpath filter may be used e.g.

element(by.xpath('//div/div/div[@id="headingOne"]/div/h4/a[contains(text(),"Sample")]')

Now there's another validation that in the filtered header, there should be a checkbox displayed and the checkbox element is located in the sibling element of the header's parent. The code goes like this:

<div class="panel-heading" role="tab" id="headingOne">
 <div class="inline">
  <h4 class="panel-title">
    <a>Sample</a>
  </h4>
 </div>
 <div class="inline-right">
  <input type="checkbox" class="">
 </div>
</div>

Now I am having issues on validating if the next element which is the checkbox exist. I've been using following-sibling in xpath but no use as it is getting the sibling of the <a> element.

element(by.xpath('//div/div/div[@id="headingOne"]/div[contains(text(), "Sample")]/following-sibling::div'))

Note that there other elements/header with the same element path that's why I wanted to filter it via the 'Sample' text which inside the div.

Thanks!

Answer 1

Your attempted XPath can be working if you replace text() which references direct child text nodes to . which should return the entire text content of the context node :

//div/div/div[@id="headingOne"]/div[contains(., "Sample")]/following-sibling::div

You might want to add /input[@type="checkbox"] as well after the above XPath to make sure the checkbox exists in the following sibling div.