Skip to main content

Generating Page Objects using Aqua template

Aqua from JetBrains boosts productivity by generating Page Objects with built-in Web Inspector. Instead of switching between browser DevTools and IDE, you can now automatically insert locator strategies directly into page objects.

We will create a custom template for Kolibrium Page Objects by following the guide from the aforementioned link and pasting the content below to Custom Kotlin Page Object.kt and Custom Kotlin Locator.kt templates.

Template files​

  1. Page Object template (Custom Kotlin Page Object.kt)

Generates Kolibrium-compatible page object classes using Kotlin's context receiver.

#if (${PACKAGE_NAME} && ${PACKAGE_NAME} != "")package ${PACKAGE_NAME}

#end
import dev.kolibrium.core.selenium.*
import org.openqa.selenium.WebDriver

context(WebDriver)
class $PAGE_NAME {
#foreach($field in $PAGE_FIELDS)
    $field
#end
}
  1. Locator template (Custom Kotlin Locator.kt)

Supports multiple locator strategies:

  • CSS selector
  • XPath
  • ID
  • Name
  • Class name
  • Data attribute
  • Text
  • Aria label
#set ($item = $PAGE_ELEMENT)
#if (${item.multiSelect})
  #if (${item.locatorType} == "css")
    private val ${item.fieldName} by cssSelectors("${item.css}")
  #elseif (${item.locatorType} == "xpath")
    private val ${item.fieldName} by xPaths("${item.xpath}")
  #elseif (${item.locatorType} == "name")
    private val ${item.fieldName} by names("${item.name}")
  #elseif (${item.locatorType} == "tag-with-classes")
    private val ${item.fieldName} by classNames("${item.tagWithClasses}")
  #elseif (${item.locatorType} == "data")
    private val ${item.fieldName} by dataTests("${item.dataAttributeValue}")
  #elseif (${item.locatorType} == "text")
    private val ${item.fieldName} by xPaths("//*[text()='${item.text}']")
  #else (${item.locatorType} == "aria-label")
    private val ${item.fieldName} by cssSelectors("[aria-label='${item.ariaLabel}']")
  #end
#else
  #if (${item.locatorType} == "css")
    private val ${item.fieldName} by cssSelector("${item.css}")
  #elseif (${item.locatorType} == "xpath")
    private val ${item.fieldName} by xPath("${item.xpath}")
  #elseif (${item.locatorType} == "id")
    private val ${item.fieldName} by id("${item.id}")
  #elseif (${item.locatorType} == "name")
    private val ${item.fieldName} by name("${item.name}")
  #elseif (${item.locatorType} == "tag-with-classes")
    private val ${item.fieldName} by className("${item.tagWithClasses}")
  #elseif (${item.locatorType} == "data")
    private val ${item.fieldName} by dataTest("${item.dataAttributeValue}")
  #elseif (${item.locatorType} == "text")
    private val ${item.fieldName} by xPath("//*[text()='${item.text}']")
  #else (${item.locatorType} == "aria-label")
    private val ${item.fieldName} by cssSelector("[aria-label='${item.ariaLabel}']")
  #end
#end

Configuration steps​

  1. Open Settings
  2. Navigate to Selenium Page Object templates
  3. Replace existing templates with provided code
  4. Click "OK" button to save changes and close the Settings panel

From now on, Aqua will generate the properties using Kolibrium's locator delegate functions in your page object classes.

Usage workflow​

  1. Create new Selenium Page Object

    • Language: Kotlin
    • Framework: Custom

  2. Use Web Inspector

    • Select an element
    • Right-click on the element in Locators Evaluator
    • Choose "Add Element to Code"

The following video demonstrates every step mentioned in this guide.