How to get and store the xpath of an element based on the class name in Katalon Recorder

Hi,

I’m trying to find the location of an element in the DOM based on a class name. I don’t know exactly how to do that.

There my element in the dom:

<div class="mat-calendar-body-cell-content mat-focus-indicator mat-calendar-body-today"> 8 </div>

I would like to get the xpath (and store it in a variable) of this element based on the class name containing mat-calendar-body-today.

Could you please help me with that ?

Thank you in advance

//*[contains(@class, 'mat-calendar-body-today')]

@amadese Edit, you can use “@” for the element’s attributes. For example, let’s say you want to get an element by its exact id: //div[@id='theElementId']

1 Like

Dear @Oli Thanks for your help.
This element is located in a table:
image

I would like to retrieve the complete xpath of this element in order to get the next element in the table (for clicking on this cell in my test).

Do you have an idea on how to proceed for doing that ?

Is it an actual Table element? Iv’e never tested calenders, but I can provide an example to work around a table

Start with this and customize it (it wasn’t designed for a calender)

// Get the Table as a Selenium WebElement by its xpath:
WebElement Table = driver.findElement(By.xpath("yourTableXpathHere"))
// Get all rows of the table
List<WebElement> rows = Table.findElements(By.tagName('tr'))
int nbOfRows = rows.size()

if (nbOfRows < 1) {
	KeywordUtil.markFailedAndStop('There are no rows to test with. Ending the test.')
}

String valueFound = null;

// Go through each row of the Table to find the wanted one
int i = 0;
while (i < nbOfRows && valueFound == null) {
	// Getting the columns in the current row
	List<WebElement> columnsOfCurrentRow = rows.get(i).findElements(By.tagName('td'))
	int columnsCount = columnsOfCurrentRow.size()

    // Loop the columns of the current row
    for (int column = 0; column < columnsCount; column++) {
	    Retrieve text from the current column
		String columnText = columnsOfCurrentRow.get(column).getText()
        // Here, you could click the cell if you wanted to.
    }
	i++
}

Here are all my imports (you won’t need them all):


import org.openqa.selenium.By
import org.openqa.selenium.WebDriver as WebDriver

import com.kms.katalon.core.testobject.ConditionType
import com.kms.katalon.core.testobject.TestObject as TO
import com.kms.katalon.core.util.KeywordUtil
import com.kms.katalon.core.webui.driver.DriverFactory
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI

import internal.GlobalVariable as GlobalVariable
import org.openqa.selenium.WebElement as WebElement

import com.kms.katalon.core.model.FailureHandling as FailureHandling
import org.openqa.selenium.interactions.Actions
import com.kms.katalon.core.webui.common.WebUiCommonHelper

Dear @Oli ,

Thanks for your help, The component that I used is the calendar (datepicker). As the calendar change in fonction of the month, I would like to select the day after (the cell in the table if it exists).
I don’t possess Katalon Studio. I have only Katalon Recorder . I don’t know if I can use your script with the tool (perhaps with the Extension Script section ?).
I’m trying with KR:

  1. get the day of today
  2. save the path in a variable corresponding to the day number
  3. take the next cell in the table corresponding to day after (if it exists, otherwise pass to the next row or next month)

I tried to create a js file with the following function and import it (as extension script) into KR:

Selenium.prototype.getDomElementPath = function(el) {
  var stack = [];
  console.log("la");
  while ( el.parentNode != null ) {
    console.log(el.nodeName);
    var sibCount = 0;
    var sibIndex = 0;
    for ( var i = 0; i < el.parentNode.childNodes.length; i++ ) {
      var sib = el.parentNode.childNodes[i];
      if ( sib.nodeName == el.nodeName ) {
        if ( sib === el ) {
          sibIndex = sibCount;
        }
        sibCount++;
      }
    }
    if ( el.hasAttribute('id') && el.id != '' ) {
      stack.unshift(el.nodeName.toLowerCase() + '#' + el.id);
    } else if ( sibCount > 1 ) {
      stack.unshift(el.nodeName.toLowerCase() + ':eq(' + sibIndex + ')');
    } else {
      stack.unshift(el.nodeName.toLowerCase());
    }
    el = el.parentNode;
  }

  return stack.slice(1); // removes the html element
}

image

And I tried to call :


but it’s not working and I get an error in the console:

Hello!

My apologies, I can’t help you with a calender and with Katalon Recorder, as I’ve never tested both! Good luck though :slight_smile: