Cypress je odličen za front-end testiranje, vendar lahko učinkovito testira tudi vaše API-je.

Cypress je priljubljeno ogrodje za testiranje, prilagojeno aplikacijam JavaScript. Čeprav je primarno zasnovan za testiranje komponent uporabniškega vmesnika in interakcij z elementi uporabniškega vmesnika v brskalniku, je tudi zelo primeren za testiranje API-jev. Ogrodje lahko uporabite za testiranje API-jev RESTful prek zahtev HTTP in preverjanje veljavnosti odzivi.

Cypress vam omogoča pisanje obsežnih testov, ki zajemajo celoten spekter poteka dela vaše spletne aplikacije.

Začetek testiranja API-jev z uporabo Cypressa

Cypress vam pomaga preveriti, ali vaši API-ji delujejo tako, kot pričakujete. Ta postopek običajno vključuje testiranje končnih točk API-ja, vhodnih podatkov in odzivov HTTP. Preverite lahko integracijo s katero koli zunanjo storitvijo in potrdite, da mehanizmi za obravnavanje napak delujejo pravilno.

Preskušanje vaših API-jev zagotavlja, da so funkcionalni, zanesljivi in ​​ustrezajo potrebam aplikacij, ki so od njih odvisne. Pomaga pri zgodnjem odkrivanju in odpravljanju napak, kar preprečuje nastanek težav v proizvodnji.

instagram viewer

Cipresa je odlično orodje za testiranje uporabniškega vmesnika, ki ga uporabljajo nekateri priljubljena ogrodja JavaScript. Zaradi njegove zmožnosti izdelave in testiranja zahtev HTTP je enako učinkovit pri testiranju API-jev.

To počne z uporabo Node.js kot svojega mehanizma za izdelavo zahtev HTTP in obdelavo njihovih odgovorov.

Kodo tega projekta najdete v GitHub repozitorij.

Ustvarite API REST Express.js

Za začetek, ustvarite spletni strežnik Expressin namestite ta paket v svoj projekt:

npm install cors

Nato svojemu projektu dodajte paket Cypress:

npm install cypress --save-dev

Končno posodobite svoje package.json datoteka za vključitev tega preskusnega skripta:

"test": "npx cypress open"

Definirajte krmilnike API

V resničnem primeru bi klicali API za branje in pisanje podatkov iz baze podatkov ali zunanjega API-ja. Vendar pa boste v tem primeru simulirali in preizkusili takšne klice API-ja z dodajanjem in pridobivanjem uporabniških podatkov iz polja.

V korenskem imeniku mape projekta ustvarite a krmilniki/userControllers.js datoteko in dodajte naslednjo kodo.

Najprej opredelite a registerUser krmilnik, ki bo upravljal pot registracije uporabnika. Izvlekel bo uporabniške podatke iz telesa zahteve, ustvaril nov uporabniški objekt in ga dodal v uporabniki niz. Če je postopek uspešen, se mora odzvati s statusno kodo 201 in sporočilom, ki nakazuje, da je uporabnika registriral.

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

Dodajte drugo funkcijo –getUsers— za pridobitev uporabniških podatkov iz matrike in vrnitev kot odziv JSON.

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

Nazadnje lahko tudi simulirate poskuse prijave. V isto datoteko dodajte to kodo, da preverite, ali se podano uporabniško ime in geslo ujemata s katerim koli uporabniškim podatkom v uporabniki niz:

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

Določite poti API-ja

Če želite definirati poti za API Express REST, ustvarite nov routes/userRoutes.js datoteko v korenskem imeniku in ji dodajte to kodo:

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;

Posodobite datoteko Server.js

Posodobite server.js datoteko za konfiguracijo API-ja na naslednji način:

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;

Nastavite testno okolje

Z vzpostavljenim demo API-jem ste pripravljeni na nastavitev preskusnega okolja. Zaženite razvojni strežnik s tem terminalskim ukazom:

node server.js

Nato zaženite ukaz testnega skripta v ločenem terminalu:

npm run test

Ta ukaz bo zagnal namiznega odjemalca Cypress, ki nudi testno okolje. Ko je odprt, kliknite E2E testiranje gumb. Testi od konca do konca zagotavljajo, da testirate Express API kot celoto, kar pomeni, da bo imel Cypress dostop do spletnega strežnika, poti in povezanih funkcij krmilnika.

