Overview of Page Object Model

Page Object Model(POM) is a design pattern to create Object Repository for web UI elements.

Under this model, for each web page in the application, there should be a page class. This page class will have
variables storing attribute values to identify web elements. The page will also contain methods which perform
operations on the Web Elements.

Page object model (POM) in selenium is an object design pattern that is used to create an object repository for
web UI elements.

In this model, we create a separate corresponding page class for each web page in the application and store all
locators to inspect elements on the page, respective methods to interact with those elements, and variables to
use them.

Each page class will locate the WebElements of the corresponding web page and perform operations on those
WebElements by methods.

The test classes use methods of this page object class whenever they need to perform a test with the UI of that
page.

Why POM?
Over time the amount of test scripts involved in the test repository will increase. Maintaining huge test scripts
of selenium become tedious when the web element attributes gets updated in the AUT. In a similar manner, a
lot of preconditions which needs to be met before performing an action will lead to duplication of code in the
test scripts.

e.g. Before you can perform the check on the Account balance for your account number, you have to
successfully login to the application. Hence the code to login to the application will get repeated every time
you have to interact with the application.

POM offers the following advantages compared to the traditional way of writing the test scripts

1. The Object repository ensures that the attribute value has to be changed only in the page class, for the
change to be reflected in all the test scripts.
2. Clear separation between the attribute values, interactions and verification.
3. Code becomes less and optimized because of the reusable page methods in the POM classes.

How to Implement POM in Selenium?

 There are two ways by which we can implement page object model design patterns in Selenium. They
are as follows:
 1.UsingNormalapproach.
2. Using Page Factory and @findBy
 Let’s understand the concepts of normal approach and page factory one by one.

Creating Page Object Model using Normal Approach in Selenium

 Normal approach is a basic structure of Page object model (POM) without using Page factory where
all Web Elements of the application under test and the method that performs operations on these Web
Elements, are maintained inside a class file.

 Let’s take a scenario where we will automate the webpage by using normal approach (without using
Page factory).

Scenario to Automate:

1. Go to the Facebook login page.

2. Get the title of Facebook login page.
3. Enter the valid credentials in the “Facebook Login” Page in order to redirect to the ‘Facebook Home‘ Page.
4. On the Facebook Home page, verify that “Facebook” is present or not.
5. And then log out from the account.
package saucedemopages;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;

public class SwagLabLoginPage {

WebDriver webDriver;

public SwagLabLoginPage(WebDriver webDriver) {

super();
this.webDriver = webDriver;
}

By usernameLocator=By.xpath("//input[@id='user-name']");
By passwordLocator=By.xpath("//input[@id='password']");
By loginButtonLocator=By.xpath("//input[@id='login-
button']");

public void setUserName(String username) {

webDriver.findElement(usernameLocator).sendKeys(username);
}

public void setPassword(String password) {

webDriver.findElement(passwordLocator).sendKeys(password);
}

public void onClick() {

webDriver.findElement(loginButtonLocator).click();
}
}
package testing;

import org.openqa.selenium.WebDriver;
import org.testng.Assert;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Test;

import base.BaseTest;
import saucedemopages.SwagLabLoginPage;

public class SwagLabLoginTester extends BaseTest {

WebDriver webDriver;

@BeforeClass
public void setup() {
webDriver=getWebDriver();
}

@Test

public void verifyLogin() {

SwagLabLoginPage swagLabLoginPage=new
SwagLabLoginPage(webDriver);
swagLabLoginPage.setUserName("standard_user");
swagLabLoginPage.setPassword("secret_sauce");
swagLabLoginPage.onClick();
String actualUrl=webDriver.getCurrentUrl();
String
expectedUrl="https://www.saucedemo.com/inventory.html";
Assert.assertEquals(actualUrl, expectedUrl);
}
}
Creating BaseTest Class

package saucedemopages;

import org.openqa.selenium.By;

import org.openqa.selenium.WebDriver;

public class SwagLabDashboardPage {

WebDriver webDriver;

public SwagLabDashboardPage(WebDriver webDriver) {

super();

this.webDriver = webDriver;

By messageLocator=By.xpath("//span[text()='Products']");

public String getMessage() {

//Get the visible (i.e. not hidden by CSS) text of this element,

return webDriver.findElement(messageLocator).getText();
 }

public boolean isVerifyLogin(String text) {

if(getMessage().equals(text))

return true;

else

return false;

Creating Page Class for Login Page

package saucedemopages;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;

public class SwagLabLoginPage {

WebDriver webDriver;

public SwagLabLoginPage(WebDriver webDriver) {

super();
this.webDriver = webDriver;
}

By usernameLocator=By.xpath("//input[@id='user-name']");
By passwordLocator=By.xpath("//input[@id='password']");
By loginButtonLocator=By.xpath("//input[@id='login-
button']");

public void setUserName(String username) {

webDriver.findElement(usernameLocator).sendKeys(username);
}

public void setPassword(String password) {

webDriver.findElement(passwordLocator).sendKeys(password);
}

public void onClick() {

webDriver.findElement(loginButtonLocator).click();
}

public SwagLabDashboardPage verifyLogin(String

username,String password) {
SwagLabDashboardPage dashboardPage=null;
setUserName(username);
setPassword(password);
onClick();
dashboardPage=new SwagLabDashboardPage(webDriver);
return dashboardPage;

}
}

Creating Page Class for Dashboard Page

package saucedemopages;

import org.openqa.selenium.By;

import org.openqa.selenium.WebDriver;

public class SwagLabDashboardPage {

WebDriver webDriver;

public SwagLabDashboardPage(WebDriver webDriver) {

super();

this.webDriver = webDriver;

}
 By messageLocator=By.xpath("//span[text()='Products']");

public String getMessage() {

//Get the visible (i.e. not hidden by CSS) text of this element,

return webDriver.findElement(messageLocator).getText();

public boolean isVerifyLogin(String text) {

if(getMessage().equals(text))

return true;

else

return false;

Create a Tester class

package testing;

import org.openqa.selenium.WebDriver;

import org.testng.Assert;

import org.testng.annotations.BeforeClass;

import org.testng.annotations.Test;
import base.BaseTest;

import saucedemopages.SwagLabDashboardPage;

import saucedemopages.SwagLabLoginPage;

public class SwagLabLoginTester2 extends BaseTest {

WebDriver webDriver;

@BeforeClass

public void setup() {

webDriver=getWebDriver();

@Test

public void verifyLogin() {

SwagLabLoginPage swagLabLoginPage=new SwagLabLoginPage(webDriver);

SwagLabDashboardPage dashboardPage= swagLabLoginPage.verifyLogin("standard_user",

"secret_sauce");

Assert.assertTrue(dashboardPage.isVerifyLogin("Products"));

}
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE suite SYSTEM "https://testng.org/testng-1.0.dtd">
<suite name="Suite">

<parameter name="browser" value="edge"></parameter>

<parameter name="url"
value="https://www.saucedemo.com/"></parameter>
<test thread-count="5" name="Test">
<classes>
<class name="testing.SwagLabLoginTester2"/>
</classes>
</test> <!-- Test -->
</suite> <!-- Suite -->