paint-brush
TypeScript vs JavaScript en la prueba automatizada de API RESTpor@bormando
3,301 lecturas
3,301 lecturas

TypeScript vs JavaScript en la prueba automatizada de API REST

por Dmitrii Bormotov6m2023/08/04
Read on Terminal Reader

Demasiado Largo; Para Leer

TypeScript es un lenguaje de programación que se presenta como un paquete en el ecosistema Node.js. Al utilizar este paquete, puede: 1. Realice importaciones concisas (absolutas) en su proyecto. 2. Cree tipos personalizados para sus cargas útiles de solicitud y respuesta. 3. Utilice las funciones de verificación de tipo e inteligencia para cometer menos errores de sintaxis en su código. Los tipos personalizados también actúan como una documentación para sus datos de carga útil: ¡ya no tendrá que consultar con sus colecciones/herramientas externas para esto!
featured image - TypeScript vs JavaScript en la prueba automatizada de API REST
Dmitrii Bormotov HackerNoon profile picture
0-item

¡Hola a todos!


Mis alumnos y aprendices me inspiraron para escribir este artículo. A menudo recomiendo que aprendan TypeScript tan pronto como se sientan cómodos con el proceso de automatización de pruebas en JavaScript . Veamos cuáles son las características de usar TypeScript en su marco de automatización de pruebas en términos de pruebas de API REST…


Puede encontrar el código completo de un proyecto de prueba aquí .

Mecanografiado

No profundicemos demasiado en qué es TypeScript y en qué se diferencia de JavaScript y digamos lo importante: es el lenguaje de programación . Pero también es muy importante: depende directamente de JavaScript (plataforma Node.js ).


TypeScript se presenta como un paquete de Node.js , por lo que veo esto como JavaScript con algunas características interesantes.


Para obtener más información sobre el lenguaje en sí y lo que tiene para ofrecer, visite el sitio web oficial mientras hablamos sobre sus características en términos de automatización de pruebas...

configuración del proyecto

Repasemos el proceso de creación del proyecto de automatización de pruebas en TypeScript :


  1. Cree un proyecto de Node.js.

    npm init -y

  2. Instale el paquete TypeScript .

    npm i typescript

  3. Genere una configuración predeterminada de TypeScript para el proyecto: tsconfig.json .

    npx tsc --init


El comando anterior generará un archivo de configuración predeterminado, pero recomiendo acortarlo mucho a algo como esto :


 { "compilerOptions": { "baseUrl": "./", "module": "esnext", "target": "esnext", "sourceMap": false, "moduleResolution": "node", "allowJs": true, "skipLibCheck": true, "resolveJsonModule": true, "allowSyntheticDefaultImports": true, "paths": { "*": ["./*"] } } }


Esta configuración contiene el mínimo requerido:


  • utiliza la última versión de EcmaScript ,
  • hace que las importaciones JSON estén disponibles,
  • le permite usar la ruta absoluta en las importaciones.


Puede ampliar su configuración utilizando la documentación oficial .


Selección de herramientas

Puede usar cualquier herramienta que el ecosistema Node.js tenga para ofrecer, pero según mi experiencia, la mayoría de los ingenieros que trabajan con TypeScript eligen Jest por un par de buenas razones:


  • gran apoyo de la comunidad (actualizaciones, respuestas, documentos, ejemplos de código),
  • configuración flexible.


Anteriormente, me divertía usando Mocha + Chai para configurar el núcleo del proyecto, pero ahora también me quedo con Jest , ya que contiene un ejecutor de pruebas y una biblioteca de afirmaciones.


Axios parece ser el cliente HTTP más popular, por lo que sugiero que esta también sea su elección.


No puedo decir que esté obligado a usar esto para su configuración, pero digo que es lo habitual cuando revisa los proyectos.


Ahora, simplemente instale estos paquetes como dependencias:

npm i jest axios

Colecciones de tipos

Algunos paquetes (como Axios ) contienen tipos de TypeScript en su interior, pero Jest y Mocha no. Además, Jest requiere un paquete ts-jest junto con @types/jest para funcionar correctamente: el primero habilita las funciones de TypeScript y el segundo le permite usar IntelliSense .


