Express.js REST API's testen met Cypress

Cypress is een populair testraamwerk op maat voor JavaScript-toepassingen. Hoewel het voornamelijk is ontworpen om UI-componenten en interacties met UI-elementen in een browser te testen, is het ook zeer geschikt voor het testen van API’s. Je kunt het framework gebruiken om RESTful API’s te testen via HTTP-verzoeken en de antwoorden te valideren.

Met Cypress kun je uitgebreide testsuites maken die het hele operationele bereik van een webapplicatie omvatten, van begin tot eind.

Aan de slag met API-tests met Cypress

Met Cypress kan de programmeerinterface (API) van een applicatie worden gevalideerd om ervoor te zorgen dat deze werkt volgens het bedoelde ontwerp. Als onderdeel van dit proces worden de API’s endpoints, invoerparameters en HTTP-reacties (Hypertext Transfer Protocol) getest. Daarnaast wordt de compatibiliteit met eventuele externe systemen gecontroleerd en wordt de functionaliteit van de foutafhandelingsmechanismen bevestigd.

Het is van het grootste belang dat de functionaliteit, betrouwbaarheid en geschiktheid voor applicatie-integratie van uw API’s wordt getest. Vroegtijdige identificatie en correctie van eventuele problemen voorkomt potentiële problemen in een live-omgeving.

Cypress is een geweldig hulpmiddel voor het testen van UI, dat door een aantal populaire JavaScript-frameworks wordt gebruikt. De mogelijkheid om HTTP-verzoeken te maken en te testen maakt het net zo effectief bij het testen van API’s.

De applicatie maakt gebruik van Node.js als onderliggende technologie voor het effectief uitvoeren van HTTP-verzoeken en het beheren van bijbehorende reacties.

De broncode voor dit project is toegankelijk via de speciale GitHub repository.

Een Express.js REST API maken

Om het proces te starten, stel je een Express webserver in als basis en neem je dit pakket op in het framework van je project.

 npm install cors 

Om de functionaliteit van Cypress in je huidige project op te nemen, moet je een aantal stappen volgen waarbij je de benodigde afhankelijkheden installeert en configureert. Dit proces omvat het toevoegen van het Cypress pakket als een asset in het configuratiebestand of de repository van je project, het specificeren van de versie en de locatie op je systeem, en ervoor zorgen dat het goed geïntegreerd is met andere componenten en modules binnen je applicatie. Als je dit eenmaal hebt gedaan, kun je Cypress gaan gebruiken om verschillende aspecten van je softwareontwikkeling te automatiseren en te testen, waaronder gebruikersinteracties, API-aanroepen en netwerkverzoeken.

 npm install cypress --save-dev 

Wijzig tot slot uw bestand package.json om het bovengenoemde testscript erin op te nemen.

 "test": "npx cypress open" 

De API Controllers definiëren

Om de functionaliteit van onze applicatie in een praktisch scenario te demonstreren, simuleren we het proces van API-aanroepen voor interactie met een database of externe API. Hoewel de werkelijke implementatie dergelijke interacties met zich meebrengt, zullen we voor de duidelijkheid een array gebruiken om gebruikersgegevens op te slaan en op te halen binnen het bereik van dit voorbeeld.

Maak in de hoofdmap van de mappenstructuur van je project een submap “controllers” en genereer daarin een bestand “userControllers.js”. Neem in dit bestand de volgende inhoud op.

Laten we beginnen met het maken van een

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

Wijzig de bestaande getAllUsers functie om een extra functie toe te voegen die gebruikersgegevens ophaalt uit de array en deze retourneert in de vorm van een JSON-respons. Deze nieuwe functie wordt getUsers genoemd.

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

Concluderend kan men gesimuleerde aanmeldingspogingen uitvoeren door een specifiek stuk code op te nemen in het geleverde script. Deze toegevoegde functionaliteit maakt het mogelijk om te valideren of een gegeven set referenties correct overeenkomt met de informatie die is opgeslagen in een “gebruikers” matrix.

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

De API-routes definiëren

Om de routeringsconfiguratie voor je Express-gebaseerde REST-applicatie op te zetten, moet je een nieuw bestand genereren met de naam “routes/userRoutes.js” in de hoofdmap van je project. Dit bestand bevat de volgende inhoud:

 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; 

Werk het bestand Server.js bij

Wijzig de inhoud van het bestand server.js door de configuratie ervan aan te passen in overeenstemming met de volgende specificaties:

 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;

De testomgeving opzetten

Om de testomgeving voor de demonstratieapplicatie programmeerinterface (API) op te zetten, begint u met de initialisatie van de ontwikkelingsserver door de bovengenoemde terminalinstructie uit te voeren.

 node server.js 

Voer vervolgens het testscript uit met de executable “test” vanuit een ander terminalvenster of een console:

 npm run test 

Het uitvoeren van deze instructie start de implementatie van de Cypress desktop applicatie, die dient als evaluatieplatform. Na een succesvolle installatie navigeer je naar het tabblad “E2E Testing” en activeer je het door op de daarvoor bestemde knop te klikken. De end-to-end beoordelingen omvatten een uitgebreide evaluatie van de volledige Express API, inclusief de webserver, routeconfiguraties en bijbehorende controllerfunctiemodules.

Klik op “Doorgaan” om de configuratiebestanden van Cypress op te nemen.

