Katalon Recorder, get CSS selector by attribute

Product Forums Katalon Recorder
,
1

Hi,

I use Katalon Recorder (Selenium tests generator) chrome extension.

I’ve put data-e2e="identifier" in my HTML elements, but the problem is that css selector doesn’t use that custom attribut.

screenshot
screenshot1293×451 60.3 KB

How can I solve/reach that ?

Thanks by advance.

1 Like
2

I found the solution according to the documentation : Extension Scripts for Custom Locator Builders and Actions in Katalon Recorder | Katalon Docs

So I made the following code :

// Usage: Add this to Extension Scripts, restart Katalon Recorder, and refresh the browser tab
LocatorBuilders.add('data-e2e', element => {
  const data_e2e = element.getAttribute("data-e2e");
  if(data_e2e) {
    return `css=[data-e2e='${data_e2e}']`;
  }
  return null;
});

// built-in locators: "id", "link", "name", "dom:name", "xpath:link", "xpath:img", "xpath:attributes", "xpath:idRelative", "xpath:href", "dom:index", "xpath:position", "css"
LocatorBuilders._preferredOrder = ['data-e2e', 'css'];
// Change the default order to preferredOrder
LocatorBuilders._orderChanged();
1 Like