How to Highlight Test object in each and every step


#1

Hi,

I have created a keyword to highlight testobject. Please tell me how to call this keyword globally in such a way that it should highlight testobject of each step during test case execution

public class HighlightElement {

static WebDriver driver = DriverFactory.getWebDriver()

@Keyword
  
public static void HighlightObject(TestObject objectto) {
	try {
		WebElement element = WebUiCommonHelper.findWebElement(objectto, 20);
		for (int i = 0; i < 5; i++) {
			JavascriptExecutor js = (JavascriptExecutor) driver;
			js.executeScript("arguments[0].setAttribute('style','background: yellow; border: 2px solid red;');",
					element);
		}
	} catch (Exception e) {
		Assert.fail(e.getMessage());
	}
}

}


How to highlight an element on the webpage?
#2

Hi @nikhil.nareddy

Couple things I’d suggest:

1 - don’t use background and border properties, use the outline property instead:


The outline property doesn’t “disturb” the UI layout (hardly at all).

2 - Use the WebUI.executeJavaScript API, your code will be much more readable (and shorter, and easier to maintain)

As to your question, just import you keyword class statically and call it before any step you need it:

import static your_keywords_class_file.*
...
HighlightObject(...)
WebUI.Click(...)

#3

Is there a way NOT to call it every time but automatically or once at the beginning of test case and so to apply it for every action/object?


#4

Yes, actually there is. But it’s beyond my time available to describe here (and honestly, I’d probably mess it up). It involves some deep(er) understanding of Groovy metaprogramming functionality.

Read up on InvokeMethod, if you really want to do this.

http://docs.groovy-lang.org/latest/html/documentation/#_metaprogramming


#5

I like this question. I would try to find a solution.


#6

I have got a success. Have a look at this demo project and try it.

You can see the demo movie here: https://kazurayam.github.io/HighlightingElementByTestObjectInEachAndEveryStep/

To @nikhil.nareddy
Thank you for your hint.


HighlightElement keyword makes your presentation more attractive
#7

Hi @kazurayam,

Great work. Could you please give the code and where to use it in script


#8

Please get access to my Github project

You can download the zip file from https://github.com/kazurayam/HighlightingElementByTestObjectInEachAndEveryStep/releases


#9

Thanks alot


#10

Thanks for the info @Russ_Thomas


#11

Wow, this is a big thing. My code will be now much shorter from now on…
Thanks!


#12

Thank you @kazurayam - awesome work as usual. I think we can incorporate this as a built-in keyword to assist scripting.


#13

It is. Awesomeness and beyond.

We need a new level just for @kazurayam. How about “Katalon King” ? :crown:


#14

There are 2 reasons why I could perform this trick.

  1. The most part of the Katalon Studio’s source code is disclosed now. See Katalon Studio's built-in Keywords is now open source for community contribution
  2. I have learned how to apply Groovy’s meta-programming technique to Katalon Studio. Now I can make patches to Katalon Studio runtime. I can try anything without waiting for Katalon Team to change the original source and release a new version. See How to write Katalon Studio tests with IntelliJ IDEA and other IDEs

So I would like to say:

  1. I support the idea of making Katalon Studio to be more open sourced
  2. Choosing Groovy language, rather than Java, for Katalon Studio was a good design decision.

#15

Yes, I get that. But seriously, I don’t know where you find the time.

+100 :sunglasses:


#16

Shhhhhhhh!


#17

Well, I think that the feature of highlighting HTML elements is useful for making the videos for tutorials. Also for lightning talks and presentations at meet-up events for audiences.


#18

That’s exactly what I use it for. In another app I work on, I use it when I’ve turned on a debugging layer so that targeted elements have various outlines (colors) left behind like a “trail” of where the code has been.


#19

Good work. Thank a lot!


#20

Awesome work.