Cypress er flott for front-end-testing, men det kan også teste API-ene dine effektivt.

Cypress er et populært testrammeverk skreddersydd for JavaScript-applikasjoner. Selv om det først og fremst er designet for å teste brukergrensesnittkomponenter og interaksjoner med brukergrensesnittelementer i en nettleser, er det også godt egnet for testing av APIer. Du kan bruke rammeverket til å teste RESTful APIer via HTTP-forespørsler og validere svar.

Cypress lar deg skrive omfattende tester som spenner over hele spekteret av nettapplikasjonens arbeidsflyt.

Komme i gang med API-testing med Cypress

Cypress hjelper deg å bekrefte at API-ene dine fungerer slik du forventer at de skal. Denne prosessen inkluderer vanligvis testing av API-ens endepunkter, inndata og HTTP-svar. Du kan verifisere integrasjon med alle eksterne tjenester, og bekrefte at feilhåndteringsmekanismer fungerer som de skal.

Testing av API-ene dine sikrer at de er funksjonelle, pålitelige og oppfyller behovene til apper som er avhengige av dem. Det hjelper å identifisere og fikse feil tidlig, og forhindrer at problemer oppstår i produksjonen.

instagram viewer

Sypress er et flott UI-testverktøy, brukt av noen av de populære JavaScript-rammeverk. Dens evne til å lage og teste HTTP-forespørsler gjør den like effektiv til å teste APIer.

Den gjør dette ved å bruke Node.js som motor for å lage HTTP-forespørsler og håndtere svarene deres.

Du kan finne dette prosjektets kode i sin GitHub oppbevaringssted.

Opprett en Express.js REST API

For å komme i gang, opprette en Express-webserver, og installer denne pakken i prosjektet ditt:

npm install cors

Deretter legger du til Cypress-pakken til prosjektet ditt:

npm install cypress --save-dev

Til slutt, oppdater din package.json fil for å inkludere dette testskriptet:

"test": "npx cypress open"

Definer API-kontrollere

I et virkelig tilfelle vil du foreta API-anrop for å lese og skrive data fra en database eller en ekstern API. For dette eksempelet vil du imidlertid simulere og teste slike API-kall ved å legge til og hente brukerdata fra en matrise.

Opprett en i rotkatalogen til prosjektmappen din kontrollere/brukerkontrollere.js fil, og legg til følgende kode.

Først må du definere en registrer bruker kontrollerfunksjon som vil administrere brukerregistreringsruten. Det vil trekke ut brukerens data fra forespørselsteksten, opprette et nytt brukerobjekt og legge det til brukere array. Hvis prosessen er vellykket, skal den svare med en 201-statuskode og en melding som indikerer at den har registrert brukeren.

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

Legg til en ekstra funksjon—getUsers– for å hente brukerdata fra arrayet, og returnere det som JSON-svar.

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

Til slutt kan du også simulere påloggingsforsøk. I samme fil legger du til denne koden for å sjekke om det oppgitte brukernavnet og passordet samsvarer med noen brukerdata i brukere array:

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

Definer API-rutene

For å definere rutene for din Express REST API, opprett en ny routes/userRoutes.js fil i rotkatalogen, og legg til denne koden:

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;

Oppdater Server.js-filen

Oppdater server.js fil for å konfigurere API-en som følger:

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;

Sett opp testmiljøet

Med demo-APIet på plass, er du klar til å sette opp testmiljøet. Start utviklingsserveren med denne terminalkommandoen:

node server.js

Deretter kjører du testskriptkommandoen i en separat terminal:

npm run test

Denne kommandoen vil starte Cypress-skrivebordsklienten, som gir testmiljøet. Når den er åpen, klikker du på E2E-testing knapp. End-to-end-tester sikrer at du tester Express API som helhet, noe som betyr at Cypress vil ha tilgang til webserveren, rutene og de tilhørende kontrollerfunksjonene.

Klikk deretter Fortsette for å legge til Cypress-konfigurasjonsfiler.

Når installasjonsprosessen er fullført, bør du se en ny Cypress-mappe i prosjektet ditt. Cypress vil også legge til en cypress.config.js fil som inneholder konfigurasjonsinnstillingene for testene dine.

Fortsett og oppdater denne filen for å inkludere serverens basis-URL som følger:

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

Skriv testsakene

Nå er du klar til å skrive noen testsaker. Først velger du nettleseren som Cypress skal starte i for å kjøre testene fra alternativene som er tilgjengelige på Cypress-klienten.

Deretter klikker du på Opprett ny spesifikasjon for å opprette testfilen din, og angi et navn. Klikk deretter Lag spesifikasjoner.

Nå åpner du cypress/fixtures/example.json fil, og oppdater innholdet med følgende brukerlegitimasjon. Fixtures er filer som inneholder statiske testdata som du kan bruke i testsakene.

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

Cypress gir en cy.request metode for å sende HTTP-forespørsler til en webserver. Du kan bruke den til å teste forskjellige typer HTTP-endepunkter som administrerer forskjellige operasjoner, inkludert GET, POST, PUT og DELETE.

For å teste de tre API-rutene du definerte tidligere, start med å beskrive testtilfellet for registerendepunktet. Denne testsaken skal verifisere at endepunktet fungerer korrekt ved å registrere en ny bruker og validere påstandene.

Åpne cypress/e2e/user.routes.spec.cy.js fil og oppdater innholdet med følgende kode.

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

I denne testen vil Cypress laste testdataene i fixturfilen, og foreta POST-forespørsler til det angitte endepunktet med dataene i forespørselsteksten. Hvis alle påstandene består, vil testsaken bestå. Ellers vil det mislykkes.

Det er verdt å merke seg at syntaksen for Cypress-tester ligner veldig på syntaksen som brukes i Mokka-tester, som Cypress har tatt i bruk.

Beskriv nå testen for brukere rute. Testen skal verifisere at svaret inneholder brukerdata når det sendes forespørsler til dette endepunktet. For å oppnå dette, legg til følgende kode i beskrive testblokk.

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

Til slutt inkluderer en testsak som vil teste påloggingsendepunktet og hevde at svarstatusen er 200, noe som indikerer et vellykket påloggingsforsøk.

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

For å kjøre testene, gå tilbake til nettleserversjonen administrert av Cypress og velg den spesifikke testfilen du ønsker å kjøre.

Cypress-testløperen kjører testene og registrerer resultatene, og viser bestått eller ikke bestått status for hver testsak.

Eksemplene ovenfor illustrerer hvordan du kan teste ulike ruter og deres tilhørende kontrollerfunksjoner for å sikre funksjonalitet og forventet oppførsel. Selv om det er viktig å teste funksjonaliteten til APIer, bør du ikke begrense testomfanget kun til dette aspektet.

En omfattende API-teststrategi bør også inkludere tester på ytelse, belastning og integrasjon med andre tjenester. Ved å inkludere ulike typer testmetoder i strategien din kan du oppnå grundig testdekning og sikre at API-ene dine er både funksjonelle og pålitelige før du distribuerer koden din til produksjon.

Teste hele nettopplevelsen din med Cypress

Cypress er et fantastisk verktøy for å teste webapplikasjoner, som sømløst dekker tester for både front-end og back-end.

Med sine brukervennlige testfunksjoner kan du enkelt og raskt sette opp et testmiljø på én plattform. Du kan deretter bruke den til å teste ulike aspekter av applikasjonen din grundig og garantere førsteklasses ytelse.