How to test primefaces component with JSFUnit2

As you may know JSFUnit 2.0.0.Beta 2 is Out!

After successfully execute the JSFUnit2 getting started example on jboss as7, i've triyed the the integration between JSFUnit and primefaces (since it's my favorite JSF components library ;-)

First i've included the primefaces library into my test war archive in the deployement method using MavenDependencyResolver (for further details see this blog entry)

.addAsLibraries(DependencyResolvers.use(MavenDependencyResolver.class)
.configureFrom("src/test/resources/mvn_settings/settings.xml")
.artifact("org.primefaces:primefaces:jar:2.2")
.resolveAs(GenericArchive.class))

If you do not use Maven you can just put the primefaces librairy in a lib folder under WEB-INF folder and add this line to the deployement method :

.addAsWebInfResource(new File("src/main/webapp/WEB-INF/lib/primefaces-2.2.jar"),"lib/primefaces-2.2.jar")

Second, i've modifed the index.xhtml as bellow:

After that i executed my mvn install but i got the error "PrimeFaces" is not defined... humm... may be primefaces resources wasn't injected ...

I've just added the "h:head" tag to the index.xhtml file and my test succed !!!!! witch means that the primefaces resources was included automatically and JSFUnit recognize it now ...

Note that the component test is based on components client ID, so be prudent on your component testing !!

For example if you want to test the calendar component by trying the the setValue method on your test class with the id you have gave to your p:calendar (), you get the error :

java.lang.IllegalArgumentException: This method can not be used on components of type com.gargoylesoftware.htmlunit.html.HtmlSpan

it's normal because the setValue is used for input field not for span ;-) so you should use setValue ("date_input", VALUE) instead of setValue("date",VALUE)

[Tips: you can use Firebug to inspect elements and see their client id]

I'm adding the full example for p:calendar here based on the getting starded example

Test page:

Test method:

public void testInitialPage(JSFServerSession server, JSFClientSession client)
   throws IOException {

// Set the param and submit
String sDate = new Date().toString();
client.setValue("date_input", sDate);
client.click("submit_button");

// Assert that the greeting component is in the component tree and rendered
UIComponent greeting = server.findComponent("greeting");
Assert.assertTrue(greeting.isRendered());

// Test a managed bean using EL. We cheat and use the request object.
Assert.assertEquals(sDate,
       server.getManagedBeanValue("#{request.getParameter('form1:date_input')}"));
}

you can download the full example here

The test was done using primefaces2.2,JSF 2.0, JSFUnit2Beta2, Maven3, Jboss as7

Getting Started with JSF 2 and Primefaces

In this entry we show you how you can start using primefaces with the JSF Mojara reference implementation !

So After setting up your web project with maven and eclipse you just need to import the JSF and Primefaces namespaces into your pages to test the first integration and display some components.

PS:You also need to add primefaces maven dependencies ...

JSF Namespace

JSF namespace is necessary to add JSF tags and components to your pages.

xmlns:f="http://java.sun.com/jsf/core"

xmlns:h="http://java.sun.com/jsf/html"

Primefaces Namespace

PrimeFaces namespace is necessary to add PrimeFaces components to your pages.

xmlns:p="http://primefaces.prime.com.tr/ui"

Test Run

That's it, now you can add a test for JSF and Primefaces component to see if everything is ok.

Congratulation !! executing the application and getting the correct display means JSF and Primefaces are working fine in your web application ...

If you want to deepen your JSF integration test, you can add a JSF managed bean and call it from your page !

Create a managed bean

Briefly a managed bean is a regular Java bean (simple pojo) with a fancy name. When we register the bean with JSF it becomes a managed bean, in other words, it’s now managed by the framework (JSF). For further information see learning-jsf2-managed-beans and whats-new-in-jsf-2

Now, let's create HelloMyBlog our own managed bean !

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

@ManagedBean(name = "helloMyBlog")//or just @Named only from CDI
@RequestScoped
public class HelloMyBlog {
private String webFramework;

public HelloMyBlog(){
webFramework = "JSF 2 and Primefaces";
}

public String getWebFramework() {
return webFramework;
}

public void setWebFramework(String webFramework) {
this.webFramework = webFramework;
}
}

After, we create our view helloMyBlog.xhtml witch use the managed bean HelloMyBlog by name "helloMyBlog" ( @ManagedBean(name = "helloMyBlog"), or just @Named from CDI )

Finaly, Run your application ...

Your web browser should now display the same result as our first test !

Conclusion

We covered in this article the basic test and integration for a simple JSF application with Primefaces component libraries.

Befor going ahead with JSF developpement it's highly recomended to understand the life cycle of a JSF application see JSF application lifecycle

In general JSF is great if you have time to learn it before you have to use it as your main venue for a major project ;-)