How do you reference a multi-class CSS Selector in Selenium when it is named similar to others?

Question

I have a set of classes underneath the of the HTML document which all share the same set of class names. These are all date pickers but the one that is currently on screen lacks a class name that the others have which is how I need to select it.

How do I write my CSS Selector so that it picks the that has two class names but not the third?

I.E.:

<body>
    <div class="class-one class-two class-three"></div>
    <div class="class-one class-two class-three"></div>
    <div class="class-one class-two class-three"></div>
    <div class="class-one class-two class-three"></div>
    <div class="class-one class-two"></div>
</body>

I want a selector that picks the last div here. So I want it to say that it has "class-one" and "class-two" class names but does NOT have "class-three"?

Ratmir Asanov · Accepted Answer · 2019-01-22 10:16:26Z

2

Also will be worked the following CSS Selector:

div[class='class-one class-two']:not(.class-three)

PS: To disregard the spaces and the order of the classes use the following CSS Selector: div.class-one.class-two:not(.class-three).

edited Jan 22, 2019 at 10:16

answered Jan 24, 2018 at 14:37

Ratmir Asanov

6,4795 gold badges30 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Florent B. Over a year ago

@Ratmir Asanov, :not(.class-three) is useless since you are selecting the exact class. So either div[class='class-one class-two'] for an exact match on the class or div.class-one.class-two:not(.class-three) to disregard the spaces and the order of the classes.

Ratmir Asanov Over a year ago

@FlorentB., I agree with you! I have updated my answer with remarks. Thank you!

Andersson · Accepted Answer · 2018-01-24 14:30:15Z

2

Instead of selector

div.class-one.class-two

which will fetch all div nodes, you can use

div[class="class-one class-two"]

which will return you the last node only

There is also :not() syntax:

div:not(.class-three)

but I'm not sure whether it's applicable for Selenium

answered Jan 24, 2018 at 14:30

Andersson

52.8k18 gold badges83 silver badges132 bronze badges

1 Comment

Neil Pemberton Over a year ago

Thanks! I was trying to get the 'not' working but wasn't getting the syntax the right way round, this is great!

Collectives™ on Stack Overflow

How do you reference a multi-class CSS Selector in Selenium when it is named similar to others?

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related