Easy Selenium tests with Page Objects

Hi,

As you all know Selenium is a very nice tool while doing integration tests. You can simulate an user using your webpage for any kind of test cases.

While writing selenium tests in Java, it was very hard to trace the test code as you may come up with something like

	@Test
	public void testCreateUser() throws Exception {
		final String firstName = "firstNameSelenium";
		final String lastName = "lastNameSelenium";
		final String login = "loginSelenium";

		selenium.click( "link=Menu" );
		selenium.click( "usersMenuItem" );
		waitForPageToLoad();
		selenium.click( "registerNewUserLink" );
		waitForPageToLoad();
		Assert.assertTrue( selenium.isElementPresent( "userEditPage" ) );

		// Register a new user
		selenium.type( "form:firstName", firstName );
		selenium.type( "form:lastName", lastName );
		selenium.type( "form:login", login );
		selenium.type( "password", "secretPassSelenium" );
		selenium.type( "form:personalEmail", "perso@perso.com" );
		selenium.select( "form:homeCountry", "value=FR" );
		selenium.select( "form:access2Add", "label=Business Unit Manager" );

		selenium.click( "form:industries:industryToggleLink" );
	
		selenium.click( "form:saveButton" );
		waitForPageToLoad();
		Assert.assertTrue( selenium.isElementPresent( "userEditPage" ) );
	}

and this is not nice, as the code seems unmaintable and you cannot understand what you are testing by doing what. Also if you change the id of an input for example, you have to change that code every place.

With Page Object Pattern, you can represent your each page as an object and with this way you can seperate the html codes from your tests.

Let’s do the following example. A user will try to login to our page and then will list all the latest news from the main page. By the way I will not go over how to setup selenium etc. I will just try to show you can use the Page Objects.

We firstly create our login page as follows:

public class LoginPage{
	protected final DefaultSelenium selenium;

	public LoginPage(DefaultSelenium selenium) {
		this.selenium = selenium;
	}

	public DashBoardPage loginAs(String userName,String password) {
		selenium.open("/YourApplication/login.xhtml");
		selenium.click("j_username");
		selenium.type("j_username", userName);
		selenium.click("j_password");
		selenium.type("j_password", password);
		selenium.click("logbut");
		selenium.waitForPageToLoad("30000");
		return new DashBoardPage(selenium);
	}
}

this login page just logins to the system and returns the DashboardPage. let’s see what dashboard page looks like:


public class DashBoardPage {

	protected final DefaultSelenium selenium;

	public DashBoardPage(DefaultSelenium selenium) {
		this.selenium = selenium;
	}

	public NewsPage goToNewsPage() {
		selenium.click("link=news");
		return new NewsPage(selenium);
	}
}

and news page

public class NewsPage {

	protected final DefaultSelenium selenium;

	public NewsPage(DefaultSelenium selenium) {
		this.selenium = selenium;
	}

	public boolean isNewsDisplayed() {
		return selenium.getBodyText().contains("News for today");
	}
}

ok a basic setup is here, let’s see the a simple test

 public class DisplayNewsTest {
	protected DefaultSelenium selenium;
	
	@Before
	public void before() {
		selenium = new DefaultSelenium("localhost",4444,"*iexplore","http://localhost:8190");
		selenium.start();
	}
	@Test
	public void shouldLoginAndDisplayNews() {
		LoginPage loginPage = new LoginPage(selenium);
		Dashboard dashboard = loginPage.loginAs("admin", "admin");
		NewsPage newsPage = dashboard.goToNewsPage();
		assertThat(newsPage.isNewsDisplayed(), equalTo(true));
	}
}

See how easy and readable the test is?

it is a very basic example but you see it will make your code more readable and easier to maintain. For example we have a current test like:


	@Test
	public void shouldCreateAChannelOwner() {
		LoginPage loginPage = new LoginPage(selenium);
		NewUserPage newUser = loginPage.loginAs("admin", "admin").gotoAdministrator().goToUsers().goToCreateNewUser();

		assertThat(newUser.isUserCreateSuccessful(), equalTo(true));		
	}

You can understand what the test is doing by looking at here.

So use page objects while developing with selenium. A more detailed info can be found here:

http://code.google.com/p/selenium/wiki/PageObjects

Advertisements

10 thoughts on “Easy Selenium tests with Page Objects

  1. Very nice and clear article. But I recommend JMeter. Using JMeter’s HTTP proxy, test senarios can be obtaioned easily. Also with JMeter, load tests can be performed. But anyone who knows testing Seam based projects with JMeter can contact me 🙂

  2. Hey, great example, but i have a question for the following use case:

    Loginn page –login- -> Dashboard page –goToNewsPage–>News page–goToDashboard–>Dashboard page (again)

    Now, if i understood correctly, each time i enter a page, a new PageObject is created, right? So in this case, i will have 2 DashboardPage objects – but i want to work with the same one (first one) .
    So the question is how can i catch the first one (of course, i also should have a check like “if already exists – catch it; if not – create new”.

    Thank you

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s