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