Lab 6
Synthetic monitoring

Synthetics periodically checks the status of your services and applications. In this section we will monitor the availability of our application using a browser monitor and a lightweight HTTP monitor.

Content

Browser monitor

Lightweight HTTP monitor

Additional resources

Browser monitor

Navigate to Observability > Synthetics > Monitors.

We don't have any monitors configured yet. In the popup, click on select a different monitor type because we want to add some custom configurations.

As a first monitor, we'll create a Multistep monitor.

Give the monitor a name and choose some hosted locations that will run the monitor. Change the frequency to 3 minutes, so we don't have to wait too long for results during the workshop.

Add the following Playwright script in the Script editor.

// Step 1: Go to the website and click the Go Shopping button

step('Go to the website', async () => {

await page.goto('http://' + params.my_ip + ':8080/');

await page.locator('text=Go Shopping').click();

expect(page.url()).toBe('http://' + params.my_ip + ':8080/#hot-products');

});

// Step 2: Calculate the total amount of products and select a random product

step('Select product', async () => {

await page.locator('.sc-8119fd44-1').first().waitFor();

const productCount = await page.locator('.sc-8119fd44-1').count();

const randomProduct = Math.floor(Math.random() * productCount);

await page.locator('.sc-8119fd44-1 >> nth=' + randomProduct).click();

});

// Step 3: Add the selected product to the cart

step('Add product to cart', async () => {

await Promise.all([

page.waitForNavigation(),

page.locator('text=Add To Cart').click()

]);

});

// Step 4: Place order and make sure it succeeded

step('Place order', async () => {

await Promise.all([

page.waitForNavigation(),

page.locator('text=Place Order').click()

]);

await page.locator('text=Done').click();

expect(await page.isVisible('text=Done')).toBeTruthy();

});

The IP address is a variable that you can add below the script in Parameters. Make sure to change it to the public IP of your Strigo machine.

{"my_ip": "<your_public_ip>"}

Next, select Run test to check if the browser monitor works.

If the test run was succesful, go ahead and create the monitor.

Go to the browser monitor that we just created. If there are no results yet, select Run test manually. Go to the detail page of a test run.

The detail page gives an overview of all the steps that were executed and the performance. For a performance breakdown of an individual step, select the icon next to one of the steps.

This give us a LOT of information about the application. It not only checks if the website is online and performant, but it also checks certain functionalities like adding a product to the cart.