Na succesvolle voltooiing van de initiële instellingsprocedure, zouden gebruikers de aanwezigheid van een nieuw aangemaakte Cypress-directory in hun project moeten zien. Daarnaast genereert Cypress automatisch een bestand cypress.config.js dat de configuratieparameters van de testsuite bevat.

Voel je vrij om dit document aan te passen door het basisadres van je server op de volgende manier op te nemen:

 const { defineConfig } = require("cypress");

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

Schrijf de testgevallen

Om te beginnen met het schrijven van testgevallen met behulp van Cypress, begin je met het kiezen van de gewenste webbrowser voor het testen uit de beschikbare opties binnen de Cypress interface.

Nadat u op de knop “Create new spec” (Nieuwe specificatie maken) hebt geklikt, dient u een titel voor uw testcase op te geven, gevolgd door een klik op de optie “Create spec” (Spec aanmaken).

Bewerk de inhoud van het bestand “cypress/fixtures/example.json” met de opgegeven gebruikersgegevens. Fixture-bestanden dienen als opslagplaats voor vaste testgegevens die gebruikt kunnen worden binnen testsuites.

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

Cypress biedt een veelzijdige aanpak voor het uitvoeren van HTTP-verzoeken via het ingebouwde cy.request commando. Deze functie stelt ontwikkelaars in staat om te communiceren met verschillende typen HTTP endpoints die verschillende functionaliteiten afhandelen, zoals GET, POST, PUT en DELETE.

Om de functionaliteit van de drie eerder geïmplementeerde API endpoints te valideren, moeten we beginnen met het formuleren van een testscenario voor het registratieproces. Het primaire doel van dit testscenario is om te bevestigen dat het eindpunt werkt zoals bedoeld door effectief een nieuw gebruikersaccount aan te maken en de bijbehorende beweringen te verifiëren.

Open het bestand “cypress/e2e/user.routes.spec.cy.js” en vervang de bestaande inhoud door het onderstaande codefragment:javascriptdescribe(‘User Routes’, () => {it(‘moet een goede navigatiebalk hebben op mobiele apparaten’, (done) => {cy.visit(’/’)cy. get(’#app-titel’).should(‘have.text’, ‘Mijn website’);cy.get(’.burger’).click();cy.get(’#menu-toggle’).should(‘be.visible’);cy.get(’#profile-btn’).click({forceren: true });cy.url().should(‘include’, ‘/dashboard’);cy.get(’#nav-links li:nth-child(1) a’).

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

Tijdens de uitvoering van deze evaluatie zal Cypress de informatie in het profielbestand gebruiken om een reeks POST-verzoeken te genereren die gericht zijn aan het aangewezen eindpunt, vergezeld van de details in de verzoektekst. Als elk van de beweringen als accuraat wordt gevalideerd, zal de testinstantie als succesvol worden beschouwd en als geslaagd worden beschouwd. Omgekeerd, als een bewering niet voldoet aan de vastgestelde criteria, wordt het gehele testgeval als niet geslaagd beschouwd en gemarkeerd als mislukt.

Cypress tests zijn gestructureerd met een syntax die lijkt op die van Mocha tests, omdat Cypress dit testraamwerk heeft geïntegreerd.

Om te valideren dat het antwoord dat door het gebruikers eindpunt wordt gegenereerd relevante gebruikersinformatie oplevert na ontvangst van een verzoek op de genoemde locatie, is het noodzakelijk om de volgende maatregelen op te nemen in de omvattende beschrijven testsuite.

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

Neem ten slotte een testscenario op om het aanmeldingseindpunt te evalueren en bevestig dat de HTTP-responsstatus 200 is, wat een succesvolle aanmeldingspoging betekent.

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

Om de tests uit te voeren, navigeert u terug naar de webapplicatie die door Cypress wordt gemonitord en kiest u het specifieke testscript dat u wilt uitvoeren uit de beschikbare scripts.

De uitvoering van de Cypress testrunner resulteert in het testen en documenteren van de resultaten voor elk individueel testgeval, waarbij wordt weergegeven of ze geslaagd of mislukt zijn.

Om de prestaties en betrouwbaarheid van een API uitgebreid te evalueren, is het cruciaal om het testgebied uit te breiden tot meer dan alleen de functionele aspecten. Door extra interactielagen te onderzoeken tussen de application programming interface en andere componenten die betrokken zijn bij het verwerken van verzoeken of reacties, kan een uitgebreidere beoordeling van de algehele efficiëntie en effectiviteit van het systeem worden bereikt.

Een goed afgeronde benadering van het testen van API’s omvat niet alleen de functionaliteit, maar ook aspecten als prestaties, schaalbaarheid en integratie met externe systemen. Daarom is het essentieel om een verscheidenheid aan testmethodologieën in uw teststrategie op te nemen om een uitgebreide testdekking te bereiken en de betrouwbaarheid en stabiliteit van de API’s van uw applicatie te garanderen voordat ze in een live omgeving worden ingezet.

Uw volledige webervaring testen met behulp van Cypress

Cypress is een uitzonderlijke bron voor het eenvoudig evalueren van webgebaseerde applicaties en omvat uitgebreide beoordelingen van zowel de gebruikersinterface als de server-side componenten.

Door gebruik te maken van onze intuïtieve testtools kan moeiteloos een uitgebreide testomgeving worden gecreëerd binnen één enkel platform. Dit maakt uitgebreide evaluatie van verschillende facetten van je software mogelijk, zodat je verzekerd bent van optimale functionaliteit en uitzonderlijke prestaties.