How to capture a tag in same level using Sibling “+” Operator CSS Selector in Selenium.

Problem scenario

I want to capture this input tag, located in div tag, but in the same level of span.

How to do it ?

First of all capture the div that span tag is under for that use below CSS locator.

WebElement divTag=divdiv.findElement(By.cssSelector("div[class='search-box']"));

Then using divTag element can capture the input that in the same level.

Syntax for it is +.

locator 1+ locator 2

span[class='icon-filter'] + input

So here to for locator one I captured using class name and locator 2 is using input tag.

Full code is as per below.

WebElement div_Second=divdiv.findElement(By.cssSelector("div:nth-of-type(2)"));// get the second div.
WebElement icon_filter=div_Second.findElement(By.cssSelector("span[class='icon-filter'] + input"));
icon_filter.sendKeys("CORE");