If I have the following HTML:
<tbody id="items">
<tr><td>Item 1</td></tr>
<tr><td>Item 2</td></tr>
<tr><td>Item 3</td></tr>
<tr><td>Item 4</td></tr>
<tr><td>Item 5</td></tr>
<tr><td>Item 6</td></tr>
</tbody>
How would I use CSS selectors with Selenium to access Item 4(or really any item I wanted)?
You can use nth-child selector:
#items tr:nth-child(4) {color:#F00;}
Live example: https://jsfiddle.net/7ow15mv2/1/
But no idea if it works with Selenium.
But according to docs it should.
Currently the css selector locator supports all css1, css2 and css3 selectors except namespace in css3, some pseudo classes(:nth-of-type, :nth-last-of-type, :first-of-type, :last-of-type, :only-of-type, :visited, :hover, :active, :focus, :indeterminate) and pseudo elements(::first-line, ::first-letter, ::selection, ::before, ::after).
:nth-child() selector zero-based? (My understanding is that the fourth row would be :nth:child(3), though I could very definitely be completely wrong.)
you can try this for searching by any inner text
css=td:contains('Item 4')
found this helpful: http://saucelabs.com/blog/index.php/2010/01/selenium-totw-css-selectors-in-selenium-demystified/
Do you want to select by content ("Item 4")? By Position (the 4st row)? Or is <tr id="foo"> and selecting
tr#foo>td
an option?
You could use xpath to find it in a number of different ways but the easiest is:
//td[text()='Item 4']
selenium.getText("css=table>tbody[id=items]>tr:nth-child(3)>td(3)");
