Using locators in Karate UI Web Automation

There are various ways we can locate an element in Karate. let’s see few examples below:

Locating an element using ID of the element

And input('#user-name',UIApp_username)
And input('#password',UIApp_password)

Locating an element using CSS of the element

#locating an elemet using css selector
And input('input[name=user-name]',UIApp_username)
And input('input[name=password]',UIApp_password)

Locating an element using XPATH of the element

#locating an element by xpath
When click("//input[@id='login-button']")

Locating an element using {} , matching exact text {tagname}textToMatch

 #locating an element using {} , matching exact txt Syntax -> {tagname}textToMatch
 And waitFor('{span}Products')

Locating an element using {} , matching exact text {^tagname}textToMatch

 #locating an element using {} , matching partial text Syntax -> {^tagname}textToMatch
 And waitFor('{^span}Prod')

platform	prefix	means	example
web	(none)	css selector	input[name=someName]
web android ios	/	xpath	//input[@name='commit']
web	{}	exact text content	{a}Click Me
web	{^}	partial text content	{^a}Click Me

Feature: Login to the Sauce Lab application

  Scenario: To verify the sucessfull login
    * configure driver = { type: 'firefox' }
    Given driver 'https://www.saucedemo.com/'

    #Locating an element using ID
    And input('#user-name',UIApp_username)
    And input('#password',UIApp_password)

    #locating an element using css selector
    And input('input[name=user-name]',UIApp_username)
    And input('input[name=password]',UIApp_password)

    #locating an element by path
    When click("//input[@id='login-button']")

    #locating an element using {} , matching exact txt {tagname}textToMatch
    And waitFor('{span}Products')

    #locating an element using {^} , matching partial text {^tagName}textToMatch
    And waitFor('{^span}Prod')