Nato kliknite Nadaljuj da dodate konfiguracijske datoteke Cypress.

Ko je postopek namestitve končan, bi morali v svojem projektu videti novo mapo Cypress. Cypress bo dodal tudi a cypress.config.js datoteko, ki vsebuje konfiguracijske nastavitve za vaše teste.

Nadaljujte in posodobite to datoteko, da bo vključevala osnovni URL vašega strežnika, kot sledi:

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

Napišite testne primere

Zdaj ste pripravljeni napisati nekaj testnih primerov. Najprej med možnostmi, ki so na voljo v odjemalcu Cypress, izberite brskalnik, v katerem se bo zagnal Cypress, da izvedete teste.

Nato kliknite Ustvari novo spec gumb za ustvarjanje testne datoteke in vnesite ime. Nato kliknite Ustvari spec.

Zdaj odprite cypress/fixtures/example.json datoteko in posodobite njeno vsebino z naslednjimi uporabniškimi poverilnicami. Fiksture so datoteke, ki vsebujejo statične testne podatke, ki jih lahko uporabite v testnih primerih.

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

Cypress zagotavlja a cy.request način za pošiljanje zahtev HTTP spletnemu strežniku. Uporabite ga lahko za testiranje različnih vrst končnih točk HTTP, ki upravljajo različne operacije, vključno z GET, POST, PUT in DELETE.

Če želite preizkusiti tri poti API-ja, ki ste jih definirali prej, začnite z opisom testnega primera za končno točko registra. Ta testni primer bi moral preveriti, ali končna točka deluje pravilno z uspešno registracijo novega uporabnika in potrditvijo trditev.

Odprite cypress/e2e/user.routes.spec.cy.js datoteko in posodobite njeno vsebino z naslednjo kodo.

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

V tem preizkusu bo Cypress naložil testne podatke v datoteko vpeljanke in izvedel zahteve POST do navedene končne točke s podatki v telesu zahteve. Če so vse trditve uspešne, bo testni primer uspel. V nasprotnem primeru ne bo uspelo.

Treba je omeniti, da je sintaksa za teste Cypress zelo podobna sintaksi, uporabljeni v testih Mocha, ki jo je sprejel Cypress.

Zdaj pa opišite test za uporabniki pot. Preizkus mora preveriti, ali odgovor vsebuje uporabniške podatke, ko so zahteve poslane tej končni točki. Če želite to doseči, dodajte naslednjo kodo znotraj opisati testni blok.

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

Na koncu vključite testni primer, ki bo preizkusil prijavno končno točko in potrdil, da je status odgovora 200, kar kaže na uspešen poskus prijave.

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

Če želite zagnati teste, se vrnite v različico brskalnika, ki jo upravlja Cypress, in izberite določeno preskusno datoteko, ki jo želite zagnati.

Testni izvajalec Cypress bo izvedel teste in zabeležil njihove rezultate ter prikazal status uspešnosti ali neuspešnosti vsakega testnega primera.

Zgornji primeri prikazujejo, kako lahko preizkusite različne poti in njihove ustrezne funkcije krmilnika, da zagotovite njihovo funkcionalnost in pričakovano vedenje. Čeprav je bistveno preizkusiti funkcionalnost API-jev, obsega testiranja ne smete omejiti samo na ta vidik.

Celovita strategija testiranja API-ja mora vključevati tudi teste zmogljivosti, obremenitve in integracije z drugimi storitvami. Z vključitvijo različne vrste testnih metod v svoji strategiji lahko dosežete temeljito testno pokritost in zagotovite, da so vaši API-ji funkcionalni in zanesljivi, preden svojo kodo uvedete v proizvodnjo.

Preizkušanje vaše celotne spletne izkušnje s Cypressom

Cypress je fantastično orodje za testiranje spletnih aplikacij, ki brezhibno pokriva teste za sprednji in zadnji del.

Z uporabniku prijaznimi funkcijami testiranja lahko preprosto in hitro nastavite testno okolje na eni platformi. Nato ga lahko uporabite za temeljito testiranje različnih vidikov vaše aplikacije in zagotovite vrhunsko delovanje.