Cypress je skvělý pro front-end testování, ale může také efektivně testovat vaše API.

Cypress je populární testovací rámec přizpůsobený pro aplikace JavaScript. I když je primárně určen k testování komponent uživatelského rozhraní a interakcí s prvky uživatelského rozhraní v prohlížeči, také je dobře se hodí pro testování API. Rámec můžete použít k testování rozhraní RESTful API prostřednictvím požadavků HTTP a ověření odpovědi.

Cypress vám umožňuje psát komplexní testy, které pokrývají celé spektrum pracovních postupů vaší webové aplikace.

Začínáme s testováním API pomocí Cypress

Cypress vám pomůže ověřit, že vaše API fungují tak, jak očekáváte. Tento proces obvykle zahrnuje testování koncových bodů API, vstupních dat a HTTP odpovědí. Můžete ověřit integraci s jakýmikoli externími službami a potvrdit, že mechanismy pro zpracování chyb fungují správně.

Testování vašich rozhraní API zajišťuje, že jsou funkční, spolehlivé a splňují potřeby aplikací, které na nich závisí. Pomáhá včas identifikovat a opravit chyby a předcházet problémům ve výrobě.

instagram viewer

Cypřiš je skvělý nástroj pro testování uživatelského rozhraní, který používají někteří z populární frameworky JavaScript. Díky své schopnosti vytvářet a testovat požadavky HTTP je stejně efektivní při testování API.

Dělá to tak, že používá Node.js jako svůj modul k vytváření požadavků HTTP a zpracovávání jejich odpovědí.

Kód tohoto projektu najdete v něm GitHub úložiště.

Vytvořte rozhraní REST API Express.js

Začít, vytvořit expresní webový servera nainstalujte tento balíček do svého projektu:

npm install cors

Dále do svého projektu přidejte balíček Cypress:

npm install cypress --save-dev

Nakonec aktualizujte svůj package.json soubor, který bude obsahovat tento testovací skript:

"test": "npx cypress open"

Definujte API Controllers

V reálném světě byste volali API pro čtení a zápis dat z databáze nebo externího API. V tomto příkladu však budete simulovat a testovat taková volání API přidáním a načtením uživatelských dat z pole.

V kořenovém adresáři složky projektu vytvořte a controllers/userControllers.js soubor a přidejte následující kód.

Nejprve definujte a zaregistrovat uživatele funkce ovladače, která bude spravovat trasu registrace uživatele. Extrahuje data uživatele z těla požadavku, vytvoří nový objekt uživatele a přidá jej do uživatelů pole. Pokud je proces úspěšný, měl by odpovědět stavovým kódem 201 a zprávou, že zaregistroval uživatele.

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

Přidejte druhou funkci –getUsers—načíst uživatelská data z pole a vrátit je jako odpověď JSON.

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

Nakonec můžete také simulovat pokusy o přihlášení. Do stejného souboru přidejte tento kód, abyste zkontrolovali, zda se dané uživatelské jméno a heslo shodují s některými uživatelskými údaji v souboru uživatelů pole:

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

Definujte trasy API

Chcete-li definovat trasy pro vaše Express REST API, vytvořte nové routes/userRoutes.js soubor v kořenovém adresáři a přidejte do něj tento kód:

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;

Aktualizujte soubor Server.js

Aktualizujte server.js soubor pro konfiguraci API následovně:

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;

Nastavte testovací prostředí

Se zavedeným demo API jste připraveni nastavit testovací prostředí. Spusťte vývojový server pomocí tohoto příkazu terminálu:

node server.js

Dále spusťte příkaz testovacího skriptu v samostatném terminálu:

npm run test

Tento příkaz spustí desktopového klienta Cypress, který poskytuje testovací prostředí. Jakmile se otevře, klikněte na Testování E2E knoflík. End-to-end testy zajišťují, že otestujete Express API jako celek, což znamená, že Cypress bude mít přístup k webovému serveru, trasám a souvisejícím funkcím řadiče.

