C# Selenium Web Driver and CSS : Start point

Question

I have the next tags structure:

<body>
   <parent>
       <nested/>
   </parent>
</body>

I do the following thing:

IWebDriver _driver;

var parent = _driver.FindElement(By.Css("parent"));
var nested = parent.FindElement(By.Css("parent nested"));

Notice, I need to find nested element only this way: at first I find parent tag, then I use parent as a start point to find nested one. But when I use logically wrong locator("parent nested", because together "parent parent nested" is wrong locator), parent.FindElement returns(!) me correct IWebElement, just like if I searched from the top of DOM model.

The interesting thing is that when I do

var nested = parent.FindElement(By.Css("parent"));

it throws element not found exception.

I think I understand something wrong or just don't know something. How does it work? How I can avoid problem of "parent parent nested" ?

score 3 · Answer 1 · answered Dec 29 '16 at 06:30

3

I think here you are using wrong way thats why you are getting error

var nested = parent.FindElement(By.Css("parent"));

Here you are doing -

"first find parent tag, then I use parent as a start point to find parent tag itself"

which is wrong. There can be different ways to get this -

make parent tag as start point and find child tag -

var child= driver.FindElement(By.Css("parent")).FindElement(By.Css("nested"));

Directly find child tag -

var child= driver.FindElement(By.Css("parent nested"));

answered Dec 29 '16 at 06:30

NarendraR

7,577
10
44
82

You are right, but if you do var child= driver.FindElement(By.Css("parent")).FindElement(By.Css("parent nested")); (take a look at the second locator) you ll get a correct element anyway. I just wanna understand why. – Kirill Lappo Dec 29 '16 at 06:43
1

because `By.Css("par‌ent nested")` find the sub-child as "nested" of parent tag so no matter either you can find that sub-child either `By.Css("parent nested")` or can move through make parent as start point and then move to child like `var child= driver.FindElement(By.Css("parent")).FindElement(By.Css("par‌ent nested"));` indirectly it is also finding that sub-child element. – NarendraR Dec 29 '16 at 06:56
`Css("parent nested")` is alternative of ``xpath("//parent//nested")`` as you are going to locate nested element in this way too – NarendraR Dec 29 '16 at 07:00

score 2 · Accepted Answer · edited May 23 '17 at 11:53

cssSelectors will be evaluated from right to left.

that means first children will be evaluated and then check whether their parent exists.

In your case,

var nested = parent.FindElement(By.Css("parent nested"));

first, check whether nested element is present as a child in the DOM (here, nested element). if present, then check whether parent is its parent.

and

var nested = parent.FindElement(By.Css("parent"));

here, parent will be checked whether it is a child of the given element (calling on parent). but it is not. so, gives NoSuchElementException

Reference:

Why do browsers match CSS selectors from right to left?

Thanks both you and @NarendraRajput – Kirill Lappo Dec 29 '16 at 07:29 — Kirill Lappo, Dec 29 '16 at 07:29

C# Selenium Web Driver and CSS : Start point

2 Answers2