Skip to content

Playwright Spec action

This action contains one or several Playwright tests, it can only be used from inside a Playwright virtual user.

Script

When you create a new Playwright Spec action it comes with a default script on our demo application:

playwright-action

Info

More details about the creation process of this script can be found on our blog.

For a more complete overview of all the scripting possibilities, check Playwright official documentation.

OctoPerf provides code auto-completion when using CTRL+Space from inside the script:

code-autocompletion

Variables

Read

Variables can be used inside a PlayWright action using the following syntax: process.env.variableName where variableName is the name of your variable. Here is a real life example:

  await page.locator('input[name="username"]').click();
  await page.locator('input[name="username"]').fill(process.env.login);
  await page.locator('input[name="username"]').press('Tab');
  await page.locator('input[name="password"]').fill(process.env.password);

In this case, both values will be replaced with the variables upon runtime:

variable-debug

Info

In order to use variables inside text for instance in the title of your test, you can use the following: 

test(`test with ${process.env.login}`, async ({page}) => {
Note that the simple quotes around the text have been replaced with backquotes, as instructed by typescript documentation.

Write

While inside a PlayWright action, you can also write variables to be saved for later using setVariableValue("name", "value") simply replace name and value with the variable. The same is true for properties using: setPropertyValue("name", "value")

A typical use case would be to use the following code to extract the value of an input inside the page and then write it to a variable for later use:

  const sourcepageLocator = page.locator('input[name="_sourcePage"]').nth(0);
  const sourcepage = await sourcepageLocator.getAttribute('value');
  setVariableValue('_sourcePage',sourcepage);

Info

You can change the nth(0) to another value to get a different occurrence of this input, in case there are several. For more details, check PlayWright documentation.

Files

It is possible to use files that were placed in the project files menu, using the path ../resources/.

Here's an example of how you would use them:

await page.locator('input[type="file"]').nth(0).setInputFiles('../resources/myfile.txt');

Debug

In order to debug a Playwright virtual user we are first going to create two script actions as described in the tabs below:

Petstore login

import {test, expect} from '@playwright/test';

test('test', async ({page}) => {
    await page.goto('https://petstore.octoperf.com/');
    await page.getByRole('link', {name: 'Enter the Store'}).click();
    await page.getByRole('link', {name: 'Sign In'}).click();
    await page.locator('input[name="username"]').click();
    await page.locator('input[name="username"]').fill('user1');
    await page.locator('input[name="password"]').click();
    await page.locator('input[name="password"]').fill('pass');
    await page.getByRole('button', {name: 'Login'}).click();
    await page.locator('#SidebarContent').getByRole('link').first().click();
    await page.getByRole('link', {name: 'FI-SW-01'}).click();
    await page.getByRole('link', {name: 'EST-1'}).click();
    await page.getByRole('link', {name: 'Add to Cart'}).click();
});

import {test, expect} from '@playwright/test';

test('test fail', async ({page}) => {
    await page.goto('https://petstore.octoperf.com/');
    await page.getByRole('link', {name: 'Enter the Store'}).click();
    await page.getByRole('link', {name: 'Sign In'}).click();
    await page.locator('#stripes--1962445802').click();
    await page.locator('#stripes--1962445802').fill('user1');
    await page.locator('input[name="password"]').click();
    await page.locator('input[name="password"]').fill('pass');
});

Now when you run a validation you can check the Debug panel to see the details:

debug

Warning

If you are getting certificates errors like ERR_CERT_AUTHORITY_INVALID make sure to add the proper configuration in order to ignore https errors in your script.

Trace

A nice way to see the details of a run is to use the Playwright Trace viewer. In OctoPerf you use the trace button or when you click on the icon next to your playwright action name in the debug menu. This opens the trace viewer in a new tab:

trace-viewer

Note

Each trace is also available along with the logs and files of the validation.

Aggregators

With no aggregation, results like response times will be reported for every URL of your playwright script. That means any URL with a dynamic parameter will be reported individually.

Aggregators allow you to bypass that and group requests based on a regex expression. That way you can have the averaged values for a group of similar requests.

In order to experiment with aggregators, it is best to use the debug tab after a validation, the difference is visible using the Raw/Aggregated buttons in the bottom section:

not-aggregated

aggregated