Skip to content

Application used to generate reports by uploading a JTL file to a rest server

License

Notifications You must be signed in to change notification settings

pradeepvemulakonda/JMeter-Charts

Repository files navigation

JMeter Charts Application

This application is used to upload JMeter Jtl reports to automatically generate reports.

For detailed usage -> WIKI

Data from the jtl files are extracted and persisted in a mongoDB database.

The data is organized as Project >> version >> build >> report >> data.

The front end is built using JQuery and uses REST API to communicate with the Nodejs application in the backend.

A REST server is created to accept .jtl/.xml files and use an existing xsl stylesheet to populate data in mongodb. This data will be used to display charts in the frontend /html page.

The following Charts are generated using d3.js

  1. Average Response times vs Samples (Bar Chart).
  2. Average Response times vs No of Active Threads (Line Chart).
  3. Average Number of Active Threads vs Execution time(Line Chart).
  4. Compare Versions : - Average Response times vs Samples.
  5. In all Charts selecting the legend(Sample) will toggle the chart element(bar or line) display(show or hide).
  6. Compare two version's response times
  7. Compare two build's response times

Additional info provided.

  • Setup the samples to be used for displaying the charts.
  • Display the latest build and project on login.
  • Provide support to Upload JTL/XML files from frontend.
  • Drag and drop result files(JTL/XML) and upload.
  • Using Requirejs for dependancy management.
  • Following AMD module structure for js files.
Nodejs server uses Express and MongodDB driver.

Installation

Prerequisits
  • Install java 6/7/8
  • Works only on Firefox and Chrome(on IE the report generation does not work, Promises in the code breaks the stuff).

Step 1: bower install (all js components are copied to folder /src/main/web/static/js/lib) Note:rasterizehtml is not a bower dependancy.

Step 2: npm install.

Step 3: Install mongodb.

Step 4: provide the db details src/main/config.json.

Running

Step 1: node app.js in the src/main folder

Step 2: In the frontend if you want to see the report you need to select a project >> And select config tab >> check all the smaples you want to include in your report >> save/set samples.

Usage
* Use the upload report page to upload *.jtl/*.xml files * Use the navigation links to check reports * Use the Action menue on the right side of the report section to download report as pdf. * Use the Action menue on the right side of the chart section to download the image. * To compare two versions select both of the versions and select compare.(same for builds) * Only a single results file can be uploaded at a time.
TODO
* Css to Less. * Unit tests ( Even though there is not much functionality in the backend). * Angualar port. * Display charts in mobile browsers.