Parametrización en Playwright

La parametrización es una técnica que permite la ejecución de la misma prueba con varias entradas. Esta guía aborda los problemas que la parametrización puede resolver, cómo implementarla en Playwright y su integración con Allure Report.

1. Preparación

Prerrequisitos

Asegúrate de tener:

• Allure Report instalado
• NodeJS instalado

Lista de dependencias

Esta guía utiliza los siguientes paquetes:

• @playwright/test: 1.51.1
• allure-playwright: 3.2.0
• allure-js-commons: 3.2.0

Ejemplo de código

El código fuente utilizado en esta guía está disponible en https://github.com/allure-examples/guide-playwright-parameterization.

Configuración

Para ejecutar los ejemplos de esta guía:

1. Instala Node.js

2. Instala Allure Report

3. Descarga un proyecto nuevo con Playwright desde Allure Start

4. Navega al directorio del proyecto e instala las dependencias usando un gestor de paquetes de tu elección:

   npm

   npm install

   yarn

   yarn install

   pnpm

   pnpm install

5. Ejecuta el proyecto:

   npm

   npm test

   yarn

   yarn test

   pnpm

   pnpm test

6. Abre Alure Report:

   allure serve

2. Beneficios de la parametrización

Vamos a comenzar con una función simple. Queremos verificar si la suma de dos números da la respuesta correcta:

JavaScript

import { expect, test } from "playwright/test";

const sum = (a, b) => {
  return a + b;
};

test("basic sum", () => {
  expect(sum(1, 2)).toBe(3);
});

TypeScript

import { expect, test } from "playwright/test";

const sum = (a: number, b: number) => {
  return a + b;
};

test("basic sum", () => {
  expect(sum(1, 2)).toBe(3);
});

A continuación, queremos probar esta función con diferentes conjuntos de datos.

La primera idea podría ser usar un bucle en la prueba y verificar cada resultado dentro del bucle. Podría verse así:

JavaScript

import { expect, test } from "playwright/test";

test("loop sum", () => {
  [
    [1, 2, 3],
    [1, -1, 0],
    [0, 0, 0],
  ].forEach((testData) => {
    await expect(sum(testData[0], testData[1])).toBe(testData[2]);
  });
});

TypeScript

import { expect, test } from "playwright/test";

test("loop sum", () => {
  const testData: [number, number, number][] = [
    [1, 2, 3],
    [1, -1, 0],
    [0, 0, 0],
  ];

  for (const [a, b, expected] of testData) {
    expect(sum(a, b)).toBe(expected);
  }
});

Este método tiene varios problemas:

1. Si la prueba falla para un conjunto de datos, no verificará el resto.
2. Los datos se almacenan en un array y no hay nombres de variables claros, lo que dificulta la comprensión. Esto no es muy evidente aquí, pero en una prueba más organizada sería más notable.
3. El informe de prueba solo muestra el nombre de la prueba, no qué conjunto de datos específico causó el problema. No hay forma de hacerlo más claro con esta configuración.

Playwright tiene una mejor solución: parametrización. Podemos usar un bucle forEach, como antes, pero esta vez colocamos la prueba dentro del bucle y la entrada dentro del título de la función de prueba:

JavaScript

import { expect, test } from "playwright/test";

[
  { x: 1, y: 2, expectedSum: 3 },
  { x: 1, y: -1, expectedSum: 0 },
  { x: 0, y: 0, expectedSum: 0 },
].forEach(({ x, y, expectedSum }) => {
  test("the sum of ${x} and ${y} should be ${expectedSum}", () => {
    expect(sum(x, y)).toBe(expectedSum);
  });
});

TypeScript

import { expect, test } from "playwright/test";

const testCases: { x: number; y: number; expectedSum: number }[] = [
  { x: 1, y: 2, expectedSum: 3 },
  { x: 1, y: -1, expectedSum: 0 },
  { x: 0, y: 0, expectedSum: 0 },
];

testCases.forEach(({ x, y, expectedSum }) => {
  test("the sum of ${x} and ${y} should be ${expectedSum}", () => {
    expect(sum(x, y)).toBe(expectedSum);
  });
});

Este método soluciona los problemas mencionados anteriormente:

