Rumah > hujung hadapan web > tutorial js > Unit, Integrasi dan ETesting dalam Satu Contoh Menggunakan Jest

Unit, Integrasi dan ETesting dalam Satu Contoh Menggunakan Jest

DDD
Lepaskan: 2024-11-20 19:53:15
asal
314 orang telah melayarinya

pengenalan

Ramai pembangun menghadapi cabaran semasa menguji kod mereka. Tanpa ujian yang betul, pepijat boleh tergelincir, membawa kepada pengguna yang kecewa dan pembaikan yang mahal.

Artikel ini akan menunjukkan kepada anda cara menggunakan ujian Unit, Integrasi dan End-to-End dengan berkesan menggunakan Jest, Supertest dan Puppeteer pada contoh yang sangat mudah yang dibina menggunakan Node.js dan MongoDB.

Menjelang akhir artikel ini, saya harap anda akan mempunyai pemahaman yang jelas tentang cara menggunakan jenis ujian ini dalam projek anda sendiri.

?? Sila dapatkan contoh penuh di sini dalam repo ini.

Memperkenalkan Ketergantungan kami

Sebelum memasang kebergantungan kami, izinkan saya memperkenalkan contoh kami terlebih dahulu. Ini adalah contoh yang sangat mudah di mana pengguna boleh membuka halaman pendaftaran, menetapkan butiran pendaftaran mereka, klik butang pendaftaran dan maklumat mereka disimpan dalam pangkalan data.

Dalam contoh ini, kami akan menggunakan pakej berikut:

npm install --save jest express mongoose validator
npm install --save-dev jest puppeteer jest-puppeteer mongodb-memory-server supertest npm-run-all
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kebanyakan kebergantungan ini adalah mudah, tetapi berikut ialah penjelasan untuk beberapa daripadanya:

  • puppeteer: Membolehkan anda mengawal penyemak imbas tanpa kepala (Chrome) untuk ujian automatik dan mengikis web.
  • Jest-Puppeteer: Ia dipratetap untuk Jest yang menyepadukan Puppeteer, memudahkan persediaan untuk menjalankan ujian hujung ke hujung dalam persekitaran penyemak imbas. Anda boleh menggunakannya sebagai pratetap dalam fail jest.config.js dan anda boleh menyesuaikan tingkah laku Puppeteer melalui fail yang dipanggil jest-puppeteer.config.js.
  • mongodb-memory-server: Ia ialah utiliti yang memutarkan tika MongoDB dalam ingatan untuk ujian pantas dan terpencil interaksi pangkalan data.
  • npm-run-all: Alat CLI untuk menjalankan berbilang skrip npm secara selari atau berurutan.

Pengujian Unit

  • Definisi: Ujian unit memfokuskan pada menguji komponen atau fungsi individu secara berasingan. Matlamatnya adalah untuk mengesahkan bahawa setiap unit kod berfungsi seperti yang diharapkan.
  • Kelajuan: Ujian unit biasanya sangat pantas kerana mereka menguji cebisan kecil kod tanpa bergantung pada sistem luaran atau pangkalan data.
  • Contoh: Dalam contoh pendaftaran pengguna kami, ujian unit mungkin menyemak fungsi yang mengesahkan alamat e-mel. Sebagai contoh, ia akan mengesahkan bahawa fungsi itu mengenal pasti dengan betul user@example.com sebagai sah semasa menolak user@.com atau user.com.

Baik, mari terjemahkan ini ke dalam kod.

Menyediakan Persekitaran Pengujian Unit

Untuk menjalankan ujian unit anda tanpa tingkah laku yang tidak dapat diramalkan, anda harus menetapkan semula fungsi olok-olok sebelum setiap ujian. Anda boleh mencapai ini menggunakan beforeEach cangkuk:

// setup.unit.js

beforeEach(() => {
  jest.resetAllMocks();
  jest.restoreAllMocks();
}); 
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Menguji Pengesahan E-mel

Dalam kes ini, kami ingin menguji fungsi validateInput:

npm install --save jest express mongoose validator
npm install --save-dev jest puppeteer jest-puppeteer mongodb-memory-server supertest npm-run-all
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Ia adalah fungsi yang sangat mudah yang mengesahkan jika input yang diberikan mengandungi e-mel yang sah. Inilah ujian unitnya:

