Cypress Kullanarak Express.js REST API'lerini Test Etme

Cypress, JavaScript uygulamaları için özel olarak tasarlanmış popüler bir test çerçevesidir. Öncelikle bir tarayıcıdaki kullanıcı arayüzü bileşenlerini ve kullanıcı arayüzü öğeleriyle etkileşimleri test etmek için tasarlanmış olsa da, aynı zamanda API'leri test etmek için çok uygundur. RESTful API'lerini HTTP istekleri aracılığıyla test etmek ve doğrulamak için çerçeveyi kullanabilirsiniz. tepkiler.

Cypress, web uygulamanızın iş akışının tüm yelpazesini kapsayan kapsamlı testler yazmanıza olanak tanır.

Cypress Kullanarak API Testine Başlarken

Cypress, API'lerinizin beklediğiniz gibi çalıştığını doğrulamanıza yardımcı olur. Bu süreç genellikle API'nin uç noktalarının, giriş verilerinin ve HTTP yanıtlarının test edilmesini içerir. Herhangi bir harici hizmetle entegrasyonu doğrulayabilir ve hata işleme mekanizmalarının doğru şekilde çalıştığını doğrulayabilirsiniz.

API'lerinizi test etmek, bunların işlevsel, güvenilir olmasını ve bunlara bağlı uygulamaların ihtiyaçlarını karşılamasını sağlar. Hataların erkenden tespit edilip düzeltilmesine yardımcı olarak üretimde sorunların oluşmasını önler.

Selvi bazı kullanıcılar tarafından kullanılan harika bir kullanıcı arayüzü test aracıdır. popüler JavaScript çerçeveleri. HTTP isteklerini oluşturma ve test etme yeteneği, API'lerin test edilmesinde de aynı derecede etkili olmasını sağlar.

Bunu, HTTP istekleri yapmak ve yanıtlarını işlemek için Node.js'yi motor olarak kullanarak yapar.

Bu projenin kodunu kendi içinde bulabilirsiniz. GitHub depo.

Express.js REST API'si oluşturma

Başlamak, Express web sunucusu oluşturmave bu paketi projenize yükleyin:

npm install cors

Ardından Cypress paketini projenize ekleyin:

npm install cypress --save-dev

Son olarak, bilgilerinizi güncelleyin paket.json Bu test komut dosyasını içerecek dosya:

"test": "npx cypress open"

API Denetleyicilerini Tanımlayın

Gerçek dünyada bir veritabanından veya harici bir API'den veri okumak ve yazmak için API çağrıları yaparsınız. Ancak bu örnekte, bir diziye kullanıcı verileri ekleyip getirerek bu tür API çağrılarını simüle edecek ve test edeceksiniz.

Proje klasörünüzün kök dizininde bir denetleyiciler/userControllers.js Dosyayı açın ve aşağıdaki kodu ekleyin.

Öncelikle bir tanım yapın kayıtKullanıcı Kullanıcı kayıt yolunu yönetecek denetleyici işlevi. Kullanıcının verilerini istek gövdesinden çıkaracak, yeni bir kullanıcı nesnesi oluşturacak ve onu ekleyecektir. kullanıcılar sıralamak. İşlem başarılı olursa 201 durum kodu ve kullanıcıyı kaydettiğini belirten bir mesajla yanıt vermelidir.

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

İkinci bir işlev ekleyin—Kullanıcıları al—diziden kullanıcı verilerini almak ve bunu JSON yanıtı olarak döndürmek için.

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

Son olarak, oturum açma denemelerini de simüle edebilirsiniz. Verilen kullanıcı adı ve şifrenin dosyadaki herhangi bir kullanıcı verisiyle eşleşip eşleşmediğini kontrol etmek için aynı dosyaya bu kodu ekleyin. kullanıcılar sıralamak:

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 Rotalarını Tanımlayın

Express REST API'nizin rotalarını tanımlamak için yeni bir rotalar/userRoutes.js kök dizindeki dosyayı açın ve bu kodu ona ekleyin:

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 Dosyasını Güncelleyin

Güncelleme sunucu.js API'yi aşağıdaki gibi yapılandırmak için dosya:

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;

Test Ortamını Ayarlama

Demo API'si mevcut olduğunda test ortamını kurmaya hazırsınız. Geliştirme sunucusunu şu terminal komutuyla başlatın:

node server.js

Daha sonra test betiği komutunu ayrı bir terminalde çalıştırın:

npm run test

Bu komut, test ortamını sağlayan Cypress masaüstü istemcisini başlatacaktır. Açıldıktan sonra, E2E Testi düğme. Uçtan uca testler, Express API'yi bir bütün olarak test etmenizi sağlar; bu, Cypress'in web sunucusuna, rotalara ve ilgili denetleyici işlevlerine erişebileceği anlamına gelir.