Dále klikněte Pokračovat přidat konfigurační soubory Cypress.

Po dokončení procesu nastavení byste měli ve svém projektu vidět novou složku Cypress. Cypřiš také přidá a cypress.config.js soubor, který obsahuje konfigurační nastavení pro vaše testy.

Pokračujte a aktualizujte tento soubor tak, aby obsahoval základní adresu URL vašeho serveru:

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

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

Napište testovací případy

Nyní jste připraveni napsat několik testovacích případů. Nejprve vyberte prohlížeč, ve kterém se Cypress spustí, aby spustil testy z možností dostupných na klientovi Cypress.

Dále klikněte na Vytvořit novou specifikaci vytvořte testovací soubor a zadejte název. Pak klikněte Vytvořte spec.

Nyní otevřete cypress/fixtures/example.json soubor a aktualizujte jeho obsah pomocí následujících uživatelských pověření. Svítidla jsou soubory, které obsahují statická testovací data, která můžete použít v testovacích případech.

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

Cypřiš poskytuje a cy.žádost způsob odesílání požadavků HTTP na webový server. Můžete jej použít k testování různých typů koncových bodů HTTP, které spravují různé operace včetně GET, POST, PUT a DELETE.

Chcete-li otestovat tři trasy API, které jste definovali dříve, začněte popisem testovacího případu pro koncový bod registru. Tento testovací případ by měl ověřit, že koncový bod funguje správně, úspěšnou registrací nového uživatele a ověřením tvrzení.

Otevři cypress/e2e/user.routes.spec.cy.js soubor a aktualizujte jeho obsah následujícím kódem.

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 tomto testu Cypress načte testovací data do souboru přípravku a provede POST požadavky na zadaný koncový bod s daty v těle požadavku. Pokud projdou všechna tvrzení, projde testovací případ. Jinak to selže.

Stojí za zmínku, že syntaxe testů Cypress se velmi podobá syntaxi používané v testech Mocha, kterou Cypress přijal.

Nyní popište test pro uživatelů trasa. Test by měl ověřit, že odpověď obsahuje uživatelská data, když jsou na tento koncový bod vzneseny požadavky. Chcete-li toho dosáhnout, přidejte následující kód do popsat testovací 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);
});
});
});

Nakonec zahrňte testovací případ, který otestuje koncový bod přihlášení a potvrdí, že stav odpovědi je 200, což znamená úspěšný pokus o přihlášení.

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

Chcete-li spustit testy, vraťte se do verze prohlížeče spravované Cypressem a vyberte konkrétní testovací soubor, který chcete spustit.

Cypress testovací běžec provede testy a zaznamená jejich výsledky, přičemž ukáže stav úspěšného nebo neúspěšného testu každého testovacího případu.

Výše uvedené příklady ilustrují, jak můžete testovat různé trasy a jejich odpovídající funkce ovladače, abyste zajistili jejich funkčnost a očekávané chování. I když je nezbytné otestovat funkčnost rozhraní API, neměli byste omezovat rozsah testování pouze na tento aspekt.

Komplexní strategie testování API by také měla zahrnovat testy výkonu, zatížení a integrace s dalšími službami. Zahrnutím různé typy testovacích metod ve své strategii můžete dosáhnout důkladného testovacího pokrytí a zajistit, aby vaše rozhraní API byla funkční a spolehlivá před nasazením kódu do produkce.

Testování celého webu pomocí Cypress

Cypress je fantastický nástroj pro testování webových aplikací, který hladce pokrývá testy pro front-end i back-end.

Díky uživatelsky přívětivým testovacím funkcím můžete snadno a rychle nastavit testovací prostředí na jedné platformě. Pomocí něj pak můžete důkladně otestovat různé aspekty vaší aplikace a zaručit špičkový výkon.