Today you’re going to see how to automate the unit testing of your PrimeFaces application.
The best part?
We will use the PageObject pattern.
So let’s get to work.
If you want to learn more about PrimeFaces for JSF – head on over to the JSF PrimeFaces tutorials page.
1. What is Selenium?
Selenium is a software testing framework for web applications. Tests can be run against most modern web browsers and can be controlled by many programming languages.
Selenium is available as open-source software, released under the Apache 2.0 license.
The following example shows how to set up an automated unit test for your PrimeFaces web application using Selenium, Spring Boot, and Maven.
2. General Project Overview
We will use the following tools/frameworks:
PrimeFaces 6.2
JoinFaces 3.3
Spring Boot 2.1
Selenium 3.14
Maven 3.5
Our project has the following directory structure:
3. Maven Setup
We start from a previous Spring Boot Primefaces Tutorial in which we created a greeting dialog based on a first and last name input form.
We add spring-boot-starter-test to the existing Maven POM file. This will include the core dependencies for testing Spring Boot applications with libraries that include JUnit, Hamcrest and Mockito.
In order to create local Selenium scripts, we need to make use of language-specific client drivers. As this example is based on Java we include the selenium-java client dependency.
The key interface against which tests should be written in Java is the WebDriver interface which has a number of implementing classes.
For this example, we will use HtmlUnitDriver which is a WebDriver compatible driver for the HtmlUnit headless browser. As such we also add the htmlunit-driver dependency.
4. Creating a PrimeFaces Test Page
To test the PrimeFaces Hello World page, we will use the PageObject pattern. Within our web app’s UI there are areas that our test will interact with (in this example input/output text fields and a button). A page object simply models these as objects within the test code.
The basic rule of thumb for a page object is that it should allow a software client to do anything and see anything that a human can. It should also provide an interface that’s easy to program to and hides the underlying widgetry in the window. In this example, the page object is the HelloWorldPage class shown below.
In order to set/get the input/output field values we lookup the corresponding WebElements using the @FindBy annotation. Matching is done using the ‘id’ of the HTML elements which are specified in the helloworld.xhtml located under src/main/resources/META-INF/resources. The submit button is also retrieved using its corresponding ID.
Note that @FindBy is just an alternate way of finding elements. You could also use the findElement() method on the WebDriver.
The JSF framework prefixes HTML elements inside a <form> with the ID of the form. If no ID is present then one will be auto-generated.
Next, we represent our submit button as a submit() method that takes a first and last name as an input parameter. These parameters are set on the corresponding input fields and the submit button is executed. The method finishes by reloading the page elements so that the greeting output field is set with the new value.
The getGreeting() method allows to retrieve the greeting shown to the user. Note that we used getAttribute("textContent") as using getText()returns an empty string.
Notice that the above HelloWorldPage page object extends a PageObject class. This is a small helper class that uses the PageFactory factory class provided by the WebDriver’s support library to help realize the PageObject pattern.
In the constructor, the PageFactory is used to instantiate WebElements that we have annotated in the HelloWorldPage class.
In our test case, we navigate to the Hello World web page using the get() method of the WebDriver. We create a new instance of our HelloWorldPage page object and call the submit() method.
Finally, an assert is used to verify that the correct greeting is generated.