---
tags: English
---
# GUI-Layer-Augmented Load Testing - Running JMeter with SideeX

## Protocol-Layer vs. GUI-Layer Load Testing
JMeter is one of the most popular load testing tools in the world. It has been widely adopted in software industry to load test Web applications' functional behavior and performance. Basically, JMeter can simulate a heavy load on a web server in the protocol layer - through HTTP/HTTPS requests. However, as web applications are getting more and more complex, especially the shift from multi-page to single-page applications (SPA), there are more and more interleaved AJAX HTTP/HTTPS requests triggered by sequences of user actions in GUI layer instead of just simple HTTP/HTTPS requests for page navigation. Thanks to [Web Driver Sampler](https://jmeter-plugins.org/wiki/WebDriverSampler/) (a JMeter plugin), load testing can be escalated to the GUI layer with real browsers. However, there still remains two challenges:
1. It is difficult to scale up the load testing in GUI layer by concurrently running a large number of real browsers (even in headless mode).
2. It is a tedious work to write a bunch of WebDriver code for those sequences of complex GUI actions triggering AJAX requests.

## A Hybrid Method: GUI-Layer-Augmented Load Testing
For this situation, a hybrid method is suggested - Using JMeter to fire a large number of simple HTTP/HTTPS requests in order to simulate a heavy load on a web server, meanwhile triggering a relatively small number of GUI actions. At least, through this way, testers can know the real page rendering performance delivered to the end users when the web server is under a heavy load. In order to provide a systematic way for conducting the hybrid method, JMeter is enabled to simultaneously run SideeX-recorded test cases when performing a load test. At the end of load testing, the detail GUI-layer page rendering information will be automatically recorded into the test reports generated by SideeX Runner, including action timings, snapshots, videos, line charts, and logs.

## Running JMeter with SideeX
The basic concept is to let JMeter invoke [SideeX Runner](https://sideex.io/download/) for running test cases recorded by [SideeX Recorder](https://sideex.io/download/thanks) in parallel with the HTTP-Request-type load testing. After the load test, SideeX Runner will generate test reports containing the detail GUI-layer information.

> Prerequisite:
> - [Java SE](https://www.oracle.com/java/technologies/javase-downloads.html)
> - [Node.js](https://nodejs.org)
### Step 1. Prepare the Required Tools
1. Download and open [JMeter](https://jmeter.apache.org/download_jmeter.cgi) (tested version: 5.0)
2. Start the Selenium Server
- Download [Selenium Server](https://www.seleniumhq.org/download/) (Tested version: 3.141.59)
- Download the [browser drivers](/@sideex/book/%2F%40sideex%2Fwebdriver) (Chrome driver is recommended) and put it in the same folder as `selenium-server-standalone-{version}.jar`.
- Open the terminal and switch to the path to the `selenium-server-standalone-{version}.jar`
- Run `java -jar selenium-server-standalone-{version}.jar`
3. Install [SideeX Runner](/@sideex/runner) by running `npm i -g @sideex/runner` in terminal.
4. Prepare a `config.json` file to specify your preferences. Below is an example of the configuration file, see [Appendix A](/@sideex/runner##-Appendix-A---SideeX-Runner-Config-File-Format) for a more detailed config file format.

    {
        "input": {
            "testSuites": ["YOUR_TESTSUITE_FILE_PATH"]
        },

        "webdriver": {
            "configs": [
                {
                    "serverUrl": "http://localhost:4444",
                    "type": "selenium",
                    "browsers":[
                        {
                            "active": true,
                            "capability": {
                                "browserName": "chrome"
                            }
                        }
                    ]
                }
            ]
        },
        "report": {
            "path": "[PATH_TO_SAVE_YOUR_TEST_REPORT]",
            "type":"html",
            "snapshot": 2,
            "snapshotQuality": 20
        }
    }

### Step 2. Create a Thread Group for SideeX Runner in JMeter
1. Right click on the TestPlan, `Add` =>`Threads (User)` => `Thread Group`, you can configure your `Number of Thread` and other details about your thread in this section.
2. Right click on the Thread Group, `Add` =>`Sampler` => `OS Process Sampler`
3. Setup the command and parameters
- For Windows OS, set `Command` to `CMD`. Under `Command Parameters`, add two values, `/C` and `sideex-runner -c {path to your config.json}`
(The config.json file comes from step 1.4)
- For MAC or Linux OS, set `Command` to `/bin/bash`. Under `Command Parameters`, add two values, `-c` and `sideex-runner -c {path to your config.json}`

4. Right click on the Thread Group, `Add` =>`Threads (User)` => `Listener` => `View Results Tree` to show the log of SideeX Runner

### Step 3. Execute the Thread
Click on start button to start your thread
<!--  -->

### Step 4. View the test report
The test report can be found in the directory specified in your `config.json`.

The test report will show the action timings, snapshots, videos, line charts, and logs. The test report can be of [HTML format or JSON format](/@sideex/book/%2F%40sideex%2Freportspec#HTML-Format). Furthermore, the GUI-layer action timings are presented as three line charts. The following line charts shows that the 10th action (clickAt) takes about 9 seconds to complete, which indicates a user will wait for 9 seconds after clicking the button when the server is in heavy load situation.