Selenium tests, the Object Oriented way – example 1 (with code)

This is going to be a follow-up post in regards to the approach i showed at my SeleniumConf talk, on doing Selenium tests by using an Object Oriented approach.

I will have a series of such posts, to show more examples and to make it easier to understand how to use it. All the code presented here will be available in GitHub under this location: https://github.com/iamalittletester/learning-project.

Note: In order to make it shorter, instead of referring to ‘Selenium tests the Object Oriented Way’ throughout this post, i will simply use an abbreviation instead: SeOO.

Running the example code is described in a previous post: https://iamalittletester.wordpress.com/2017/01/16/github-project-available-with-code-examples/.

Objects and classes

Since we are talking about Java, everything is an object. I will not go into all the details of objects and classes, but for the purpose of presenting this testing methodology, i will describe the bits and pieces you need as a minimum to be able to use SeOO.

So, the ingredients of a class which will define your object:

  • the object attributes or properties
  • the constructors you will need for creating new object instances
  • the toString() method so that you can output the object to the console. By implementing this method, you will have all the properties of the object displayed in your console, with all their values.
  • the equals() and hashCode() methods. These are necessary when working with Objects, because without implementing them, you will not be able to check whether two objects are the same. More precisely, without these two, you will not be able to compare all the properties of two objects. Therefore, for any object you create, in order to check that two objects are equal, these methods need to be implemented.

I strongly encourage you to do some further reading on the topic:

Disclaimer: This example will be done with IntelliJ, Java 8, Selenium 3.0.1.

Example 1

The requirement

I want to search on Google for different keywords, so that i check that certain search results appear on the first results page:

  • open the Google search page
  • type in the keyword that we are interested in
  • click the search button
  • check that a search result is one that you expect
Phase 1: Analysis

So you have your task. Check for the Google search results page to see that they match your expected content. Now, instead of using a bunch of assertEquals for your tests, you need to look at the page. What you have in a search result entry are three things that you are interested in:

  • the first line, which is the result site title and tagline
  • the second line, which is the URL of the site
  • the third line which is a summary of the site that corresponds to your search

So, in the case of my blog, a search result would look like this (this is just a screenshot from the Google search result page):

searchresult

So, three items need to be compared to their expected values. If you look at the search results page, each search result entry has the same three properties. Therefore, you can consider a search result entry an object with three properties, in this case three Strings. By looking at the full results page you can then think about actually looking at a page full of objects, each having the same three String properties.

Phase 2: Creating the object

The properties

During the first phase, you identified which are the properties of the object you are going to create. And since the object refers to a search result, it will be named SearchResult (well, that’s what i will name it anyway).

The first step will be defining a new class named SearchResult.

Then, the proper naming must be chosen for each of the three properties that define the object. In this case, those Strings will be named, in order to make it simple: site, url, summary.

The next step is defining the constructors for this object, so that you can generate the expected and actual content for your object.

Constructor for the expected content

For the expected content there is an easy way to create the constructor. For the expected, you know exactly what the values of those three properties are, therefore you will construct a new object based on those three values by using the constructor that takes as parameters three Strings, one for each of the properties. This constructor is easy to build, since in IntelliJ there is a shortcut for constructors taking one parameter for each property: within the SearchResult class, hit Alt + Ins on your keyboard.

Then, select Constructor from the dropdown that appears.

The next screen that will be shown will allow you to select which properties you want to be instantiated by the constructor. You will want all, so perform a multiple select on all the attributes displayed in this screen (perform the select with Ctrl or Shift and click).

After going through this screen, the constructor will be generated and you will see it in your class.

At this point, you are able to create as many SearchResult objects you want by calling ‘new SearchResult(siteValue, urlValue, summaryValue)’.

Constructor for the actual content

Getting the actual content means interacting with the page in the browser and acquiring the properties of the search result from the webElements in which these properties are defined.

There are two ways you can define this constructor:

  • you can provide just one webElement as parameter to the constructor; identifying the actual webElements from which you will extract all properties will be done inside the constructor, relatively to the provided webElement. The benefit is that you only pass in one parameter each time you call this constructor, having all the processing done inside the constructor (the processing for finding the webElements that belong to each property).
  • you can provide one webElement for each property as parameters to the constructor; in the constructor you will only extract each property from its’ corresponding webElement (with getText, getAttribute, or whatever else means you need). The disadvantage is that you need to pass many parameters whenever you will call this constructor, instead of passing just the one, as in the above variant.

For the sake of this example, the constructor will have just the one parameter in its’ definition. You will need to write this constructor explicitly (not with an IntelliJ shortcut as for the expected content). The result will be something like this:

Equals, hashCode, toString methods

As i mentioned earlier, in order to compare the actual and expected values for the search result, and in order to properly display them, the equals(), hashCode() and toString() methods need to be generated inside the same class where the properties and the constructors were created.

In handy will come the same Alt + Ins shortcut you used when creating the expected constructor. In the class, hit this key combination, and from the dropdown that appears, first choose the ‘equals() and hashCode()’ entry.

Hit the Next button while going through all the displayed screens, but make sure that whenever the list of your object’s properties is displayed in any of the screens, the checkbox next to each property is checked. The result will be two new methods in your class.

And of course, hit Alt + Ins again and select ‘toString()’ from the dropdown. Here, also make sure the checkbox next to all your properties is checked.

Your class is fully functional once the properties, expected and actual constructors, equals, haschode and toString are implemented.

Phase 3: Creating the PageObject

In order to interact with the pages and generate the content that needs to be checked, the PageObject needs to be created. This will be the webElement representation of the items we are interested in from the search and search result pages. The page object class is named GoogleSearchPage and it will contain the definition for the search field and search icon (the one you click on to trigger the search).

Phase 4: Writing the test

Yay, writing the actual test. The test class name is SearchResultTest, and the only test is called ‘checkTheFirstSearchResult‘ . Well, without going into much detail in this blog post about opening the browser, i will just say that in the @BeforeClass of the test class the browser will be opened, and in the @AfterClass area, it will be closed.

In order to write the test, the expected content will be first defined. For the purpose of fun, the values for each property will be just dummy ones.

Then, the steps that will generate the display of what we want to test will be written:

  • open the Google search page
  • type in the keyword that we are interested in
  • click the search button
  • the checking part: the one assert that checks one of the results against the expected value for it

The actual test code is:

@Test
public void checkTheFirstSearchResult() throws InterruptedException {
     //open google search page
    webDriver.get("https://www.google.com");
    //search for a keyword  
    page.searchField.sendKeys("testListener");
    page.searchIcon.click();
    //wait for the results to be displayed
    WebDriverWait wait = new WebDriverWait(webDriver, 10);
    WebElement element = wait.until(presenceOfElementLocated(className("g")));
    //the checking part - check that the actual content (new SearchResult(element)) equals
    //the expectedSearchResult
    assertEquals(new SearchResult(element), expectedSearchResult);
}

 

Summary

So, in order to write tests that will use the SeOO method, you will need to:

  • identify the objects that can represent the modules you are trying to test
  • write the objects that represent your modules: the properties, the expected constructor, the actual constructor, the equals, hashCode, toString methods
  • write the PageObject class that is needed to interact with the page
  • in the test, compare the actual and expected values generated by calling the two constructors defined in the initial object
Advertisements

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