Cómo probar las API REST de Express.js usando Cypress

Cypress es un marco de prueba popular diseñado para aplicaciones JavaScript. Si bien está diseñado principalmente para probar componentes de la interfaz de usuario e interacciones con elementos de la interfaz de usuario en un navegador, también es Muy adecuado para probar API. Puede utilizar el marco para probar las API RESTful a través de solicitudes HTTP y validar el respuestas.

Cypress le permite escribir pruebas integrales que abarcan todo el espectro del flujo de trabajo de su aplicación web.

Comenzando con las pruebas de API usando Cypress

Cypress le ayuda a verificar que sus API funcionen como espera. Este proceso normalmente incluye probar los puntos finales de la API, los datos de entrada y las respuestas HTTP. Puede verificar la integración con cualquier servicio externo y confirmar que los mecanismos de manejo de errores funcionan correctamente.

Probar sus API garantiza que sean funcionales, confiables y satisfagan las necesidades de las aplicaciones que dependen de ellas. Ayuda a identificar y corregir errores desde el principio, evitando que se produzcan problemas en producción.

Ciprés es una excelente herramienta de prueba de UI, utilizada por algunos de los marcos de JavaScript populares. Su capacidad para realizar y probar solicitudes HTTP lo hace igualmente eficaz para probar API.

Para ello, utiliza Node.js como motor para realizar solicitudes HTTP y manejar sus respuestas.

Puedes encontrar el código de este proyecto en su GitHub repositorio.

Cree una API REST de Express.js

Para empezar, crear un servidor web Expresse instale este paquete en su proyecto:

npm install cors

A continuación, agregue el paquete Cypress a su proyecto:

npm install cypress --save-dev

Finalmente, actualiza tu paquete.json archivo para incluir este script de prueba:

"test": "npx cypress open"

Definir los controladores API

En un caso del mundo real, haría llamadas API para leer y escribir datos desde una base de datos o una API externa. Sin embargo, para este ejemplo, simulará y probará dichas llamadas API agregando y recuperando datos de usuario de una matriz.

En el directorio raíz de la carpeta de su proyecto, cree un controladores/userControllers.js archivo y agregue el siguiente código.

Primero, defina un registrarseUsuario Función de controlador que gestionará la ruta de registro del usuario. Extraerá los datos del usuario del cuerpo de la solicitud, creará un nuevo objeto de usuario y lo agregará al usuarios formación. Si el proceso es exitoso, debería responder con un código de estado 201 y un mensaje indicando que ha registrado al usuario.

const users = [];
exports.registerUser = async (req, res) => {
const { username, password } = req.body;
try {
const newUser = { username, password };
 users.push(newUser);
 res.status(201).send({ message: 'User registered successfully' });
 } catch (error) {
console.error(error);
 res.status(500).send({ message: 'An error occurred!!' });
 }
};

Agregue una segunda función—obtener usuarios: para recuperar datos del usuario de la matriz y devolverlos como respuesta JSON.

exports.getUsers = async (req, res) => {
try {
 res.json(users);
 } catch (error) {
console.error(error);
 res.status(500).send({ message: 'An error occurred!!' });
 }
};

Por último, también puedes simular intentos de inicio de sesión. En el mismo archivo, agregue este código para verificar si el nombre de usuario y la contraseña proporcionados coinciden con algún dato de usuario en el usuarios formación:

exports.loginUser = async (req, res) => {
const { username, password } = req.body;
try {
const user = users.find((u) =>
 u.username username && u.password password);
if (user) {
 res.status(200).send({ message: 'Login successful' });
 } else {
 res.status(401).send({ message: 'Invalid credentials' });
 }
 } catch (error) {
console.error(error);
 res.status(500).send({ message: 'An error occurred!!' });
 }
};

Definir las rutas API

Para definir las rutas para su API REST Express, cree una nueva rutas/userRoutes.js archivo en el directorio raíz y agréguele este código:

const express = require('express');
const router = express.Router();
const userControllers = require('../controllers/userControllers');
const baseURL = '/v1/api/';
router.post(baseURL + 'register', userControllers.registerUser);
router.get(baseURL + 'users', userControllers.getUsers);
router.post(baseURL + 'login', userControllers.loginUser);
module.exports = router;

Actualice el archivo Server.js

Actualizar el servidor.js archivo para configurar la API de la siguiente manera:

const express = require('express');
const cors = require('cors');
const app = express();
const port = 5000;
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
app.use(cors());
const userRoutes = require('./routes/userRoutes');
app.use('/', userRoutes);
app.listen(port, () => {
console.log(`Server is listening at http://localhost:${port}`);
});
module.exports = app;

Configurar el entorno de prueba

Con la API de demostración implementada, está listo para configurar el entorno de prueba. Inicie el servidor de desarrollo con este comando de terminal:

node server.js

A continuación, ejecute el comando del script de prueba en una terminal separada:

npm run test

Este comando iniciará el cliente de escritorio Cypress, que proporciona el entorno de prueba. Una vez que esté abierto, haga clic en el Pruebas E2E botón. Las pruebas de un extremo a otro garantizan que pruebe la API Express en su conjunto, lo que significa que Cypress tendrá acceso al servidor web, las rutas y las funciones del controlador asociadas.

