Cypress е страхотен за тестване отпред, но може да тества ефективно и вашите API.

Cypress е популярна рамка за тестване, пригодена за приложения на JavaScript. Въпреки че е предназначен основно за тестване на UI компоненти и взаимодействия с UI елементи в браузър, той също е такъв много подходящ за тестване на API. Можете да използвате рамката, за да тествате RESTful API чрез HTTP заявки и да валидирате отговори.

Cypress ви позволява да пишете изчерпателни тестове, които обхващат пълния спектър от работния процес на вашето уеб приложение.

Първи стъпки с API тестване с помощта на Cypress

Cypress ви помага да проверите дали вашите API работят както очаквате. Този процес обикновено включва тестване на крайните точки на API, входните данни и HTTP отговорите. Можете да проверите интеграцията с всякакви външни услуги и да потвърдите, че механизмите за обработка на грешки работят правилно.

Тестването на вашите API гарантира, че те са функционални, надеждни и отговарят на нуждите на приложенията, които зависят от тях. Помага за идентифициране и коригиране на грешки на ранен етап, предотвратявайки възникването на проблеми в производството.

instagram viewer

Кипарис е страхотен инструмент за тестване на UI, използван от някои от популярни рамки на JavaScript. Способността му да прави и тества HTTP заявки го прави еднакво ефективен при тестване на API.

Той прави това, като използва Node.js като своя машина, за да прави HTTP заявки и да обработва техните отговори.

Можете да намерите кода на този проект в него GitHub хранилище.

Създайте Express.js REST API

За да започнете, създайте експресен уеб сървъри инсталирайте този пакет във вашия проект:

npm install cors

След това добавете пакета Cypress към вашия проект:

npm install cypress --save-dev

И накрая, актуализирайте своя package.json файл за включване на този тестов скрипт:

"test": "npx cypress open"

Дефинирайте API контролерите

В случай от реалния свят бихте направили извиквания на API, за да четете и записвате данни от база данни или външен API. За този пример обаче ще симулирате и тествате такива извиквания на API чрез добавяне и извличане на потребителски данни от масив.

В главната директория на папката на вашия проект създайте a контролери/userControllers.js файл и добавете следния код.

Първо, дефинирайте a registerUser функция на контролера, която ще управлява маршрута за регистрация на потребителя. Той ще извлече данните на потребителя от тялото на заявката, ще създаде нов потребителски обект и ще го добави към потребители масив. Ако процесът е успешен, той трябва да отговори с код на състоянието 201 и съобщение, което показва, че е регистрирал потребителя.

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!!' });
 }
};

Добавяне на втора функция—getUsers— за извличане на потребителски данни от масива и връщането им като JSON отговор.

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

И накрая, можете също да симулирате опити за влизане. В същия файл добавете този код, за да проверите дали даденото потребителско име и парола съвпадат с потребителски данни в потребители масив:

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!!' });
 }
};

Дефинирайте API маршрутите

За да дефинирате маршрутите за вашия Express REST API, създайте нов маршрути/userRoutes.js файл в основната директория и добавете този код към него:

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;

Актуализирайте файла Server.js

Актуализирайте server.js файл за конфигуриране на API, както следва:

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;

Настройте тестовата среда

С инсталиран демо API вие сте готови да настроите средата за тестване. Стартирайте сървъра за разработка с тази терминална команда:

node server.js

След това изпълнете командата за тестов скрипт в отделен терминал:

npm run test

Тази команда ще стартира десктоп клиента Cypress, който предоставя тестовата среда. След като се отвори, щракнете върху E2E тестване бутон. Тестовете от край до край гарантират, че тествате Express API като цяло, което означава, че Cypress ще има достъп до уеб сървъра, маршрутите и свързаните функции на контролера.

След това щракнете продължи за добавяне на конфигурационни файлове на Cypress.

След като процесът на настройка приключи, трябва да видите нова папка Cypress във вашия проект. Cypress също ще добави a cypress.config.js файл, който съдържа конфигурационните настройки за вашите тестове.

Продължете и актуализирайте този файл, за да включите основния URL адрес на вашия сървър, както следва:

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

Напишете тестовите случаи

Сега сте готови да напишете някои тестови случаи. Първо изберете браузъра, в който Cypress ще се стартира, за да изпълните тестовете от наличните опции на Cypress клиента.

След това щракнете върху Създайте нова спец бутон, за да създадете вашия тестов файл, и въведете име. След това щракнете Създайте спец.

Сега отворете cypress/fixtures/example.json файл и актуализирайте съдържанието му със следните потребителски идентификационни данни. Фикстурите са файлове, които съдържат статични тестови данни, които можете да използвате в тестовите случаи.

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

Cypress предоставя a cy.request метод за отправяне на HTTP заявки към уеб сървър. Можете да го използвате, за да тествате различни видове HTTP крайни точки, които управляват различни операции, включително GET, POST, PUT и DELETE.

За да тествате трите API маршрута, които сте дефинирали по-рано, започнете с описание на тестовия случай за крайната точка на регистъра. Този тестов случай трябва да провери дали крайната точка работи правилно чрез успешно регистриране на нов потребител и валидиране на твърденията.

Отвори cypress/e2e/user.routes.spec.cy.js файл и актуализирайте съдържанието му със следния код.

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');
 });
 });
 });

В този тест Cypress ще зареди тестовите данни във файла с фиксиране и ще направи POST заявки до посочената крайна точка с данните в тялото на заявката. Ако всички твърдения са успешни, тестът ще успее. В противен случай ще се провали.

Струва си да се отбележи, че синтаксисът за тестовете Cypress много наподобява синтаксиса, използван в тестовете Mocha, който Cypress е приел.

Сега опишете теста за потребители маршрут. Тестът трябва да провери дали отговорът съдържа потребителски данни, когато се правят заявки към тази крайна точка. За да постигнете това, добавете следния код в рамките на описвам тестов блок.

 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);
 });
 });
 });

И накрая, включете тестов случай, който ще тества крайната точка за влизане и ще потвърди, че състоянието на отговора е 200, което показва успешен опит за влизане.

 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);
 });
 });
 });
});

За да изпълните тестовете, върнете се към версията на браузъра, управлявана от Cypress, и изберете конкретния тестов файл, който искате да изпълните.

Програмата за тестване на Cypress ще стартира тестовете и ще запише резултатите от тях, показвайки състоянието на преминаване или неуспех на всеки тестов случай.

Примерите по-горе илюстрират как можете да тествате различни маршрути и съответните им функции на контролера, за да гарантирате тяхната функционалност и очаквано поведение. Въпреки че е от съществено значение да тествате функционалността на API, не трябва да ограничавате обхвата на тестване само до този аспект.

Цялостната стратегия за тестване на API трябва също да включва тестове за производителност, натоварване и интеграция с други услуги. Чрез включване различни видове методи за изпитване във вашата стратегия можете да постигнете цялостно тестово покритие и да се уверите, че вашите API са едновременно функционални и надеждни, преди да внедрите кода си в производство.

Тестване на цялото ви уеб изживяване с Cypress

Cypress е фантастичен инструмент за тестване на уеб приложения, безпроблемно покриващ тестове както за предния, така и за задния край.

С удобните за потребителя функции за тестване можете лесно и бързо да настроите среда за тестване в една платформа. След това можете да го използвате, за да тествате щателно различни аспекти на вашето приложение и да гарантирате първокласна производителност.