Introduction to Page Object Model Framework

Page Object Model Framework has now a days become very popular test automation framework in the industry and many companies are using it because of its easy test maintenance and reduces the duplication of code.

The main advantage of Page Object Model is that if the UI changes for any page, it don’t require us to change any tests, we just need to change only the code within the page objects (Only at one place). Many other tools which are using selenium, are following the page object model.

page object locators

In the above screen shot, we have first identified the locators and defined it on the top after the class. In this way we can achieve readability of test scripts and we can easily identify locators and change them if needed at only one place.

Page Object model is writing all the functionalities / reusable components of a page that we want to automate in a separate class. Say now if we consider four pages as Home page, Login page, Create Account and Forgot password page etc.

As per Google Wiki Page Object
"Within your web app’s UI there are areas that your tests interact with. A Page Object simply models these as objects within the test code. This reduces the amount of duplicated code and means that if the UI changes, the fix need only be applied in one place."

For the above pages we will create classes as HomePage.class, LoginPage.class, CreateAccountPage.class and ForgotPasswordPage.class. In each class we will identify and write reusable methods which are specific to a page.

page object classes

Here in The first page 'google home page' which will have many options like Search, Sign In, +You, Images, privacy etc links. based on the user action it navigates to respective page. Now all functionalities that we want to automate should have reusable methods/components for each page.

Now as our main page is google page we can navigate to other pages by clicking on any link from the google page. When ever we are navigating to other page, we need to return that page object. Else Return the current page object as this action doesn't navigate to a other page represented by another Page Object

The Page Object model provides the following advantages.

1. There is clean separation between test code and page specific code such as locators (or their use if you’re using a UI map) and layout.

2. There is single repository for the services or operations offered by the page rather than having these services scattered through out the tests.

In both cases this allows any modifications required due to UI changes to all be made in one place. Useful information on this technique can be found on numerous blogs as this ‘test design pattern’ is becoming widely used. We encourage the reader who wishes to know more to search the internet for blogs on this subject. Many have written on this design pattern and can provide useful tips beyond the scope of this user guide. To get you started, though, we’ll illustrate page objects with a simple example.

Example: Lets us take a simple login example:

 	/***
	  * Tests login functionality
	  */
	 	public void loginTestCase() {
	       driver.navigate().to(URL);
	       driver.findElement(By.name("signIn")).click();
	       driver.findElement(By.id("username")).sendKeys("testuser");
	       driver.findElement(By.id("password")).sendKeys("testpassword");
	       driver.findElement(By.name("loginbtn")).click();
	         
	       WebDriverWait wait = new WebDriverWait(driver, 10);
	       wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("profile")));
	       String Expected=driver.findElement(By.id("message")).getText();
	       Assert.assertEquals(Expected, "Welcome");
	 	}

If you observe the above test, there is no separation of test and test locators. If this is the case, in future if the UI changes, it must be changed in multiple places. It will also become difficult to identify where these locators are used as the chances of locators are being used in multiple tests are more.

We will try to rewrite the above example by implementing the page object model:

/***
 * Tests login functionality
 */
       public void loginTestCase() {
	// To go to home page
		homePage.gotoHomePage();
	//To click on SignIn link
		accountLoginPage = homePage.clickOnSignIn()
	//To verify if user is navigated to sign-in page
		Assert.assertTrue(accountLoginPage.verifyPage());
	//Login to the account
		accountLoginPage.userLogin(username,password);
	//To verify if user is navigated to user home page after successfull login
		Assert.assertTrue(userHomePage.verifyPage());
	}

In the above test, we have not used any locators. It is completely separated by driver.findElement 's, waits, exceptions and no static values in the code etc.We will be working only with the methods which are defined in multiple pages. Based on test, we will navigate to the required page and access those page methods.

We will look into more details in the next tutorials. Please refer Sample Page Object Model Framework Example

Selenium Tutorials: 

Comments

Screenshots is not displaying so it's difficult to understand

Thanks for letting us know.

Suppose I have 100 usernames and 100 passwords.So how will I call those 100 usernames and 100 passwords in my test cases.

Add new comment

CAPTCHA
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.