Is it possible to get next sibling using cssContainingText in Protractor

Question

Is it possible to get the next sibling by using by.cssContainingText()

Example: HTML code is like below:

        
                      

              相关标签:
       
      

Answer 1

What if you would get it in one go using by.xpath():

element(by.xpath('//div[@class="text-label" and . = "SomeText"]/following-sibling::div'))

Or, you can combine it with cssContainingText():

element(by.cssContainingText('div.text-label','SomeText')).element(by.xpath('following-sibling::div'))

Answer 2

You could use the node.nextSibling selector. Check out this article

Answer 3

Using Xpath selectors is not a better choice as it slows down the element finding mechanism.

I have designed a plugin to address this specific issues: protractor-css-booster

The plugin provides some handly locators to find out siblings in a better way and most importantly with CSS selector.

using this plugin, you can directly use:

var elem = await element(by.cssContainingText('div.text-label','SomeText')).nextSibling();

or, use booster as by-locator

var elem = element(by.cssContainingText('div.text-label','SomeText')).element(by.followingSibling('div'));

Hope, it will help you...