How to use multiple CSS locators as a selenium locator?

Question

I'm trying to hit a link in a table-row that contains multiple links. This pattern is used throughout the table.

This works:

browser.wait_for(:element => "css=tr:nth-child(1) li:nth-child(2) > a")

This does not:

browser.click "css=tr:nth-child(1) li:nth-child(2) > a"

Any ideas why this might be? I'm using the selenium-client rubygem.

Answer 1

I suspect this is due to a bug in cssQuery, which Selenium currently uses to locate elements by CSS. Details of the issue and a patch can be found in the comments of the following issue: http://jira.openqa.org/browse/SEL-698

Hope that helps - I believe Selenium 2 will be using a different library for CSS locators - possibly JQuery's Sizzle (http://sizzlejs.com/), which should solve this problem.

Dave.

Answer 2

To avoid painful CSS issues like this, I've installed jQuery as a user extension. It gives the ability to define a locator String similar to CSS ("jquery=td.dt-col-status div.dt-liner:contains('Complete')") that is much more powerful. I can expand on how I did it for the Java RC if you'd like.

Answer 3

This is a bug in selenium 1 I would try writing out the entire path in your css path and see if that helps.

ex if you are using the following html you can use the following css locator

    <table>
        <tr>
            <td>
                <li>
                    <a href="/yourlink" >

                </li>
            </td>
        </tr>
    </table>
    

"css=tr:nth-child(1) > td > li:nth-child(2) > a"

If that doesn't work you can always use xpath. It's just as expressive as CSS locators but tends to have fewer glitches. The only thing you have to keep in mind when using xpaths is that they are generally slower than css locators.

"xpath=//tr/td//li[2]/a"