How to do when css paths are not recognized?

[jeremie.pichot]

Hello,
My problem is that I often encounter problems when a click is not recognized DOM. Katalon allows us to use Xpath, Attribute, and CSS with object repository. But it often happens that none of his method works.
Can you help me?

I have tried to create my own method ‘click’ taking the path css, but again this is perfectible, much less than the XPath, but it takes only once for the run.

1- Here’s what I use in Object Repository:

package fr.stago
import static com.kms.katalon.core.checkpoint.CheckpointFactory.findCheckpoint
import static com.kms.katalon.core.testcase.TestCaseFactory.findTestCase
import static com.kms.katalon.core.testdata.TestDataFactory.findTestData
import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject

import com.kms.katalon.core.annotation.Keyword
import com.kms.katalon.core.checkpoint.Checkpoint
import com.kms.katalon.core.checkpoint.CheckpointFactory
import com.kms.katalon.core.mobile.keyword.MobileBuiltInKeywords
import com.kms.katalon.core.model.FailureHandling
import com.kms.katalon.core.testcase.TestCase
import com.kms.katalon.core.testcase.TestCaseFactory
import com.kms.katalon.core.testdata.TestData
import com.kms.katalon.core.testdata.TestDataFactory
import com.kms.katalon.core.testobject.ObjectRepository
import com.kms.katalon.core.testobject.TestObject
import com.kms.katalon.core.webservice.keyword.WSBuiltInKeywords
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords

import internal.GlobalVariable

import MobileBuiltInKeywords as Mobile
import WSBuiltInKeywords as WS
import WebUiBuiltInKeywords as WebUI

import org.openqa.selenium.WebElement
import org.openqa.selenium.WebDriver
import org.openqa.selenium.By

import com.kms.katalon.core.mobile.keyword.internal.MobileDriverFactory
import com.kms.katalon.core.webui.driver.DriverFactory

import com.kms.katalon.core.testobject.RequestObject
import com.kms.katalon.core.testobject.ResponseObject
import com.kms.katalon.core.testobject.ConditionType
import com.kms.katalon.core.testobject.TestObjectProperty

import com.kms.katalon.core.mobile.helper.MobileElementCommonHelper
import com.kms.katalon.core.util.KeywordUtil

import com.kms.katalon.core.webui.exception.WebElementNotFoundException

import com.kms.katalon.core.testobject.SelectorMethod;
import com.kms.katalon.core.webui.common.XPathBuilder

class dmv9 {
@Keyword
def static click (String selector) {
click (getWebElement (selector))
}
@Keyword
def static getWebElement (String selector) {
TestObject webElement = new TestObject ()
webElement.addProperty (‘css’, ConditionType.EQUALS, selector)
return webElement
}
@Keyword
def static click (TestObject webElement) {
WebUI.waitForPageLoad (GlobalVariable.TimeOut)
WebUI.waitForElementPresent (webElement, GlobalVariable.TimeOut)
WebUI.waitForElementVisible (webElement, GlobalVariable.TimeOut)
WebUI.waitForElementClickable (webElement, GlobalVariable.TimeOut)
}
}

2- And here is my call in a test case:

CustomKeywords.'fr.stago.dmv9.click ‘(’ # btn-add-profile> button> div.mat-button-ripple.mat-ripple ')

3- The test passes but the click is not executed

Do you have any ideas, please.

[Russ_Thomas]

I don’t see any evidence that the button element you highlighted has id="btn-add-profile" - that could be your problem.

Also, remove the extraneous spaces from this:

CustomKeywords.'fr.stago.dmv9.click '(' # btn-add-profile> button> div.mat-button-ripple.mat-ripple ')

an ID looks like this: #some-id not like this: # some-id

[jeremie.pichot]

Thank you for your reply,

But there is no space in my line:
CustomKeywords.'fr.stago.dmv9.click ‘(’ # btn-add-profile> button> div.mat-button-ripple.mat-ripple ')

I finally replaced it like this:
dmv9.click (“#btn-add-profile> button> div.mat-button-ripple.mat-ripple”)

But still without much success.

1. I also modify the 3rd Custom Keyword “toClick” :
   

   

2. I give you the test case
   

   

3. Here are the messages from the console

   
   
   there is an error on point 10 because the test n ° 9 did not work, despite that Katalon passes it in green.

[Russ_Thomas]

Try this:

String js = "document.querySelector('#btn-add-profile>button').click();"
WebUI.executeJavaScript(js, null)

Also try document.querySelector('#btn-add-profile>button').click() in the browser console.

[jeremie.pichot]

Thank you Russ_Thomas,
Your code worked well.

String js = “document.querySelector (‘# btn-add-profile’). Click ();”
WebUI.executeJavaScript (js, null)

I think it works because we ask him to click () on the ID.
I had not seen Friday.

Can i ask you something else, please ?

On the same type of case:

There is no ID in the DOM.
I can click on the element in the browser console, but not in Katalon, and yet I have the same method WebUI.executeJavasScript ()

do you have an idea ?

Thank you:grinning:

[Russ_Thomas]

Jeremie, this would be better posted as a separate topic because we have solved your original problem - when people search for similar problems, they want to see one question with one answer (not two or three questions with different answers). That said…

Your error is that the JavaScript raised an error and WebUI collected the error and failed the test step.

JavaScript cannot call null.click() <== that is the issue.

This means your CSS selector is not working. I took a quick look at your CSS and I don’t see how nth-child(4) is helping here. Firstly, the mat-nav-list element shown in your HTML dump is the THIRD sibling… so right off, this CSS is probably broken.

Try this line on your browser console - but be aware, since I cannot see ALL the HTML, I can’t be sure this will work yet…

document.querySelector('mat-sidenav mat-nav-list > a').click()

If that works, do this:

String js = "document.querySelector('mat-sidenav mat-nav-list > a').click();"
WebUI.executeJavaScript(js, null)