Finding CSS selector path for Selenium C#

Question

I am new to Selenium C# automation. Tried finding on web but did not get any help. The html code looks like this. I need to find the element and then click it using CSS. The site only runs on IE.

    <tbody>
    <tr class="t-state-selected">
    <td>Purchased</td>
    <td class="">768990192</td>

It's unclear what you're asking. The html you've presented has no clickable elements. Also do you mean that you have to click an element based on the css attribute? Present more html and the code you've got so far. — Kent Kostelac, Nov 20 '17 at 01:06
@KentKostelac The table data is clickable, check screenshot. Adding a screenshot of how it looks. https://imgur.com/a/no7hA — Aruba, Nov 20 '17 at 01:15
@DebanjanB yes the whole row is clickable. HTML code snippet is here https://codeshare.io/5OWRgx — Aruba, Nov 20 '17 at 01:54
@Aruba You are not answering my question, Click on which element? `Purchased` or `768990192`? — undetected Selenium, Nov 20 '17 at 02:31

score 1 · Accepted Answer · answered Nov 20 '17 at 03:03

I know web links can disappear, but here are a few I use when trying to figure out how to locate elements using Selenium's C# WebDriver:

https://automatetheplanet.com/selenium-webdriver-locators-cheat-sheet/

https://saucelabs.com/resources/articles/selenium-tips-css-selectors

https://www.packtpub.com/mapt/book/web_development/9781849515740/1

The bottom line is that you're selecting by id, class, or XPath. Each of these can be tested directly on the page using the F12 browser tools. For example, to find the first comment on your question above, you could try this in the console:

$x("//div[@id='mainbar']//tbody[@class='js-comments-list']/tr")

Here's another SO post with a quick and dirty answer.

And here is the official documentation from Selenium on how to locate UI elements.

undetected Selenium · Answer 2 · 2017-11-20T04:24:46.197

1

To click on the number 768990192 which is dynamic we have to construct a CssSelector as follows :

driver.FindElement(By.CssSelector("tr.t-state-selected td:nth-of-type(2)")).Click();

edited Nov 20 '17 at 04:24

answered Nov 20 '17 at 03:18

undetected Selenium

183,867
41
278
352

score 0 · Answer 3 · answered Nov 20 '17 at 01:23

0

You're really not giving us much info to work. I will try my best to accommodate. Even though the presented HTML is not enough to give an indication of the format and you've not presented any code of your current solution.

string url = "https://www.google.com";
IWebDriver driver = new InternetExplorerDriver();
driver.Navigate().GoToUrl(url);
driver.FindElement(By.XPath("//tr[@class='t-state-selected']")).Click();

This little code snippet.

Creates a internet explorer driver.

Goes to the url of your choice.

And then clicks the table row that has a class that equals "t-state-selected'. Which my guess is all or none of the table rows.

answered Nov 20 '17 at 01:23

Kent Kostelac

2,257
3
29
42

I am ok with driver and other code. My test steps take me to this test page where the data is displayed in table format. Now I need to click the table data. Here I will have to use CSS selector. I am not able to figure out the CSS path. https://codeshare.io/G7PEwD – Aruba Nov 20 '17 at 01:28
The only CSS selector you've given us so far is the class='t-state-selected' Am I suppose to bruteforce your CSS files? Do some work yourself and at least show us the code you've gotten so far. – Kent Kostelac Nov 20 '17 at 01:31
This is what I have tried till now. https://codeshare.io/5PBRvw I am new to CSS. – Aruba Nov 20 '17 at 01:36

Finding CSS selector path for Selenium C#

3 Answers3

Linked