Localizando elementos

A locator is a way to identify elements on a page. It is the argument passed to the Finding element methods.

Check out our encouraged test practices for tips on locators, including which to use when and why to declare locators separately from the finding methods.

Estratégias de seleção de elemento

Existem oito estratégias diferentes de localização de elementos embutidas no WebDriver:

Relative Locators

Selenium 4 introduces Relative Locators (previously called as Friendly Locators). These locators are helpful when it is not easy to construct a locator for the desired element, but easy to describe spatially where the element is in relation to an element that does have an easily constructed locator.

How it works

Selenium uses the JavaScript function getBoundingClientRect() to determine the size and position of elements on the page, and can use this information to locate neighboring elements.
find the relative elements.

Relative locator methods can take as the argument for the point of origin, either a previously located element reference, or another locator. In these examples we’ll be using locators only, but you could swap the locator in the final method with an element object and it will work the same.

Let us consider the below example for understanding the relative locators.

Available relative locators

Above

If the email text field element is not easily identifiable for some reason, but the password text field element is, we can locate the text field element using the fact that it is an “input” element “above” the password element.

• Java
• Python
• CSharp
• Ruby
• JavaScript
• Kotlin

By emailLocator = RelativeLocator.with(By.tagName("input")).above(By.id("password"));

email_locator = locate_with(By.TAG_NAME, "input").above({By.ID: "password"})

var emailLocator = RelativeBy.WithLocator(By.TagName("input")).Above(By.Id("password"));

email_locator = {relative: {tag_name: 'input', above: {id: 'password'}}}

let emailLocator = locateWith(By.tagName('input')).above(By.id('password'));

val emailLocator = RelativeLocator.with(By.tagName("input")).above(By.id("password"))

Below

If the password text field element is not easily identifiable for some reason, but the email text field element is, we can locate the text field element using the fact that it is an “input” element “below” the email element.

• Java
• Python
• CSharp
• Ruby
• JavaScript
• Kotlin

By passwordLocator = RelativeLocator.with(By.tagName("input")).below(By.id("email"));

password_locator = locate_with(By.TAG_NAME, "input").below({By.ID: "email"})

var passwordLocator = RelativeBy.WithLocator(By.TagName("input")).Below(By.Id("email"));

password_locator = {relative: {tag_name: 'input', below: {id: 'email'}}}

let passwordLocator = locateWith(By.tagName('input')).below(By.id('email'));

val passwordLocator = RelativeLocator.with(By.tagName("input")).below(By.id("email"))

Left of

If the cancel button is not easily identifiable for some reason, but the submit button element is, we can locate the cancel button element using the fact that it is a “button” element to the “left of” the submit element.

• Java
• Python
• CSharp
• Ruby
• JavaScript
• Kotlin

By cancelLocator = RelativeLocator.with(By.tagName("button")).toLeftOf(By.id("submit"));

cancel_locator = locate_with(By.TAG_NAME, "button").to_left_of({By.ID: "submit"})

var cancelLocator = RelativeBy.WithLocator(By.tagName("button")).LeftOf(By.Id("submit"));

cancel_locator = {relative: {tag_name: 'button', left: {id: 'submit'}}}

let cancelLocator = locateWith(By.tagName('button')).toLeftOf(By.id('submit'));

val cancelLocator = RelativeLocator.with(By.tagName("button")).toLeftOf(By.id("submit"))

Right of

If the submit button is not easily identifiable for some reason, but the cancel button element is, we can locate the submit button element using the fact that it is a “button” element “to the right of” the cancel element.

• Java
• Python
• CSharp
• Ruby
• JavaScript
• Kotlin

By submitLocator = RelativeLocator.with(By.tagName("button")).toRightOf(By.id("cancel"));

submit_locator = locate_with(By.TAG_NAME, "button").to_right_of({By.ID: "cancel"})

var submitLocator = RelativeBy.WithLocator(By.tagName("button")).RightOf(By.Id("cancel"));

submit_locator = {relative: {tag_name: 'button', right: {id: 'cancel'}}}

let submitLocator = locateWith(By.tagName('button')).toRightOf(By.id('cancel'));

val submitLocator = RelativeLocator.with(By.tagName("button")).toRightOf(By.id("cancel"))

Near

If the relative positioning is not obvious, or it varies based on window size, you can use the near method to identify an element that is at most 50px away from the provided locator. One great use case for this is to work with a form element that doesn’t have an easily constructed locator, but its associated input label element does.

• Java
• Python
• CSharp
• Ruby
• JavaScript
• Kotlin

By emailLocator = RelativeLocator.with(By.tagName("input")).near(By.id("lbl-email"));

email_locator = locate_with(By.TAG_NAME, "input").near({By.ID: "lbl-email"})

var emailLocator = RelativeBy.WithLocator(By.tagName("input")).Near(By.Id("lbl-email"));

email_locator = {relative: {tag_name: 'input', near: {id: 'lbl-email'}}}

let emailLocator = locateWith(By.tagName('input')).near(By.id('lbl-email'));

val emailLocator = RelativeLocator.with(By.tagName("input")).near(By.id("lbl-email"));

Chaining relative locators

You can also chain locators if needed. Sometimes the element is most easily identified as being both above/below one element and right/left of another.

• Java
• Python
• CSharp
• Ruby
• JavaScript
• Kotlin

By submitLocator = RelativeLocator.with(By.tagName("button")).below(By.id("email")).toRightOf(By.id("cancel"));

submit_locator = locate_with(By.TAG_NAME, "button").below({By.ID: "email"}).to_right_of({By.ID: "cancel"})

var submitLocator = RelativeBy.WithLocator(By.tagName("button")).Below(By.Id("email")).RightOf(By.Id("cancel"));

submit_locator = {relative: {tag_name: 'button', below: {id: 'email'}, right: {id: 'cancel'}}}

let submitLocator = locateWith(By.tagName('button')).below(By.id('email')).toRightOf(By.id('cancel'));

val submitLocator = RelativeLocator.with(By.tagName("button")).below(By.id("email")).toRightOf(By.id("cancel"))