Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Why an expression with operator AND doesn't work in css selector

I wrote two css selector expression that look pretty similar with only one change.
I can’t understand why the second one doesn’t work:

1.

a>div[id='nav-cart-count-container']>span[id='nav-cart-count'].nav-cart-count
a>div[id='nav-cart-count-container']>span[id='nav-cart-count'][class='nav-cart-count']

I understand that one is enough but i want to understand them both.
So i will be glad if someone can explain me what’s wrong in writing [class=’nav-cart-count’] because i’ve seen an example that looks the same and works:

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

input[key='something'][type='sometype']

>Solution :

This

span[id='nav-cart-count'].nav-cart-count

expression means literally, that we are locating span element with id attribute value equals to nav-cart-count and it has class nav-cart-count.
The second expression

span[id='nav-cart-count'][class='nav-cart-count']

means span element with id attribute value equals to nav-cart-count and class attribute value equals to nav-cart-count.
So, in case this span element has class attribute value like following: nav-cart-count counter the first locator expression will match it while the second will not!
To match both cases you can use the first expression

span[id='nav-cart-count'].nav-cart-count

or the second expression can be modified to search for contains instead of equals, like this:

span[id='nav-cart-count'][class*='nav-cart-count']
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading