Utilice AskUI y Cucumber juntos

Al definir el comportamiento de un sistema en un formato estructurado como Gherkin, el desarrollo basado en el comportamiento (BDD) permite a los equipos cerrar la brecha entre las partes interesadas, los evaluadores y los desarrolladores, evitando malentendidos y reduciendo la repetición del trabajo. Como enfoque colaborativo, BDD anima a todas las partes a trabajar juntas desde el principio, garantizando que todos estén en
la misma página y que los requisitos se capturen con precisión.

En este proceso, Cucumber es una herramienta popular utilizada para implementar BDD, lo que permite a los equipos escribir pruebas claras y ejecutables que garantizan que el sistema se comporta como se espera.

En esta publicación de blog, le mostraremos cómo configurar Cucumber junto con AskUI para definir los flujos de trabajo de AskUI utilizando los principios de BDD.

Requisitos previos

• AskUI instalado y configurado en su sistema (Windows, Linux, macOS)

• Eliminar Askui_example/my-first-askui-test-suite.test.ts después de la inicialización

Preparar la configuración

Pepino aún no funciona bien con la configuración predeterminada de AskUI (Versión 0.20.3). Para que AskUI funcione bien con Cucumber, debes hacer dos pequeños preparativos, ya que AskUI usa Jest como ejecutor.

1. Cambie las opciones de entorno de prueba de Jest

En el archivo Askui_example/helpers/jest.config.ts tienes que desactivar que el código se incluya en el informe de ejecución. Esto se logra agregando una propiedad testEnvironmentOptions con la propiedad addCodeInReport establecida en false.

const config: Config.InitialOptions = {
  ...
  testEnvironment: '@askui/jest-allure-circus',
  testEnvironmentOptions: {
    addCodeInReport: false
  },
};
...

2. Dígale a Jest dónde encontrar la implementación de las definiciones de pasos

También en Askui_example/helpers/jest.config.ts necesita expandir la propiedad testMatch predeterminada. Debe incluir archivos que terminen en step.ts porque almacenaremos la implementación allí.

...
const config: Config.InitialOptions = {
  ...
  testEnvironment: '@askui/jest-allure-circus',
  testEnvironmentOptions: {
    addCodeInReport: false
  },
  testMatch: [ "**/__tests__/**/*.[jt]s?(x)", "**/?(*.) (spec|test|step).[jt]s?(x)" ]
};
...

s?(x)", "**/?(*.) (especificación|prueba|paso).[jt]s?(x)" ] }; ...

Instalar broma-pepino

La forma más sencilla de utilizar Jest junto con Cucumber es el paquete npm jest-cucumber. Instalémoslo con el siguiente comando:

npm install --save-dev jest-cucumber

instalación npm --save-dev broma-cucumber

Crear un archivo de características básicas

Cree una carpeta de características y allí un archivo Características
NavigateToWebsite.feature

npm install --save-dev jest-cucumber

raíz_proyecto/ ├─askui_ejemplo/ ├─ características/ ├─ Función Navegar al sitio web ├─ módulos_nodo/ ├─...

Escriba la siguiente función
básica en este archivo:

npm install --save-dev jest-cucumber

Función: navegar a un sitio web Escenario: ingresar la URL correcta en la barra de direcciones del navegador Dado que estoy en la página de búsqueda de Google. Cuando escribo la URL de la página de práctica de AskUI Entonces aterrizaré en la página web.

Crear las implementaciones de definiciones de pasos

Cree el archivo de definición de pasos Askui_example/navigate-to-url.step.ts donde cada prueba se asigna a un escenario específico.

npm install --save-dev jest-cucumber

importar {defineFeature, loadFeature} de 'jest-cucumber'; importar { aui } desde './helpers/askui-helper'; // Carga el archivo de características característica constante = loadFeature('características/NavigateToWebsite.feature'); definirCaracterística(característica, prueba => { // Se asigna al 'Escenario' en su archivo de funciones test('Ingresando la URL correcta en la barra de direcciones del navegador', ({ dado, cuando, luego }) => { dado('Estoy en la página de búsqueda de Google', async() => { espere aui.moveMouse(500, 500).exec(); espere aui.mouseLeftClick().exec(); espere aui.pressTwoKeys('command', 't').exec(); }); cuando('Escribo la URL de la página de práctica de AskUI', async() => { espere aui.typeIn('https://askui.github.io/askui-practice-page/').textfield().exec(); espere aui.pressKey('enter').exec(); }); then('Iré a la página web', async () => { await aui.expect().text('Bienvenido a la página de práctica de AskUI').exists().exec(); }); }); });

Ejecute el flujo de trabajo

Abre tu navegador en pantalla completa e inicia el flujo de trabajo con:

npm install --save-dev jest-cucumber

npm ejecuta Askui

Deberías ver que la ejecución del flujo de trabajo abrirá una nueva pestaña y navegará a la página de práctica de AskUI.

Conclusión

La combinación de AskUI con Cucumber le permite escribir flujos de trabajo de AskUI en estilo BDD. Ejecutar sus pruebas como un usuario humano real las hará más realistas para todas las partes interesadas.