Generating Interactive ReportNG Reports For Selenium WebDriver Test

You can not show TestNG default reports to your manager or client because they are not much more readable and Interactive. ReportNG Is very good add-on to generate Interactive and readable reports for selenium webdriver tests. It Is simple HTML reporting plug-In. Also It Is very very easy to configure ReportNG with your selenium project. If you remember, XSLT reports are Interactive too and we have generated XSLT reports In webdriver datadriven framework. If you need XSLT reports then you can READ THIS POST.

Follow bellow given 5 steps to generate ReportNG HTML report.

STEP 1 : Download required Jar Files
You need to download bellow given jar files.
  1. guice-3.0.jar
  2. reportng-1.1.4.jar
  3. velocity-dep-1.4.jar
You can download all above three files from THIS PAGE.

Alternate download locations
  1. Go to THIS PAGE and click on Download link as shown In bellow Image to download reportng-1.1.4.jar and velocity-dep-1.4.jar files.
  2. Go to THIS PAGE and click on guice-3.0.zip download button as shown In bellow Image to download reportng-1.1.4.jar and velocity-dep-1.4.jar file.

STEP 2 : Add Jar Files In Project's Build path
Now you need to add above all three files In project's build path. If you don't know how to add jar files In project's build path then refer "Adding jar Files In Project's Build Path" section on THIS PAGE.

So now your Referenced Libraries folder have three more files as shown In bellow Image.


STEP 3 : Disable default listeners of testng
You need to disable default listeners of testng. 
To disable default listeners
  1. Right click on project folder In eclipse.
  2. Go to Properties. - It will open Properties dialog.
  3. Go to TestNG and check Disable default listeners checkbox as shown In bellow Image and click on OK button.

STEP 4 : Create test cases under your project and configure testng.xml file
My project name Is Test_NG. Now create package under your project with name = Testing_Pack and add bellow given two test cases under that package.

Reportngtest1.java
package Testing_Pack;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.Assert;
import org.testng.annotations.AfterTest;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Test;

public class Reportngtest1 {
 WebDriver driver;
 @BeforeTest
 public void setup() throws Exception {  
  driver =new FirefoxDriver();     
  driver.manage().window().maximize();
  driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
  driver.get("http://only-testing-blog.blogspot.com/2014/04/calc.html");
 }
 
 @Test(priority=1)
 public void Sum_Test() {   
  driver.findElement(By.xpath("//input[@id='Resultbox']")).clear();
  driver.findElement(By.xpath("//input[@id='2']")).click();
  driver.findElement(By.xpath("//input[@id='plus']")).click();
  driver.findElement(By.xpath("//input[@id='6']")).click();
  driver.findElement(By.xpath("//input[@id='equals']")).click();
  String Result = driver.findElement(By.xpath("//input[@id='Resultbox']")).getAttribute("value");
  int ResultInt = Integer.parseInt(Result);
  Assert.assertEquals(8, ResultInt);
 }
 
 @Test(priority=2)
 public void Sub_Test() {   
  driver.findElement(By.xpath("//input[@id='Resultbox']")).clear();
  driver.findElement(By.xpath("//input[@id='4']")).click();
  driver.findElement(By.xpath("//input[@id='minus']")).click();
  driver.findElement(By.xpath("//input[@id='2']")).click();
  driver.findElement(By.xpath("//input[@id='equals']")).click();
  String Result = driver.findElement(By.xpath("//input[@id='Resultbox']")).getAttribute("value");
  int ResultInt = Integer.parseInt(Result);
  Assert.assertEquals(2, ResultInt);
 }
 
 @AfterTest
 public void Close() throws Exception {  
  driver.quit();
 }

}

Reportngtest2.java
package Testing_Pack;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.Assert;
import org.testng.annotations.AfterTest;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Test;

public class Reportngtest2 {
 
 WebDriver driver;
 @BeforeTest
 public void setup() throws Exception {  
  driver =new FirefoxDriver();     
  driver.manage().window().maximize();
  driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
  driver.get("http://only-testing-blog.blogspot.com/2014/04/calc.html");
 }
 
 @Test(priority=1)
 public void mul_Test() {   
  driver.findElement(By.xpath("//input[@id='Resultbox']")).clear();
  driver.findElement(By.xpath("//input[@id='5']")).click();
  driver.findElement(By.xpath("//input[@id='multiply']")).click();
  driver.findElement(By.xpath("//input[@id='4']")).click();
  driver.findElement(By.xpath("//input[@id='equals']")).click();
  String Result = driver.findElement(By.xpath("//input[@id='Resultbox']")).getAttribute("value");
  int ResultInt = Integer.parseInt(Result);
  Assert.assertEquals(20, ResultInt);
 }
 
 @Test(priority=2)
 public void div_Test() {   
  driver.findElement(By.xpath("//input[@id='Resultbox']")).clear();
  driver.findElement(By.xpath("//input[@id='9']")).click();
  driver.findElement(By.xpath("//input[@id='divide']")).click();
  driver.findElement(By.xpath("//input[@id='3']")).click();
  driver.findElement(By.xpath("//input[@id='equals']")).click();
  String Result = driver.findElement(By.xpath("//input[@id='Resultbox']")).getAttribute("value");
  int ResultInt = Integer.parseInt(Result);
  Assert.assertEquals(3, ResultInt);
 }
 
 @AfterTest
 public void Close() throws Exception {  
  driver.quit();
 }

}

Now create testng.xml file under your project folder and add bellow give configuration In It.
<!DOCTYPE suite SYSTEM "http://testng.org/testng-1.0.dtd" >
<suite name="ReportNG  Suite" verbose="1">
 <listeners>
        <listener class-name="org.uncommons.reportng.HTMLReporter"/>
        <listener class-name="org.uncommons.reportng.JUnitXMLReporter"/>
   </listeners>
    <test name="ReportNG1  Test" >
   <classes>
    <class name="Testing_Pack.Reportngtest1" />  
   </classes>
    </test>
  
    <test name="ReportNG2  Test" >
   <classes>  
    <class name="Testing_Pack.Reportngtest2" />
   </classes>
    </test>
</suite>

Pink color Highlighted lines are responsible to generate ReportNG reports so do not forget to Include them In your testng.xml file.

STEP 5 : Execute test and view ReportNG reports
Now run your test cases from testng.xml file. On completion of test execution, refresh your project folder. It will create/update test-output folder. Explore that folder then explore html folder. You will find index.html file Inside It. To open index.html file.
  • Right click on index.html file -> Open With -> Web Browser.
It will open ReportNG HTML Interactive report as shown In bellow Image.


6 comments:

  1. It's such an awsome report, so visually. Thanks in advance

    ReplyDelete
  2. Thanks ! Explained as simple as it can be. Super

    ReplyDelete
  3. eventhough i tried the above steps i am not able to see the html folder In the test-output folder

    ReplyDelete
  4. After adding all three jars , I am not able to run the test cases ,it shows
    java.lang.NoClassDefFoundError: org/apache/commons/collections/ExtendedProperties
    at org.apache.velocity.runtime.RuntimeInstance.(RuntimeInstance.java:160)
    at org.apache.velocity.runtime.RuntimeSingleton.(RuntimeSingleton.java:95)
    at org.apache.velocity.app.Velocity.setProperty(Velocity.java:117)
    at org.uncommons.reportng.AbstractReporter.(AbstractReporter.java:62)
    at org.uncommons.reportng.HTMLReporter.(HTMLReporter.java:80)
    at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)

    ReplyDelete
  5. Could someone tell me what purpose of the second listener?

    ReplyDelete