Adding an attribute to web element

Hi everyone,

I have the following, quite simple TC:

WebUI.openBrowser('')
WebUI.navigateToUrl('https://www.google.pl/imghp')
WebUI.setText(findTestObject('Page_Grafika Google/input_searchField'), 'katalon')
WebUI.click(findTestObject('Page_Grafika Google/goSearch'))
WebUI.sendKeys(findTestObject(null), Keys.chord(Keys.PAGE_DOWN))

When I scroll down the page, there is a google search bar on the top. It covers the top part of the page.


I can spy it, it is something like this:

WebUI.click(findTestObject('Page_katalon  Szukaj wGoogle/header_gbar'))

In browser’s devtools I can add an attribute:

style="display:none"

and this bar is not displayed anymore and stops covering the page:

My question is: Is there a way to do this in Katalon Studio? Can I add this attribute somehow in the script view? I don’t want to see a specific element, but I can’t disable it in Katalon.

Thanks in advance :grinning:

If you have a CSS selector for that element, do this:

String js = "document.querySelector('your-selector').style.display = 'none';"
WebUI.executeJavaScript(js, null)

For example, this will remove the navigation bar at the top of this web page:

String js = "document.querySelector('#bar').style.display = 'none';"
WebUI.executeJavaScript(js, null)

However, be warned, modifying a web page for the purpose of testing it is generally a bad idea.

Yay, it works :smiley:
Thanks for the solution. For that google-image-search the proper selector is #kO001e. After JS exection that bar disappears :smiley:

However, be warned, modifying a web page for the purpose of testing it is generally a bad idea .

Yes, that’s right. I needed that not exactly for testing but for learning. Thanks again.

1 Like