Sonra tıklayın Devam etmek Cypress yapılandırma dosyalarını eklemek için.

Kurulum işlemi tamamlandıktan sonra projenizde yeni bir Cypress klasörü görmelisiniz. Selvi ayrıca bir ekleyecek selvi.config.js Testleriniz için yapılandırma ayarlarını içeren dosya.

Devam edin ve bu dosyayı sunucu temel URL'nizi içerecek şekilde aşağıdaki gibi güncelleyin:

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

Test Senaryolarını Yazın

Artık bazı test senaryoları yazmaya hazırsınız. İlk olarak, Cypress istemcisindeki mevcut seçeneklerden testleri çalıştırmak için Cypress'in başlatılacağı tarayıcıyı seçin.

Ardından, Yeni spesifikasyon oluştur düğmesini kullanarak test dosyanızı oluşturun ve bir ad girin. Sonra tıklayın Spesifikasyon oluştur.

Şimdi aç selvi/fikstürler/example.json dosyasını oluşturun ve içeriğini aşağıdaki kullanıcı kimlik bilgileriyle güncelleyin. Fikstürler, test senaryolarında kullanabileceğiniz statik test verilerini içeren dosyalardır.

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

Selvi sağlar cy.request Bir web sunucusuna HTTP istekleri yapma yöntemi. GET, POST, PUT ve DELETE gibi farklı işlemleri yöneten farklı türdeki HTTP uç noktalarını test etmek için bunu kullanabilirsiniz.

Daha önce tanımladığınız üç API yolunu test etmek için kayıt uç noktasının test senaryosunu açıklayarak başlayın. Bu test senaryosu, yeni bir kullanıcıyı başarıyla kaydettirerek ve iddiaları doğrulayarak uç noktanın düzgün çalıştığını doğrulamalıdır.

Aç selvi/e2e/user.routes.spec.cy.js Dosyayı açın ve içeriğini aşağıdaki kodla güncelleyin.

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

Bu testte Cypress, test verilerini fikstür dosyasına yükleyecek ve istek gövdesindeki verilerle belirtilen uç noktaya POST istekleri yapacaktır. Eğer tüm iddialar başarılı olursa, test durumu başarılı olacaktır. Aksi takdirde başarısız olacaktır.

Cypress testlerinin sözdiziminin, Cypress'in benimsediği Mocha testlerinde kullanılan sözdizimine çok benzediğini belirtmekte fayda var.

Şimdi testi açıklayalım kullanıcılar rota. Test, bu uç noktaya istek yapıldığında yanıtın kullanıcı verilerini içerdiğini doğrulamalıdır. Bunu başarmak için aşağıdaki kodu ekleyin. betimlemek deneme bloğu.

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

Son olarak, oturum açma uç noktasını test edecek ve yanıt durumunun başarılı bir oturum açma girişimini gösteren 200 olduğunu iddia edecek bir test senaryosu ekleyin.

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

Testleri çalıştırmak için Cypress tarafından yönetilen tarayıcı sürümüne dönün ve çalıştırmak istediğiniz belirli test dosyasını seçin.

Cypress test çalıştırıcısı testleri çalıştıracak ve sonuçlarını kaydederek her test senaryosunun başarılı veya başarısız durumunu gösterecektir.

Yukarıdaki örnekler, çeşitli rotaları ve bunlara karşılık gelen denetleyici işlevlerini, işlevselliklerinden ve beklenen davranışlarından emin olmak için nasıl test edebileceğinizi gösterir. API'lerin işlevselliğini test etmek önemli olsa da test kapsamını yalnızca bu hususla sınırlamamalısınız.

Kapsamlı bir API test stratejisi aynı zamanda performans, yük ve diğer hizmetlerle entegrasyon testlerini de içermelidir. Dahil ederek farklı türde test yöntemleri Stratejinizde kapsamlı test kapsamı elde edebilir ve kodunuzu üretime dağıtmadan önce API'lerinizin hem işlevsel hem de güvenilir olduğundan emin olabilirsiniz.

Cypress Kullanarak Tüm Web Deneyiminizi Test Etme

Cypress, web uygulamalarını test etmek için harika bir araçtır ve hem ön uç hem de arka uç için testleri sorunsuz bir şekilde kapsar.

Kullanıcı dostu test özellikleri sayesinde tek bir platformda kolay ve hızlı bir şekilde test ortamı oluşturabilirsiniz. Daha sonra bunu uygulamanızın farklı yönlerini kapsamlı bir şekilde test etmek ve birinci sınıf performansı garanti etmek için kullanabilirsiniz.