Playwright engine: add version of `step` which returns the value of the inner action.

[danidiaz]

In the Playwright engine, the test.step argument received by test functions can be used to emit custom metrics that represent how long each step takes.

It has the TypeScript type:

export type PlaywrightEngineTestParam = {
  step: (stepName: string, userActions: Function) => Promise<void>
};

It returns a Promise<void>. However, for some purposes, I would prefer a version that returned the result of the inner action. Something like

stepWithResult: <T> (stepName: string, userActions: fn: () => Promise<T>) => Promise<T>

The motivation is that I'm using the "page objects" pattern for my Playwright code. And it's common for some page object methods to perform a navigation and return the page object for the destination page. It becomes difficult to both measure the timing and get hold of the new page object.

Right now I'm using my own histogram-emitting function on top of the events.emit parameter, which I hope it's equivalent.

Additionally, for some steps that are prone to fail (not only take a long time) under high load, I want to set a counter that tracks how many times that particular step failed. So I would also like to have something like

stepWithResultCountErrors: <T> (stepName: string, errorCounterName: string, userActions: fn: () => Promise<T>) => Promise<T>

Or perhaps there's a better approach for tracking step failures?

[hassy]

I agree, test.step() should return the value of the callback like it does in Playwright Test Runner: https://playwright.dev/docs/api/class-test#test-step:~:text=Object%3E%23-,Details,-The%20method%20returns

[danidiaz]

Right now, I'm using this utility class:

import { VUEvents } from "artillery";

export class StepTracker {
  constructor(
    private events: VUEvents,
    private histogram: string,
    private errorCounter?: string,
  ) {}

  async step<T>(fn: () => Promise<T>): Promise<T> {
    try {
      const startedTime = Date.now();
      const result = await fn();
      const end = Date.now();
      const difference = end - startedTime;
      this.events.emit("histogram", this.histogram, difference);
      return result;
    } catch (error) {
      if (this.errorCounter !== undefined) {
        this.events.emit("counter", this.errorCounter, 1);
      }
      throw error;
    }
  }
}

however, I'm not sure how to get hold within the test of $rewriteMetricName, which the real step argument uses:

    const step = async (stepName, userActions) => {
      const startedTime = Date.now();
      await userActions();
      const difference = Date.now() - startedTime;

      events.emit(
        'histogram',
        self.processor.$rewriteMetricName(
          `browser.step.${stepName}`,
          'histogram'
        ),
        difference
      );
    };