Run massively scalable performance tests on web, mobile, and APIs

Request a Demo
Jan. 2nd, 2019

3 Ways to Load and UI Test Meteor JS Applications with JMeter

Meteor (MeteorJS) is a free and open-source web platform framework for developing real-time JavaScript web applications. Meteor uses the Distributed Data Protocol (DDP) to communicate with applications. DDP is a client-server protocol for requesting/updating data on the server side and for synchronizing updates between the clients. Now let’s say that you need to run an Apache JMeter™ load test for an application written in MeteorJS. In this blog post, we will show you how, by implementing methods for testing DDP.

 

To demonstrate how to write a JMeter script that communicates with Meteor applications/over DDP, we have created a demo test application. This application has one HTML element and one API method. This example test application is deployed on localhost and works on port 3000. The application can be downloaded here.

 

Let's see 3 ways of solving this problem:

 

WebSocket Samplers: Solution 1

 

According to the DDP protocol specification, we can use SockJS or WebSockets as a lower-level message transport. So, we can run a test on the WebSocket protocol. We will use Websocket Samplers by Peter Doornbosch for this test.

 

Learn about testing Websockets from these two blog posts:

 

To begin the test:

 

1. Open a connection to the application, by adding the WebSocket Open Connection Sampler. In this case, we used our demo application.

 

2. In the "Path" field, according to the DDP specification, we should specify /websocket. Configure the rest of the sampler: server name, connection timeout, etc. Here's what you should get:

 

load test meteor with jmeter

 

Now, let’s configure sending messages and creating an interaction with the test application.

 

3. Add the “WebSocket request-response Sampler” to the script, to send messages through the opened connection.

 

4. Select the “use existing connection” radiobutton.

 

5. Add the the message text into the “Request data” field.

 

jmeter meteor js load testing

 

If you don’t know which messages and in what form the application expects them from you, then you can do the following:

  • Open Google Chrome Developer Console (F12), and reload the page.
  • Select the Network tab, section WS.
  • Select the “websocket” request, and the section Frames on the right.
  • Select any frame and copy its message text from the window that appears below. The desired part of the text is highlighted in red.
  • Copy and paste the messages into the sampler.

 

websocket sampler testing with jmeter for meteorjs, ddp

 

Thus, following the format shown above, we can perform load testing of our Meteor JS application.

 

Small important hint: If you know that your application returns several messages at once, just add the required number of WebSocket Single Read Samplers after the request. We can also extract values from the response, and send the variable in another message — that is, just like with the HTTP requests.

 

6. Finally, after we have completed all the preparatory steps, we can start testing our simple API in the form of the Meteor.methods. In our application, the method is called “increment”, and it increments the button click count in the UI. Using the same scheme and the same sampler, we will send:

 

{"msg":"method","method":"increment","params":[],"id":"${someId}"}

 

This is what this script will look like:

 

Meteor JS application testing tutorial

 

You can download the script from this link.

 

Apache Groovy: Solution 2

 

A second solution is to add Groovy code to interact with our application. Groovy is highly flexible, allowing us to customize our script to our needs. This makes it the perfect solution to testing MeteorJS.

 

To do this, we first need a java ddp client and Java-WebSocket-1.3.4.jar files in our /lib folder.

 

Then in our JMeter script we will add a JSR223 Sampler with the following Groovy code:


import com.keysolutions.ddpclient.*
import java.util.*

DDPClient client = new DDPClient("localhost", 3000)
client.connect()
Thread.sleep(1500)
client.call("increment")
Thread.sleep(1500)
client.disconnect()

 

Replace the DDPClient value (in our case: “"localhost", 3000”) according to your app.

 

Using this code, we connect to test a MeteorJs application by DDP, and call it by an “increment” method. You can also replace the "increment" method with the one you need.

 

This is what this script will look like:

 

groovy testing for jmeter meteor js

 

This is the received response for a JSR223 sampler request in the JMeter log DEBUG level.

 

tutorial for jmeter testing, meteor js

 

You can download this script from this link.

 

Selenium: Solution 3

 

The approaches discussed above make it possible to perform testing (including load testing) of Meteor JS application in terms of the backend. But you might also want to test it in terms of working in a web browser. This task is solved quite simply, since the interaction with the UI looks exactly like in any other web-application. We will use Selenium for this. We need the “Selenium/WebDriver Support” JMeter plugin, and a webdriver app, for example chromedriver.

 

Let's create a script and add the following elements to it:

 

1. jp@gc - Chrome Driver Config. The only one setting we need here is on the Chrome tab:

 

ui testing of meteor js with jmeter and selenium

 

2. jp@gc - WebDriver Sampler, with some Selenium code. This code will be discussed below.

 

Now we have almost everything we need. Suppose that our application has a button in UI, as well as the count of the number of clicks on it. This means that in order to click on this button, you need to have an identifier for it. To find out this identifier is very simple - you need to either look at the code of the page, or install the Selenium IDE extension for your browser and use the recorder. We recommend reading about first steps in Selenium, and Selenium documentation.

 

As a result, we get the following script:

 

jmeter webdriver sampler testing example

 

3. Add the following code to the “jp@gc - WebDriver Sampler”:

 

{
var pkg = JavaImporter(org.openqa.selenium); 
var support_ui = JavaImporter(org.openqa.selenium.support.ui.WebDriverWait); 

WDS.sampleResult.sampleStart()
WDS.browser.get('http://localhost:3000')
java.lang.Thread.sleep(3000);

var clickTheButton = WDS.browser.findElement(pkg.By.cssSelector('button'));
for (i=1; i<=5; i++)
{ 
	clickTheButton.click(); //click the button
	java.lang.Thread.sleep(1500);
}

java.lang.Thread.sleep(3500);
WDS.sampleResult.sampleEnd()
}

 

To adapt the script to your needs, change the following:

  • Change WDS.browser.get('http://localhost:3000') and set the address for your own application
  • Change the scenario - pkg.By.cssSelector('button')); defines its own element in the interface.

 

You can download this script from this link.

 

That’s it! Now you know what the Meteor JS application is and how its API and UI can be performance tested. The script, which includes all three approaches, can be downloaded here.

 

Test DDP with BlazeMeter

 

After creating your JMeter script, just upload it to BlazeMeter and run it. You will be able to scale in the cloud, run tests more smoothly and get advanced reporting. To try out BlazeMeter, put your URL in the box below and your test will start in minutes. So start testing now!

     
arrow Please enter a valid URL

Interested in writing for our Blog? Send us a pitch!