Así que tenga en cuenta que si no tiene la función de autocompletar cuando intenta usar algunos de los paquetes, probablemente le falten declaraciones de tipo.


Instalemos también las extensiones (paquetes) relacionadas con TypeScript :

npm i ts-jest @types/jest

Configuración

Jest requiere un ajuste preestablecido de configuración ts-jest , por lo que debe declararlo en su archivo de configuración (o paquete.json ):


 { "jest": { "preset": "ts-jest" } }


Si planea usar una ruta absoluta dentro de un proyecto , también deberá ajustar su configuración:


 { "jest": { "preset": "ts-jest", "moduleDirectories": [ "node_modules", "<rootDir>" ] } }


Esta configuración le permite ejecutar pruebas con un comando simple... jest


Entonces, configure su script de prueba en package.json para que sea:


 { "scripts": { "test": "jest" } }


Y luego ejecute sus pruebas en cualquier momento con el comando npm test o npm run test .


Ejecutando pruebas


También le recomiendo que instale una extensión de Jest Runner si es usuario de Visual Studio Code ; le permite ejecutar / depurar las pruebas/suites deseadas con solo un clic. En WebStorm, es una función integrada.


¡Ejecute y depure pruebas con un solo clic!

Tipos personalizados

La característica principal que introduce TypeScript en las pruebas de la API REST es... tipos , ¡por supuesto!


Puede declarar cómo debería verse el cuerpo de su solicitud y respuesta, es decir, nombres clave , tipos de valores y etc.


Tomemos un servidor Paysis como ejemplo: podemos escribir la carga útil del cuerpo de la solicitud para el punto final /auth como un tipo:


 export type AuthRequestBody = { login: string password: string }


Y lo mismo para el cuerpo de respuesta: qué servidor debe enviar a nuestra solicitud:


 export type AuthResponseBody = { token?: string message?: string }


Dado que habría una carga útil diferente para los escenarios de éxito/fracaso, puede marcar las claves como "opcionales" a través de " ?" personaje.


Una vez hecho esto, puede usar estos tipos para redactar solicitudes y verificaciones en sus pruebas...

Pedido

En Axios , puede decir qué cuerpo está enviando a través de la configuración de solicitud:


 const payload: AxiosRequestConfig<AuthRequestBody> = { method: 'post', url: '/auth', data: { login: process.env.USERNAME, password: process.env.PASSWORD, }, }


AuthRequestBody en AxiosRequestConfig<AuthRequestBody> significa exactamente eso ☝️

Significa que se verá obligado a usar la carga útil que coincida con el tipo AuthRequestBody proporcionado en el objeto data . Si olvida establecer algunos campos obligatorios o establece algunos excesivos, verá un error.

Respuesta

Se puede hacer lo mismo con respecto a la respuesta:


 const response: AxiosResponse<AuthResponseBody> = await client.request(payload)


Agregará autocompletar al objeto response.data , por lo que podrá acceder a los campos de response.data.token o response.data.message .

Herramientas avanzadas

Además de las cosas simples anteriores, también es posible generar un esquema JSON a partir de sus tipos personalizados . No le permite verificar cada clave individual en un cuerpo de respuesta para ver si coincide con el esquema, sino verificar toda la carga útil .


Entonces la idea es:


  1. Genere un esquema JSON a partir de tipos personalizados.
  2. Use un comparador personalizado para MatchSchema para validar el cuerpo de la respuesta.


Cosas bastante interesantes, pero tenga en cuenta que sus pruebas pueden volverse inestables después de estos cambios; sucede cuando aparecen algunos campos adicionales, por lo que deberá actualizar el esquema regularmente.

Conclusión

La configuración de TypeScript puede ser complicada, especialmente si es la primera vez, ¡pero vale la pena!


Si cubre sus datos de entrada y salida con tipos, no hay forma de que cometa un error tipográfico o algún otro error de sintaxis cuando analice estos objetos. Lo salva de errores simples y le permite ver la estructura de sus solicitudes directamente en su código, por lo que no tiene que abrir ninguna colección HTTP (como Postman ) y buscar la solicitud que necesita para ver qué cuerpo solicita/responde con.


Cuéntame sobre tu experiencia y lo que piensas al respecto.