Page Object Model Implementation

Page Object Model

This tutorial will give you an introduction to "Page Object Model" and its implementation in Selenium using java. Before starting with Page Object Model let's first know what are design patterns.

Page Object Model in Selenium

A Page Object Model is a design pattern that can be implemented using selenium webdriver. It essentially models the pages/screen of the application as objects called Page Objects, all the functions that can be performed in the specific page are encapsulated in the page object of that screen. In this way any change made in the UI will only affect that screens page object class thus abstracting the changes from the test classes.

Advantages of using Page Object Model

• Increases code re-usability 
• Improves code maintainability
• Makes code more readable and less brittle

Creating a Page Object Model in Java

Here, we'll create an automation framework implementing Page Object Model using Selenium with Java. 
Suppose we have to test a Anuko Time sheet Login application with only a login page. To start with we first need to create page objects for all available pages in our application - AnukoLoginFactory.java Then we will create a test class that will create instance of these page objects and invoke there methods to create tests.
Let's take the scenario where in the login page user enters valid credentials and on clicking submit button, user is redirected to home page.

Before that let's understand some basics of page @FindBy elements

Page Factory will initialize every WebElement variable with a reference to a corresponding element on the actual web page based on configured “locators”. This is done through the use of @FindBy annotations. With this annotation, we can define a strategy for looking up the element, along with the necessary information for identifying it:

	@FindBy(how=How.NAME, using="username")
	private WebElement user_name;
	The @FindBy annotation supports a handful of other strategies that
	make things a bit easier:
	id, name, className, css, tagName, linkText, partialLinkText, xpath
	@FindBy(id="username")
	private WebElement user_name;
	@FindBy(name="passsword")
	private WebElement user_password;
	@FindBy(className="class23")
	private WebElement label;
	@FindBy(css=”#content”)
	private WebElement text;
	Once initialized, these WebElement variables can then be used to
	interact with the corresponding elements on the page. The following code
	will, for example:
	user_name.sendkeys(username
	send the given sequence of keystrokes to the username field on the
	page, and it is equivalent to:
	driver.findElement(By.name(“user_name”)).sendKeys(username);
	Suppose if we need to find the list of elements on the page then we can
	use
	@FindBys
	@FindBys(@FindBy(xpath=”div[class='btn_llogin']”)))
	private List btn_lists;
	The above code will find all the div elements with class "btn_llogin"
	Additionally, you can use @FindAll with multiple @FindBy annotations to
	look for elements that match any of the given locators:
	@FindAll({@FindBy(how=How.ID, using=”username”),
	@FindBy(className=”username-field”)})
	private WebElement user_name;

view raw 1.pomintro.txt hosted with ❤ by GitHub

	Now lets starts with an example
	package com.anuko;
	import org.openqa.selenium.WebDriver;
	import org.openqa.selenium.WebElement;
	import org.openqa.selenium.support.FindBy;
	import org.openqa.selenium.support.How;
	public class LoginPagePOF {
	final WebDriver driver;
	@FindBy(how = How.XPATH, using = "//*[@id='login']")
	static WebElement txtbx_UserName;
	@FindBy(how = How.NAME, using = "password")
	static WebElement txtbx_Password;
	@FindBy(how = How.ID, using = "btn_login")
	static WebElement Button_Login ;
	public LoginPagePOF(WebDriver driver)
	{
	this.driver = driver;
	}
	// // This method will take two arguments ( Username nd Password)
	public void LogIn_Action(String sUserName, String sPassword){
	txtbx_UserName.sendKeys(sUserName);
	txtbx_Password.sendKeys(sPassword);
	Button_Login.click();
	}
	}

view raw 2.LoginPagePOF.java hosted with ❤ by GitHub

	Now create main class as LoginTestCase.java class as
	package com.anuko;
	import java.util.concurrent.TimeUnit;
	import org.openqa.selenium.WebDriver;
	import org.openqa.selenium.chrome.ChromeDriver;
	import org.openqa.selenium.firefox.FirefoxDriver;
	import org.openqa.selenium.support.PageFactory;
	import org.testng.annotations.AfterMethod;
	import org.testng.annotations.BeforeMethod;
	import org.testng.annotations.Test;
	public class LoginTestCase {
	static WebDriver driver;
	//Home_PG_POF HomePage;
	LoginPagePOF LoginPage;
	@BeforeMethod
	public void beforeMethod() {
	System.setProperty("webdriver.chrome.driver","yourpath/chromedriver");
	driver = new ChromeDriver();
	driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
	driver.get("https://timetracker.anuko.com/login.php");
	// HomePage = PageFactory.initElements(driver, Home_PG_POF.class);
	LoginPage = PageFactory.initElements(driver, LoginPagePOF.class);
	}
	@Test
	public void test() {
	// HomePage.lnk_MyAccount.click();
	LoginPage.LogIn_Action("guest", "guest");
	System.out.println(" Login Successfully, now it is the time to Log Off buddy.");
	// HomePage.lnk_LogOut.click();
	}
	@AfterMethod
	public void afterMethod() {
	// driver.quit();
	}
	}

view raw 3.logintest.java hosted with ❤ by GitHub

Right click and run as Java Application should be able to login to AnukoTimeSheet. 


Note :

In summary, PageFactory class can be used to initialize elements of a Page class without having to useFindElement or FindElements. Annotations can be used to supply descriptive names of target objects in the AUT to improve code readability. 

Thanks