Locate Elements
Learn how to locate iOS elements with BELLATRIX mobile module.
Example
[Test]
public void ElementFound_When_CreateById_And_ElementIsOnScreen()
{
var button = App.Components.CreateById<Button>("ComputeSumButton");
button.ValidateIsVisible();
Console.WriteLine(button.By.Value);
Console.WriteLine(button.WrappedComponent.TagName);
var answerLabel = App.Components.CreateById<Button>("BELLATRIX");
answerLabel.ScrollToVisible(ScrollDirection.Up);
answerLabel.Click();
}
Explanations
var button = App.Components.CreateById<Button>("ComputeSumButton");
There are different ways to locate elements on the screen. To do it you use the element create service. You need to know that BELLATRIX has a built-in complex mechanism for waiting for elements, so you do not need to worry about this anymore. Keep in mind that when you use the Create methods, the element is not searched on the screen. All elements use lazy loading. Which means that they are searched once you perform an action or assertion on them. By default on each new action, the element is searched again and be refreshed.
Console.WriteLine(button.By.Value);
Because of the proxy element mechanism (we have a separate type of element instead of single WebDriver IWebElement interface or Appium IOSElement) we have several benefits. Each control (element type- ComboBox, TextField and so on) contains only the actions you can do with it, and the methods are named properly. In vanilla WebDriver to type the text you call SendKeys method. Also, we have some additional properties in the proxy web control such as- By. Now you can get the locator with which you element was found.
Console.WriteLine(button.WrappedComponent.TagName);
You can access the WebDriver wrapped element through WrappedElement and the current AppiumDriver instance through- WrappedDriver.
var answerLabel = App.Components.CreateById<Button>("BELLATRIX, from 11:00 PM to Monday, November 12, 12:00 AM");
answerLabel.ScrollToVisible(ScrollDirection.Up);
Sometimes, the elements you need to perform operations on are not in the visible part of the screen. In order Appium to be able to locate them, you need to scroll to them first. To do so for iOS, you need to use ScrollToVisible method.
Available Create Methods
BELLATRIX extends the vanilla WebDriver selectors and give you additional ones.
CreateById
App.Components.CreateById<Button>("myId");
Searches the element by its ID.
CreateByName
App.Components.CreateByName<Button>("ComputeSumButton");
Searches the element by its name.
CreateByValueContaining
App.Components.CreateByValueContaining<Label>("SumLabel");
Searches the element by its value if it contains specified value.
CreateByIOSUIAutomation
App.Components.CreateByIOSUIAutomation<TextField>(".textFields().withPredicate("value == 'Search eBay'")");
Searches the element by iOS UIAutomation expressions.
CreateByIOSNsPredicate
App.Components.CreateByIOSNsPredicateCreateByIOSNsPredicate<RadioButton>("type == \"XCUIElementTypeSwitch\" AND name == \"All-day\"");
Searches the element by iOS NsPredicate expression.
CreateByClass
App.Components.CreateByClass<TextField>("XCUIElementTypeTextField");
Searches the element by its class.
CreateByXPath
App.Components.CreateByXPath<Button>("//XCUIElementTypeButton[@name=\"ComputeSumButton\"]");
Searches the element by XPath locator.
Find Multiple Elements
Sometimes we need to find more than one component. For example, in this test we want to locate all Add to Cart buttons. To do it you can use the element create service CreateAll method.
[Test]
public void ElementFound_When_CreateAllById_And_ElementIsOnScreen()
{
var buttons = App.Components.CreateAllById<Button>("ComputeSumButton");
buttons[0].ValidateIsVisible();
}
Available CreateAll Methods
CreateAllById
App.Components.CreateAllById<Button>("myId");
Searches the elements by their ID.
CreateAllByName
App.Components.CreateAllByName<Button>("ComputeSumButton");
Searches the elements by their name.
CreateAllByValueContaining
App.Components.CreateAllByValueContaining<Label>("SumLabel");
Searches the elements by their value if it contains specified value.
CreateAllByIOSUIAutomation
App.Components.CreateAllByIOSUIAutomation<TextField>(".textFields().withPredicate("value == 'Search eBay'")");
Searches the elements by iOS UIAutomation expressions.
CreateAllByIOSNsPredicate
App.Components.CreateByAllIOSNsPredicate<RadioButton>("type == \"XCUIElementTypeSwitch\" AND name == \"All-day\"");
Searches the elements by iOS NsPredicate expression.
CreateAllByClass
App.Components.CreateAllByClass<TextField>("XCUIElementTypeTextField");
Searches the elements by their class.
CreateAllByXPath
App.Components.CreateAllByXPath<Button>("//XCUIElementTypeButton[@name=\"ComputeSumButton\"]");
Searches the elements by XPath locator.
Find Nested Elements
Sometimes it is easier to locate one element and then find the next one that you need, inside it. For example in this test we want to locate the button inside the main view component. To do it you can use the element’s Create methods.
public void ElementFound_When_CreateById_And_ElementIsOnScreen_NestedElement()
{
var mainElement = App.Components.CreateByIOSNsPredicate<Element>(
"type == \"XCUIElementTypeApplication\" AND name == \"TestApp\"");
var button = maincomponent.CreateById<RadioButton>("ComputeSumButton");
button.ValidateIsVisible();
}
Note: it is entirely legal to create a Button instead of ToggleButton. BELLATRIX library does not care about the real type of the iOS elements. The proxy types are convenience wrappers so to say. Meaning they give you a better interface of predefined properties and methods to make your tests more readable.
Available Create Methods for Finding Nested Elements
CreateById
component.CreateById<Button>("myId");
Searches the element by its ID.
CreateByName
component.CreateByName<Button>("ComputeSumButton");
Searches the element by its name.
CreateByValueContaining
component.CreateByValueContaining<Label>("SumLabel");
Searches the element by its value if it contains specified value.
CreateByIOSUIAutomation
component.CreateByIOSUIAutomation<TextField>(".textFields().withPredicate("value == 'Search eBay'")");
Searches the element by iOS UIAutomation expressions.
CreateByClass
component.CreateByClass<TextField>("XCUIElementTypeTextField");
Searches the element by its class.
CreateByXPath
component.CreateByXPath<Button>("//XCUIElementTypeButton[@name=\"ComputeSumButton\"]");
Searches the element by XPath locator.
CreateAllById
component.CreateAllById<Button>("myId");
Searches the elements by their ID.
CreateAllByName
component.CreateAllByName<Button>("ComputeSumButton");
Searches the elements by their name.
CreateAllByValueContaining
component.CreateAllByValueContaining<Label>("SumLabel");
Searches the elements by their value if it contains specified value.
CreateAllByIOSUIAutomation
component.CreateAllByIOSUIAutomation<TextField>(".textFields().withPredicate("value == 'Search eBay'")");
Searches the elements by iOS UIAutomation expressions.
CreateAllByClass
component.CreateAllByClass<TextField>("XCUIElementTypeTextField");
Searches the elements by their class.
CreateAllByXPath
component.CreateAllByXPath<Button>("//XCUIElementTypeButton[@name=\"ComputeSumButton\"]");
Searches the elements by XPath locator.