Dynamically Generate CSS Selector From Table Value

Question

We have a website that is built upon a ton of tables. Each cell within the rows is clickable. I am working on a way to dynamically build the cssSelector info by providing the table name and value I want to click on. I am getting close (I think).

Using the practice table at ToolsQA, say I want to build the cssSelector for the value "Taiwan".

It's cssSelector is: .tsc_table_s13 > tbody:nth-child(4) > tr:nth-child(3) > td:nth-child(2)

I am iterating through the table and have successfully been able to enter the cell using the value ("Taiwan") I specified, however, I'm not sure how to get the value of the row and column it is currently on.

Here is the code I am using so far:

driver.get("http://toolsqa.com/automation-practice-table/");

String table = ".tsc_table_s13 > tbody:nth-child(4)";
String cellValue = "Taiwan";

getCell(table, cellValue);

    // Get the cell of a particular value
    public static void getCell(String table, String value) throws IOException{

        // Grab the table 
        WebElement tableName = driver.findElement(By.cssSelector(table)); 

        // Now get all the TR elements from the table 
        List<WebElement> allRows = tableName.findElements(By.tagName("tr")); 

        // And iterate over them, getting the cells 
        for (WebElement row : allRows) { 
            List<WebElement> cells = row.findElements(By.tagName("td")); 

            // Print the contents of each cell
            for (WebElement cell : cells) {
//              System.out.println(cell.getText());
                if (cell.getText().equals(value))
                {
                    String cellValue = table + " > tr:nth-child(" + row. + ") > td:nth-child(" + cell + ")";
                    System.out.println(cellValue);

                } // end if text equals

            } // end for loop for cells
        } // end for loop for all rows

    } // end getCell function

Please post the code as code instead of a screenshot. It makes it easier to read and we can copy/paste, if needed. — JeffC
– JeffC, Commented Jun 30, 2016 at 15:25
Would you please explain why you are trying to dynamically generate a CSS selector? If you find the text you want, you then have the element you are looking for. Why generate a CSS selector to find an element you've already found? Or is this just an exercise or ? — JeffC
– JeffC, Commented Jun 30, 2016 at 15:54
Once I find that element, how would I click on it then? That's really what the end goal is. I am hoping to be able to provide an easy and efficient way to basically specify the table and the value within the table I want clicked and then click it. — Dustin N.
– Dustin N., Commented Jun 30, 2016 at 15:56
OK. That's what I wanted to hear. Give me a minute and I'll post an answer that I think will simplify your process and the code. — JeffC
– JeffC, Commented Jun 30, 2016 at 15:57

JeffC · Accepted Answer · 2016-06-30 16:07:49Z

So here's a quick example of how you can use XPath to find text in a table and get a reference to the element. You provide the text to search for and it gets inserted into an XPath. That XPath below, searches for a TD that contains that text. This is just a simple case. If you have a lot of repetitive text in your table, you'll have to post some examples so that I can update the code to take that into account.

String searchText = "China";
driver.get("http://toolsqa.com/automation-practice-table/");
WebElement e = driver.findElement(By.xpath("//td[text()='" + searchText + "']"));
System.out.println(e.getText()); // you can get the text in the cell
System.out.println(e.getAttribute("outerHTML")); // you can get the HTML of the TD
e.click(); // you can click the element also but in this case it won't do anything since it's just a TD with text

Collectives™ on Stack Overflow

Dynamically Generate CSS Selector From Table Value

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related