Using CSS selectors instead of XPath locators when searching through siblings

Question

Currently, I have the following page object fields:

this.filterTeamDropdown = $(\"filter-item-edit .dropdown button\");
this.teams = this.filterTeamDropdown.         


        

Answer 1

There is an another, Protractor-specific way to solve it - use the locator() of the parent element and concatenate to make a child element selector:

this.filterTeamDropdown = $("filter-item-edit .dropdown button");
this.teams = this.filterTeamDropdown.$$(this.filterTeamDropdown.locator().value + " + ul li.dropdown-list-item")