Capture response time

Grafana k6 k6-browser
1

How can I capture the response time for a particular action?

Ex
Click a login button, and it lands on the home page. I need to capture the response time between clicking the Login button and the home page

3

Hi @Gerard,

For now, the best way for you to time a click followed by a navigation to another page, is to use Date.now(). You can create a custom metric for this measurement which will be printed out in the summary at the end of the test run.

Here’s a code snippet of how it might look:

import { Trend } from 'k6/metrics';
...
const clickNavTrend = new Trend('click_nav');
...
  var start;
  var end;
...
    start = Date.now();
    return Promise.all([
      page.waitForNavigation(),
      page.locator('input[type="submit"]').click(),
    ]);
  }).then(() => {
    end = Date.now();
    const diff = end - start;
    clickNavTrend.add(diff);

At the end you should see something like:

click_nav........................: avg=395.8    min=374      med=398     max=407      p(90)=404.3    p(95)=405.65

Hope that helps.

Cheers,
Ankur

3 Likes
5

Hi @ankur,
I see your workaround to get the response time of the click event useful.
Is there any other solution to get the response time of await clickButton();

is it possible to get the response time let as demonstrated below
let resp = await clickButton();
console.log(resp.timings.duration);

6

the value we are getting just a number,
image
how to convert this timings to duration

7

We don’t have anything like that at the moment, but thanks for the feedback! We will see what we can do, but can’t say when we will get to it.

8

These values are measured in ms, what do you mean converting them to duration?

9

Hi Ankur,

Once I run the test with your timing workaround and the timings it will come as something below (without ms). Looks like it treat as number.

image

with HTTP calls with default duration option we will get it like ms tag

image
image911×133 6.58 KB

any suggestion to adjust.

10

Hi @gerardlj,

Now i understand your issue. With custom metrics you can’t add a unit to the number and that is why it’s just displayed as a number. If you stream the metrics to a time series database and visualise the data, then you should be able to add units to the dashboard to make it clear what the number means.

It might be worth opening a feature request in Issues · grafana/k6 · GitHub.

Best,
Ankur

11

Hi @gerardlj,

I have to make a correction. So with trend and gauge you can set the metric with time:

const clickNavTrend = new Trend('click_nav', true);

Now it should display the metric with ms:

click_nav...................: avg=492ms    min=492ms   med=492ms    max=492ms    p(90)=492ms    p(95)=492ms

Best,
Ankur

1 Like