1. La prueba se ejecuta varias veces y, aunque una falle, las demás seguirán proporcionando retroalimentación.
2. Los datos ahora se acceden usando nombres de variables claros (x, y y expectedSum), lo que facilita la comprensión.
3. En un informe de prueba, cada ejecución de prueba se muestra como una entrada separada, lo que lo hace más claro.

3. Parametrización en Allure Report

Allure Report se integra con Playwright y admite pruebas automatizadas parametrizadas. De forma predeterminada, las pruebas parametrizadas aparecen en Allure Report como pruebas separadas sin distinción para las entradas parametrizadas.

Para hacer que las entradas parametrizadas aparezcan en Allure Report, debes usar la función allure.parameter(). Esta crea un nuevo parámetro con un nombre y valor dados y fuerza su visualización en el informe, pero no cambia ni oculta los parámetros existentes. Por ejemplo:

JavaScript

import * as allure from "allure-js-commons";
import { expect, test } from "playwright/test";

[
  { x: 1, y: 2, expectedSum: 3 },
  { x: 1, y: -1, expectedSum: 0 },
  { x: 0, y: 0, expectedSum: 0 },
].forEach(({ x, y, expectedSum }) => {
  test("the sum of ${x} and ${y} should be ${expectedSum}", async () => {
    await allure.parameter("x", x);
    await allure.parameter("y", y);
    await allure.parameter("expectedSum", expectedSum);

    expect(sum(x, y)).toBe(expectedSum);
  });
});

TypeScript

import * as allure from "allure-js-commons";
import { expect, test } from "playwright/test";

const testCases: { x: number; y: number; expectedSum: number }[] = [
  { x: 1, y: 2, expectedSum: 3 },
  { x: 1, y: -1, expectedSum: 0 },
  { x: 0, y: 0, expectedSum: 0 },
];

testCases.forEach(({ x, y, expectedSum }) => {
  test("the sum of ${x} and ${y} should be ${expectedSum}", async () => {
    await allure.parameter("x", x.toString());
    await allure.parameter("y", y.toString());
    await allure.parameter("expectedSum", expectedSum.toString());

    expect(sum(x, y)).toBe(expectedSum);
  });
});

Con esto, Allure Report comienza a mostrar los parámetros en los resultados de prueba:

La función allure.parameter() tiene un argumento adicional options. Si se proporciona, debe ser un objeto con las siguientes propiedades:

1. excluded (Booleano, por defecto false) define cómo Allure Report trata el parámetro si cambia el valor entre ejecuciones de prueba. Por ejemplo, si pasas una marca de tiempo actual como valor de parámetro, diferirá en cada repetición de prueba. De forma predeterminada, Allure Report trata las pruebas con dichos parámetros como diferentes y muestra cada repetición por separado. Para evitar esto, puedes establecer excluded en true. Lee más en Historial y reintentos.

2. mode (cadena de texto) define cómo aparece el parámetro en Allure Report. Valores posibles:

   • "default": el nombre y el valor del parámetro aparecen en Allure Report tal como son.
   • "masked": el nombre del parámetro aparece en Allure Report, pero el valor está oculto. Puedes usar este modo para contraseñas, tokens y otros parámetros sensibles.
   • "hidden": el nombre y el valor del parámetro no aparecen en Allure Report. Un caso de uso común es ocultar un parámetro cuyo único propósito es separar los resultados de prueba obtenidos de diferentes entornos. Puedes aprender más aquí.

   Ten en cuenta que los parámetros con { mode: "masked" } o { mode: "hidden" } aún pueden extraerse del directorio allure_results.

Un ejemplo del uso de la función allure.parameter() con el objeto options:

import { test } from "@playwright/test";
import * as allure from "allure-js-commons";

for (const login of ["johndoe", "[email protected]"]) {
  test(`Test Authentication as ${login}`, async () => {
    await allure.parameter("login", login, { mode: "masked" });
    await allure.parameter("time", new Date().toUTCString(), { excluded: true });
    // ...
  });
}

4. Conclusión

Allure Report funciona de forma nativa con la parametrización en Playwright y no requiere configuración ni código adicional. Este enfoque de prueba permite ejecutar la misma prueba con diferentes conjuntos de datos, lo que ayuda a reducir la repetición y simplifica el proceso al evitar la necesidad de recorrer los datos manualmente.

Para hacer que el informe de prueba sea más claro, también puedes agregar parámetros a tus pruebas y controlar su apariencia en Allure Report.