Issue in verifying Tab Navigation Order of a website

Web Testing
1

Hi,

I am doing some WebUI testing with katalong studio v9.6.0
But i am facing issue in verifyign the tab navigation order of website.
Steps which i want to do:

  1. Open a site
  2. Press TAB key and verify the focused element.
  3. Again press the TAB key and verify the 2nd focused element.

I am opening the site with the open browser keyword and then i have added the below step
WebUI.sendKeys(Body_ob, Keys.chord(Keys.TAB))

I’m not what to provide in place of the Body_obj test object.

Pls help me to verify the Focused element using TAB key and the TAB navigation order.

Thanks in advance!

Regards,
Hritik

2

Hi there,

Thank you very much for your topic. Please note that it may take a little while before a member of our community or from Katalon team responds to you.

Thanks!

3

@hritik I would be glad to learn more about your requirements. Could you please provide further details so we can assist you more effectively?

4

I have added the step. You can pick any website lets say www.google.com
Then press TAB button and get the Focused Element.
Again press the TAB button and get the Focused Element.
So there’s always an order for the TAB navigation.

this is my requirement…

5

Looks like two parts are needed - the first is to tab and the second is to verify the element in focus. There are a couple of posts that tell you how to do each step:
Part 1: tab without providing a test object, using Robot: Clicking tab once the page loads through katalon command - #11 by hemant.mishra.extern
Part 2: verify that your expected focus is correct: Focus verification - #3 by kazurayam

6

Also you may need to get some of your object’s attributes so you can compare with,
attribId = element.getAttribute('id')

or/and

attribClass = element.getAttribute('class')

Maybe with the above, as well as the tag, you could “build” a pathway to the object and have it “flash”, if there is no outward indication of which element you “tabbed” to.

Maybe: 
	/**
	 * Put a highlight around the Web Element
	 * @param to = our web element
	 */
	@Keyword
	public static highlightElement(WebElement element){
		try {
			WebUI.executeJavaScript("arguments[0].setAttribute('style', 'background: yellow; border: 2px solid red;');", Arrays.asList(element))
			WebUI.delay(0.5)
			WebUI.executeJavaScript("arguments[0].setAttribute('style','border: solid 2px white');", Arrays.asList(element))
		} catch (Exception) {
			WebUI.comment("Could not find 'element'")
		}
	}