How can I count the number of elements that match my CSS selector?

Question

I am trying to use SeleniumRC to test my GWT App and am trying to match elements using CSS selectors.

I want to count the number of enabled buttons in the following HTML.

A button is enabled if it is under a <td> with class="x-panel-btn-td " and disabled if it is under a <td> with class="x-panel-btn-td x-hide-offsets".

So basically, I want to retrieve the number of buttons under all <td>s with the class x-panel-btn-td.

<table cellspacing="0">
    <tbody>
    <tr>
        <td id="ext-gen3504" class="x-panel-btn-td ">
            <em unselectable="on">
                <button id="ext-gen3506" class="x-btn-text" type="button">OK</button>
            </em>
        </td>
        <td id="ext-gen3512" class="x-panel-btn-td x-hide-offsets">
            <em unselectable="on">
                <button id="ext-gen3506" class="x-btn-text" type="button">Yes</button>
            </em>
        </td>
        <td id="ext-gen3520" class="x-panel-btn-td">
            <em unselectable="on">
                <button id="ext-gen3506" class="x-btn-text" type="button">No</button>
            </em>
        </td>
        <td id="ext-gen3528" class="x-panel-btn-td x-hide-offsets">
            <em unselectable="on">
                <button id="ext-gen3506" class="x-btn-text" type="button">Cancel</button>
            </em>
        </td>
    </tr>
    </tbody>
</table>

FYI, please scroll down to see my answer if you are looking for the Webdriver equivalent — HRVHackers, Apr 19 '14 at 04:15

score 15 · Accepted Answer · answered Oct 15 '09 at 15:56

15

As far as I am aware you can't do this using CSS selectors, but there is a command in Selenium for counting by XPath. The following command will verify there are two disabled buttons:

verifyXpathCount | //td[contains(@class, 'x-hide-offsets')]//button | 2

In Selenium RC (Java) this would look more like

assertEquals(selenium.getXpathCount("//td[contains(@class, 'x-hide-offsets')]//button"), 2);

answered Oct 15 '09 at 15:56

Dave Hunt

8,191
4
38
39

Accepting this as answer because this is more straight forward in selenium terms. – Nirmal Patel Oct 21 '09 at 09:02
1

Useful, but the original title was asking for CSS equivalent, not XPath. – David Feb 28 '12 at 00:54

score 14 · Answer 2 · answered Jan 11 '14 at 04:37

This is now also implemented (without any extra Javascript magic needed) in Selenium Webdriver API Since google still links to this question as a top result, even though Selenium RC has been replaced by Webdriver, hopefully this saves someone time.

Example java code:

int locatorElementSize = driver.findElements(By.cssSelector("yourCSSLocator")).size();

score 8 · Answer 3 · answered Aug 31 '11 at 18:24

8

With newer versions of Selenium, there is a function GetCSSCount(string locator). Just thought an update to this question would be useful

answered Aug 31 '11 at 18:24

Raidil142

137
1
10

Anyone know which versions of Selenium in particular offer this? And in SElenium RC and WebDriver? Or WebDriver only? – David Feb 28 '12 at 00:01
Also, forgot to ask earlier, which versions of Selenium in terms of the server JAR, client code bindings, and/or the IDE. – David Feb 28 '12 at 00:12

score 2 · Answer 4 · edited Oct 19 '11 at 12:33

2

This should be relatively simple. You can do it multiple ways but I would suggest using the getEval(...) in DefaultSelenium.

Write some JavaScript that:

gets all elements by id: ext-gen3506
iterates through all elements and checks to see if it's enabled
if it's enabled, increment a count
"return" the count.

Generally, getEval(...) will return the value of the last statement that ran... so that should give you the count.

edited Oct 19 '11 at 12:33

Jason Plank

2,336
5
31
40

answered Oct 15 '09 at 15:54

vinnybad

2,102
3
19
29

the buttons wouldnt have same id... (i copy pasted tht button tag and hence the same id displayed in the code snippet. my bad.) I should get all elements of type button. – Nirmal Patel Oct 15 '09 at 21:52

score 2 · Answer 5 · answered Jul 18 '11 at 08:46

2

Since Selenium is part of Firefox and the latter is supporting Selectors API one could simplify counting matches of a CSS locator using a test like this:

verifyEval | window.document.querySelectorAll("your#css > selector.here").length | 4

In this example count is verified to be 4, of course.

answered Jul 18 '11 at 08:46

soletan

431
2
4
14

Does this work for other browsers like IE? We'd ideally want a cross browser solution. – David Feb 27 '12 at 23:57
one thing to note about this method, unlike regular Selenium RC API commands, you omit "css=" as prefix for the locator. – David Feb 28 '12 at 01:22
Thanks @soletan. Good to know that compatibility matrix. – David Mar 16 '12 at 00:30

score 0 · Answer 6 · edited Sep 04 '13 at 11:30

0

Here's another solution, using javascript, similar to post about Selector API / window.document.querySelectorAll:

http://blog.eviltester.com/2010/03/a-simple-getcsscount-helper-method-for-use-with-selenium-rc.html

edited Sep 04 '13 at 11:30

meze

14,975
4
47
52

answered Feb 28 '12 at 00:56

David

3,223
3
29
41

How can I count the number of elements that match my CSS selector?

6 Answers6

Linked