// setup.unit.js

beforeEach(() => {
  jest.resetAllMocks();
  jest.restoreAllMocks();
}); 
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

tunggu jangkaan(async () => {}).menolak: Berdasarkan dokumentasi Jest, ini adalah cara untuk mengharapkan sebab janji yang ditolak.

Menguji untuk E-mel Pendua

Mari kita uji fungsi lain yang menyemak sama ada terdapat e-mel pendua dalam pangkalan data. Sebenarnya, yang ini menarik kerana kita perlu berurusan dengan pangkalan data, dan pada masa yang sama, ujian unit tidak sepatutnya berurusan dengan sistem luaran. Jadi apa yang perlu kita lakukan? Baiklah, kita patut menggunakan Mocks.

Pertama, lihat fungsi emailShouldNotBeDuplicated yang perlu kita uji:

// register.controller.js
const validator = require('validator');

const registerController = async (input) => {
  validateInput(input);
  ...
};

const validateInput = (input) => {
  const { name, email, password } = input;
  const isValidName = !!name && validator.isLength(name, { max: 10, min: 1 });
  if (!isValidName) throw new Error('Invalid name');
  ...
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Seperti yang anda lihat, fungsi ini menghantar permintaan kepada pangkalan data untuk menyemak sama ada terdapat pengguna lain yang mempunyai e-mel yang sama. Begini cara kita boleh mengejek panggilan pangkalan data:

// __tests__/unit/register.test.js
const { registerController } = require('../controllers/register.controller');

describe('RegisterController', () => {
  describe('validateInput', () => {
    it('should throw error if email is not an email', async () => {
      const input = { name: 'test', email: 'test', password: '12345678' };
      await expect(async () => await registerController(input)).rejects.toThrow('Invalid email');
    });
  });
});
Salin selepas log masuk
Salin selepas log masuk

Kami mengejek (mengintip) kaedah findOne pangkalan data menggunakan jest.spyOn(objek, methodName) yang mencipta fungsi olok-olok dan menjejaki panggilannya. Hasilnya, kami boleh menjejaki bilangan panggilan dan parameter yang diluluskan bagi kaedah findOne intipan menggunakan toHaveBeenNthCalledWith.

Pengujian Integrasi

  • Definisi: Ujian integrasi menilai cara berbilang komponen berfungsi bersama. Ia menyemak interaksi antara fungsi, modul atau perkhidmatan yang berbeza.
  • Kelajuan: Ujian penyepaduan adalah lebih perlahan daripada ujian unit kerana ia melibatkan berbilang komponen dan mungkin memerlukan akses pangkalan data atau panggilan rangkaian.
  • Contoh: Untuk proses pendaftaran pengguna, ujian integrasi boleh mengesahkan bahawa semasa menghantar permintaan pendaftaran, data pengguna disahkan dengan betul dan disimpan dalam pangkalan data. Ujian ini akan memastikan bahawa semua komponen—seperti pengesahan input, titik akhir API dan interaksi pangkalan data—berfungsi bersama seperti yang dimaksudkan.

Menyediakan Persekitaran Pengujian Integrasi

Sebelum menulis ujian penyepaduan kami, kami perlu mengkonfigurasi persekitaran kami:

npm install --save jest express mongoose validator
npm install --save-dev jest puppeteer jest-puppeteer mongodb-memory-server supertest npm-run-all
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
  • Seperti yang anda lihat, kami mengeksport testingApp kerana kami memerlukannya dalam ujian integrasi. Dan kami mengeksportnya sebagai fungsi kerana ia sedang dieksport sebelum ia dimulakan sepenuhnya, memandangkan beforeAll tak segerak, modul.exports penyata dijalankan sebelum testingApp diberikan nilai, menyebabkan nilai itu tidak ditentukan apabila kami cuba menggunakannya dalam ujian kami fail.
  • Dengan menggunakan cangkuk Jest, kami dapat melakukan perkara berikut:
    • sebelum Semua: Memulakan pelayan Express dan menyambung ke pangkalan data MongoDB dalam memori.
    • afterAll: Menutup pelayan Express dan menghentikan pangkalan data MongoDB dalam memori yang sedang berjalan.
    • beforeEach: Membersihkan pangkalan data dengan menjatuhkan koleksi pengguna sebelum setiap kes ujian.

Kini, kami bersedia untuk menjalankan ujian integrasi kami.

Menguji Permintaan API Pendaftaran

Mari kita uji keseluruhan proses pendaftaran bahagian pelayan—daripada menghantar permintaan pendaftaran kepada menyimpan butiran pengguna dalam pangkalan data dan mengubah hala ke halaman kejayaan:

// setup.unit.js

beforeEach(() => {
  jest.resetAllMocks();
  jest.restoreAllMocks();
}); 
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Seperti yang anda lihat, fungsi registerController menyepadukan berbilang komponen (fungsi), validateInput, emailShouldNotBeDuplicated dan fungsi createUser.

Jadi, mari tulis ujian penyepaduan kami:

// register.controller.js
const validator = require('validator');

const registerController = async (input) => {
  validateInput(input);
  ...
};

const validateInput = (input) => {
  const { name, email, password } = input;
  const isValidName = !!name && validator.isLength(name, { max: 10, min: 1 });
  if (!isValidName) throw new Error('Invalid name');
  ...
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
  • Seperti yang anda lihat, dalam kes ujian ini, kami menggunakan pakej terunggul untuk menghantar permintaan pendaftaran ke API kami. Ini menyerupai gelagat pengguna sebenar semasa proses pendaftaran.
  • Dalam kes ini, kami tidak mengejek panggilan pangkalan data, kerana kami perlu menguji tingkah laku sebenar.

Ujian Hujung ke Hujung (E2E).

  • Definisi: Ujian E2E mensimulasikan senario pengguna sebenar untuk mengesahkan keseluruhan aliran aplikasi dari awal hingga akhir. Ia menguji aplikasi secara keseluruhan, termasuk antara muka pengguna dan perkhidmatan hujung belakang.
  • Kelajuan: Ujian E2E adalah yang paling perlahan antara tiga jenis kerana ia melibatkan menavigasi antara muka aplikasi dan berinteraksi dengan pelbagai komponen, selalunya memerlukan berbilang permintaan rangkaian.
  • Contoh: Dalam konteks pendaftaran pengguna, ujian E2E akan mensimulasikan pengguna membuka halaman pendaftaran, mengisi butiran mereka (seperti nama, e-mel dan kata laluan), mengklik butang "Daftar" , dan kemudian menyemak sama ada ia diubah hala ke halaman kejayaan. Ujian ini mengesahkan bahawa setiap bahagian proses pendaftaran berfungsi dengan lancar bersama-sama dari perspektif pengguna.

Mari kita lihat contoh kita.

Menyediakan Persekitaran Pengujian E2E

Sebenarnya, dalam contoh kami, konfigurasi persekitaran untuk ujian hujung ke hujung adalah serupa dengan ujian penyepaduan.

Menguji Proses Pendaftaran dari Mula hingga Tamat

Dalam kes ini, kita perlu betul-betul mensimulasikan tingkah laku pendaftaran pengguna sebenar, daripada membuka halaman pendaftaran, mengisi butiran mereka (nama, e-mel, kata laluan), mengklik butang "Daftar", dan akhirnya dialihkan ke halaman kejayaan . Sila lihat kod:

npm install --save jest express mongoose validator
npm install --save-dev jest puppeteer jest-puppeteer mongodb-memory-server supertest npm-run-all
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Mari pecahkan kod ini:

  • Terdapat banyak alatan yang boleh anda gunakan untuk melaksanakan ujian hujung ke hujung anda, di sini kami menggunakan Jest bersama Puppeteer untuk melaksanakan ujian hujung ke hujung kami.
  • Anda mungkin tertanya-tanya apakah pembolehubah halaman? Seperti yang Jest jangkakan, ia adalah pembolehubah global yang disediakan oleh Puppeteer, mewakili satu tab dalam penyemak imbas yang membolehkan kita melakukan tindakan seperti menavigasi dan berinteraksi dengan elemen.
  • Kami menggunakan Puppeteer untuk mensimulasikan tingkah laku pengguna dengan membuka halaman itu menggunakan fungsi goto, mengisi input menggunakan fungsi jenis, mengklik butang pendaftaran menggunakan fungsi klik.

Menjalankan Semua Ujian Bersama-sama dengan Konfigurasi Berbeza

Unit, Integration, and ETesting in One Example Using Jest

Foto oleh Nathan Dumlao di Unsplash

Pada ketika ini, anda mungkin tertanya-tanya cara menjalankan semua jenis ujian secara serentak apabila setiap jenis mempunyai konfigurasi sendiri. Contohnya:

  • Dalam ujian unit, anda perlu menetapkan semula semua olok-olok sebelum setiap kes ujian, manakala dalam ujian penyepaduan, ini tidak perlu.
  • Dalam ujian penyepaduan, anda mesti menyediakan sambungan pangkalan data anda sebelum menjalankan ujian anda, tetapi dalam ujian unit, ini tidak diperlukan.

Jadi, bagaimanakah kita boleh menjalankan semua jenis ujian pada masa yang sama sambil memastikan masing-masing mematuhi konfigurasi yang sepadan?

Untuk menangani masalah ini, ikut langkah berikut:

1. Mari buat tiga fail konfigurasi berbeza, jest.unit.config.js:

// setup.unit.js

beforeEach(() => {
  jest.resetAllMocks();
  jest.restoreAllMocks();
}); 
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

jest.integration.config.js:

// register.controller.js
const validator = require('validator');

const registerController = async (input) => {
  validateInput(input);
  ...
};

const validateInput = (input) => {
  const { name, email, password } = input;
  const isValidName = !!name && validator.isLength(name, { max: 10, min: 1 });
  if (!isValidName) throw new Error('Invalid name');
  ...
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

jest.e2e.config.js:

// __tests__/unit/register.test.js
const { registerController } = require('../controllers/register.controller');

describe('RegisterController', () => {
  describe('validateInput', () => {
    it('should throw error if email is not an email', async () => {
      const input = { name: 'test', email: 'test', password: '12345678' };
      await expect(async () => await registerController(input)).rejects.toThrow('Invalid email');
    });
  });
});
Salin selepas log masuk
Salin selepas log masuk

2. Seterusnya, kemas kini skrip npm anda dalam fail package.json seperti berikut:

// register.controller.js
const { User } = require('../models/user');

const registerController = async (input) => {
    ...
  await emailShouldNotBeDuplicated(input.email);
  ...
};

const emailShouldNotBeDuplicated = async (email) => {
  const anotherUser = await User.findOne({ email });
  if (anotherUser) throw new Error('Duplicated email');
};
Salin selepas log masuk

--config: Menentukan laluan ke fail konfigurasi Jest.

npm-run-all --parallel: Membenarkan menjalankan semua ujian secara selari.

3. Kemudian, buat tiga fail persediaan bernama setup.unit.js, setup.integration.js dan setup.e2e.js, yang mengandungi kod persediaan yang diperlukan yang digunakan dalam bahagian sebelumnya.
4. Akhir sekali, jalankan semua ujian dengan melaksanakan perintah npm run test ini. Perintah ini akan melaksanakan semua ujian unit, penyepaduan dan hujung ke hujung secara selari mengikut konfigurasi masing-masing.

Kesimpulan

Dalam artikel ini, kami meneroka ujian unit, penyepaduan dan hujung ke hujung (E2E), dengan menekankan kepentingannya untuk membina aplikasi yang boleh dipercayai. Kami menunjukkan cara untuk melaksanakan kaedah ujian ini menggunakan Jest, Supertest dan Puppeteer dalam contoh pendaftaran pengguna yang mudah dengan Node.js dan MongoDB.

Malah, strategi ujian yang kukuh bukan sahaja meningkatkan kualiti kod tetapi juga meningkatkan keyakinan pembangun dan meningkatkan kepuasan pengguna.

Saya harap artikel ini telah memberikan anda cerapan berguna yang boleh anda gunakan untuk projek anda sendiri. Selamat mencuba!

Fikir-fikirkanlah

Jika anda mendapati artikel ini berguna, lihat artikel ini juga:

  • MongoDB GridFS Dipermudahkan
  • Cara Saya Memperbaik Penstriman Video dengan FFmpeg dan Node.js
  • 4 Cara Untuk Mengendalikan JavaScript Tak Segerak

Terima kasih banyak kerana kekal bersama saya sehingga ke tahap ini. Saya harap anda seronok membaca artikel ini.

Atas ialah kandungan terperinci Unit, Integrasi dan ETesting dalam Satu Contoh Menggunakan Jest. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan