Selection Methods for Web Tests

This article guides you through choosing different strategies to locate WebUI objects in Katalon Studio.

Configure Test Design

To set the default selection method used in the Spy/Recorder of a project, do as follows:

  1. Open Katalon Studio, then go to:

  • From 7.6.0 backward: Project > Settings > Test Design > Web Locators.

  • From 7.6.0 onwards: Project > Settings > Test Design > Web UI.

    web UI settings

  1. Under the line Default element locator value of test objects generated by Recorder or Spy, select one of these provided options:

    • XPath: Once a test object is captured using Spy/Recorder, a set of XPath locators is generated. The first value is the object's default XPath locator.
    • Attributes
    • CSS
    • Image

  2. If you choose XPath or Attributes, you need to configure additional settings. To learn more, see below:

Configure XPath

You can prioritize XPath locators by dragging and dropping the XPath locators list. To locate the elements, Katalon Studio uses the first XPath as default. If the default XPath fails, the remaining XPaths of the list are leveraged to locate the element.

To return to the default order, click Reset Default.

Below is a list of XPath capture strategies:

XPath capture strategy

Description

Example

xpath:link

Build XPath locators for the link element.

//a[contains(text(), 'Katalon Studio')]

xpath:img

Build XPath locators for the image element.

//img[@alt="Katalon logo"]

xpath:attributes

Build XPath locators based on the tag name and attributes of the selected element.


There are 5 preferred attributes to build element locators: ['id', 'name', 'value', 'type', 'action', 'onclick'].


If the element has more than one of those attributes, the locator combines the attributes with an operator.

//div[@id="search"]

//select[@id="cars" and @name="cars"]

//input[@type="submit" and @value="Submit"]

xpath:customAttributes

Build XPath locators based on the tag name and attributes of the selected element. The XPath value combines one or more attributes of all default and customized attributes. (Available from version 8.2.5)

//<tagname>[@id='1234' and @custom1 = 'a1' and @custom2 = 'a2' and @custom3 = 'a3' and @custom4 = 'a4']

//div[@id="search" and @custom1 = 'a1']

//select[@id="cars" and @name="cars" and @custom1 = 'a1' and @custom2 = 'a2']

//input[@type="submit" and @value="Submit" and @custom2 = 'a2' and @custom3 = 'a3' and @custom4 = 'a4']

xpath:idRelative

Build relative XPath locators from the nearest parent that has id attributes.

//div[@id="search"]/a

//select[@id="cars"]/div/div[2]/input[@type="submit"]

xpath:href

Build XPath locators of an element that has href attributes and matches or contains a given value.

//a[@href='https://katalon.com']

//a[contains(@href, 'katalon')]

xpath:position

Build absolute XPath locators of a selected element.

/html/body/div[1]/div[1]/div/div[3]/div[2]/div

/html/body/section/div/div[2]/div[5]/div[2]/div/div/div[2]/table/tbody/tr[13]/td[1]/div/a/span[3]/span

xpath:neighbor

Build XPath locator based on the more robust neighbors of the selected element.

(.//*[normalize-space(text()) and normalize-space(.)=’How AI can save our humanity’])[2]/preceding::div[3]

dom:name

Build XPath locator based on DOM (Document Object Model). This applies only to elements within a named form.

"document.forms["home"].elements["userName"]"

Configure Attributes

You can select the attributes used for detecting an object.

  • To return to the default setting, click Reset Default.
  • To add new attributes, click Add.
  • To delete an attributes, select the attributes and click Delete.
  • To delete all attributes, click Clear.
configure attribute

Switch Selection Method in an object view

In an object view, you can switch from one selection method to another. The detailed content of each selection method is saved automatically.

attributes
  • Selection Method: Choose an object locating strategy among XPath, Attributes, CSS, or Image.
  • Selected Locator: Input the desired XPath or CSS locator manually.
  • Object's Properties: Check only the preferred properties of an object.

XPath

object view

For better object recognition, Katalon Studio supports Smart XPath (a.k.a Relative XPath). If an element cannot be consistently located using its direct attributes, Katalon Studio identifies the element by using its more robust neighbors. This method is visually intuitive as it reflects the way users often identify a visible element on the user interface.

Working with XPath, you can:

  • Set the priority of XPath locators.
  • Decide which object properties are used to recognize objects.
  • Override the global settings in a specific object. To do so, open an object view and configure a selection method used for this object in particular.

If XPath is set as the default selection method when spying and recording, Katalon Studio generates a list of Smart XPaths automatically.

Learn more about XPath with this guide: Detecting objects with XPath.

object spy

Attributes

A test object is typically built up by several properties. During test execution, Katalon Studio uses them to detect an object.

If Attributes is set as the default selection method during spying and recording, Katalon Studio automatically generates XPath locators that combine all the selected object properties to locate that object. In the Detect object by? column of the Object's Properties table, you can check/uncheck preferred properties.

attributes

CSS

To manually input your CSS locator of a test object, open an object view and select the CSS option. In the Selected Locator, enter a CSS locator value.

CSS

Change the CSS selector of an object at runtime

To change the CSS value of a test object at runtime, use the following code snippet:

import com.kms.katalon.core.testobject.SelectorMethod

TestObject to = findTestObject('your_test_object_id')

//Change value of CSS selector
to.setSelectorValue(SelectorMethod.CSS, 'your_desired_value')

//Change selection method from another selector to CSS selector
to.setSelectorMethod(SelectorMethod.CSS)

See also:

Image

image

From version 7.2.2 onwards, Katalon supports visual object recognition. You can learn more about how to create image property for an object at Web Image-based Testing.

See also

Feedback