A continuación, haga clic Continuar para agregar archivos de configuración de Cypress.

Una vez que se complete el proceso de configuración, debería ver una nueva carpeta Cypress en su proyecto. Cypress también agregará un cypress.config.js archivo que contiene los ajustes de configuración para sus pruebas.

Continúe y actualice este archivo para incluir la URL base de su servidor de la siguiente manera:

const { defineConfig } = require("cypress");
module.exports = defineConfig({
 chromeWebSecurity: false,
 e2e: {
 baseUrl: 'http://localhost: 5000',
 setupNodeEvents(on, config) { 
 },
 },
});

Escribir los casos de prueba

Ahora está listo para escribir algunos casos de prueba. Primero, seleccione el navegador en el que se iniciará Cypress para ejecutar las pruebas entre las opciones disponibles en el cliente Cypress.

A continuación, haga clic en Crear nueva especificación para crear su archivo de prueba y proporcionar un nombre. Luego haga clic Crear especificación.

Ahora, abre el ciprés/accesorios/ejemplo.json archivo y actualice su contenido con las siguientes credenciales de usuario. Los accesorios son archivos que contienen datos de prueba estáticos que puede utilizar en los casos de prueba.

{
"username": "testuser",
"password": "password123"
}

El ciprés proporciona una cy.request Método para realizar solicitudes HTTP a un servidor web. Puede usarlo para probar diferentes tipos de puntos finales HTTP que administran diferentes operaciones, incluidas GET, POST, PUT y DELETE.

Para probar las tres rutas API que definió anteriormente, comience describiendo el caso de prueba para el punto final de registro. Este caso de prueba debe verificar que el punto final esté funcionando correctamente registrando exitosamente a un nuevo usuario y validando las afirmaciones.

Abre el ciprés/e2e/user.routes.spec.cy.js archivo y actualice su contenido con el siguiente código.

describe('User Routes', () => {
 it('registers a new user', () => { 
 cy.fixture('example').then((testUser) => { 
 cy.request({
 method: 'POST',
 url: `${baseUrl}/v1/api/register`, 
 body: testUser, 
 }).then((response) => { 
 expect(response.status).to.eq(201); 
 expect(response.body.message).to.eq('User registered successfully');
 });
 });
 });

En esta prueba, Cypress cargará los datos de la prueba en el archivo del dispositivo y realizará solicitudes POST al punto final especificado con los datos en el cuerpo de la solicitud. Si todas las afirmaciones pasan, el caso de prueba pasará. De lo contrario, fracasará.

Vale la pena señalar que la sintaxis de las pruebas de Cypress se parece mucho a la sintaxis utilizada en las pruebas de Mocha, que Cypress ha adoptado.

Ahora, describe la prueba para el usuarios ruta. La prueba debe verificar que la respuesta contenga datos del usuario cuando se realizan solicitudes a este punto final. Para lograr esto, agregue el siguiente código dentro del describir bloque de prueba.

 it('gets users data and the username matches test data', () => {
 cy.fixture('example').then((expectedUserData) => {
 cy.request({
 method: 'GET',
 url: `${baseUrl}/v1/api/users`,
 }).then((response) => {
 expect(response.status).to.eq(200);
const username = response.body[0].username;
 expect(username).to.eq(expectedUserData.username);
 });
 });
 });

Finalmente, incluya un caso de prueba que probará el punto final de inicio de sesión y afirmará que el estado de la respuesta es 200, lo que indica un intento de inicio de sesión exitoso.

 it('logs in a user', () => { 
 cy.fixture('example').then((loginData) => {
 cy.request({
 method: 'POST',
 url: `${baseUrl}/v1/api/login`, 
 body: loginData, 
 }).then((response) => {
 expect(response.status).to.eq(200);
 });
 });
 });
});

Para ejecutar las pruebas, regrese a la versión del navegador administrada por Cypress y seleccione el archivo de prueba específico que desea ejecutar.

El ejecutor de pruebas de Cypress ejecutará las pruebas y registrará sus resultados, mostrando el estado de aprobación o falla de cada caso de prueba.

Los ejemplos anteriores ilustran cómo se pueden probar varias rutas y sus correspondientes funciones de controlador para garantizar su funcionalidad y comportamiento esperado. Si bien es esencial probar la funcionalidad de las API, no debe limitar el alcance de las pruebas únicamente a este aspecto.

Una estrategia integral de prueba de API también debe incluir pruebas de rendimiento, carga e integración con otros servicios. Incluyendo diferentes tipos de métodos de prueba En su estrategia, puede lograr una cobertura de prueba exhaustiva y asegurarse de que sus API sean funcionales y confiables antes de implementar su código en producción.

Probando toda su experiencia web usando Cypress

Cypress es una herramienta fantástica para probar aplicaciones web, que cubre perfectamente las pruebas tanto para el front-end como para el back-end.

Con sus funciones de prueba fáciles de usar, puede configurar fácil y rápidamente un entorno de prueba, todo en una sola plataforma. Luego puede usarlo para probar exhaustivamente diferentes aspectos de su aplicación y garantizar un rendimiento de primer nivel.