Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to select elements without a class by not using :not()?

when I did some automation tests using Capybara and Selenium Webdriver, I got the problem with selecting elements without a class by using :not attribute.
This is our sample 'div' of elements:

<div class="intro__card__container">
    <div class="ic--card off" id="pic1"><img alt="Image1" src="/images/landing/intro/image1.jpg" class="ic--image"></div>
    <div class="ic--card off" id="pic2"><img alt="Image2" src="/images/landing/intro/image2.jpg" class="ic--image"></div>
    <div class="ic--card off" id="pic3"><img alt="Image3" src="/images/landing/intro/image3.jpg" class="ic--image"></div>
    <div class="ic--card" id="pic4"><img alt="Image4" src="/images/landing/intro/image4.jpg" class="ic--image"></div>
    <div class="ic--card off" id="pic5"><img alt="Image5" src="/images/landing/intro/image5.jpg" class="ic--image"></div>
    <div class="ic--card off" id="pic6"><img alt="Image6" src="/images/landing/intro/image6.jpg" class="ic--image"></div>
    <div class="ic--card" id="pic7"><img alt="Image7" src="/images/landing/intro/image7.jpg" class="ic--image"></div>
    <div class="ic--card off" id="pic8"><img alt="Image8" src="/images/landing/intro/image8.jpg" class="ic--image"></div>
    <div class="ic--card off" id="pic9"><img alt="Image9" src="/images/landing/intro/image9.jpg" class="ic--image"></div>
    <div class="ic--card off" id="pic10"><img alt="Image10" src="/images/landing/intro/image10.jpg" class="ic--image"></div>
</div>

I am using this selector ".ic--card:not('.off')" to select elements without 'off' class. It works for jQuery but doesn't valid in Selenium test. So how can I select elements without '.off' class?

like image 938
Huy Do Avatar asked Feb 08 '23 19:02

Huy Do


2 Answers

Ok - looking at this again ".ic--card:not('.off')" the 's around .off are not a valid css selector since .off would not be quoted as a class selector. Using

find(".ic--card:not(.off)")  

should work fine

like image 170
Thomas Walpole Avatar answered Feb 20 '23 03:02

Thomas Walpole


You can use:

  1. css:

    find("div[class='ic--card']")

  2. xpath:

    find("//div[contains(@class,'ic--card') and not(contains(@class,'off'))]")

like image 23
Sarunya Durai Avatar answered Feb 20 '23 02:02

Sarunya Durai