# Best approach to declare mobile element in POM Appium automation

**URL:** <https://discuss.appium.io/t/best-approach-to-declare-mobile-element-in-pom-appium-automation/37548>\
**Category:** Support\
**Created:** [October 19, 2022, 4:54am UTC](https://discuss.appium.io/t/best-approach-to-declare-mobile-element-in-pom-appium-automation/37548 "2022-10-19T04:54:30Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![IMOBILETester](https://discuss.appium.io/user_avatar/discuss.appium.io/imobiletester/32/8835_2.png) [@IMOBILETester](https://discuss.appium.io/u/IMOBILETester)\
**Post date:** [October 19, 2022, 4:54am UTC](https://discuss.appium.io/t/best-approach-to-declare-mobile-element-in-pom-appium-automation/37548/1 "2022-10-19T04:54:31Z")

</div>

Hi all,

We have native app appium framework for android and iOS. Also, we are declaring element in POM as WebElement like below

**For Android:**  
@AndroidFindBy(id = Constants.PACKAGE\_PATH + “:id/guest\_checkout\_btn”)  
public WebElement guestCheckOutBtn;

**For iOS:**  
@FindBy(accessibilityId = “Delivery Addresses”)  
public WebElement deliveryAddress;

Sometimes people are using this

```
public static By CANCEL_BTN=By.xpath("//XCUIElementTypeButton[@name='Cancel']");

```

Which is the best approach for this? Is there any article about this?

---

<div class="post-metadata">

**Author:** ![Aleksei](https://discuss.appium.io/user_avatar/discuss.appium.io/aleksei/32/6267_2.png) [@Aleksei](https://discuss.appium.io/u/Aleksei)\
**Post date:** [October 19, 2022, 7:24am UTC](https://discuss.appium.io/t/best-approach-to-declare-mobile-element-in-pom-appium-automation/37548/2 "2022-10-19T07:24:50Z")

</div>

this is best

```auto
    @iOSXCUITFindBy(id = "iOS_ID")
    @AndroidFindBy(id = "guest_checkout_btn")
    private WebElement guestCheckOutBtn;

```

---

<div class="post-metadata">

**Author:** ![ido\_oserovitz](https://discuss.appium.io/user_avatar/discuss.appium.io/ido_oserovitz/32/9832_2.png) [@ido\_oserovitz](https://discuss.appium.io/u/ido_oserovitz)\
**Post date:** [October 19, 2022, 1:57pm UTC](https://discuss.appium.io/t/best-approach-to-declare-mobile-element-in-pom-appium-automation/37548/3 "2022-10-19T13:57:01Z")

</div>

a bit about the differences:  
basically, the idea of POM (page object model) is to represent pages as objects. each page object will contain the “elements” displayed on the current page. in order to find the elements we use locators and selectors which are being represented by the **BY** class.

the first option is to hold BY instances with the locator strategies and then in each method call, run **driver.finElement(myLocatorInstance)** - no annotation is needed for this.  
see: [https://www.selenium.dev/documentation/test\_practices/encouraged/page\_object\_models/](https://www.selenium.dev/documentation/test_practices/encouraged/page_object_models/)

the second option which is simpler and easier is just to annotate the WebElement fields and to use **AppiumFieldDecorator** which “knows” to identify the different annotations (android, ios, windows) and wraps each field with a **dynamic proxy** (you must read and understand this concept if you are going to use it, it will solve you a lot of problems and you will understand your code better) and then, you can just call a method on the WebElement instance (which was decorated with the relevant annotations) and the proxy will get invoked and will return a **“fresh”** WebElement instance which will avoid StaleElementReferenceException.  
see: [https://github.com/appium/java-client/blob/master/docs/Page-objects.md](https://github.com/appium/java-client/blob/master/docs/Page-objects.md) (you can read on widgets as well, it is very useful).