Jangan Cuma Ngoding, Yuk Bikin Kode yang Lebih Percaya Diri dengan Jest!

Pernah nggak sih kamu lagi asyik ngoding, fitur udah keren, tampilan udah kece, eh tiba-tiba ada bug nyempil yang bikin frustrasi? Atau lebih parah lagi, deploy ke production, eh malah ada error yang bikin panik satu tim? Kalau pernah, berarti kita senasib!

Nah, di sinilah pentingnya punya "sahabat" yang selalu setia ngecek kualitas kode kita: Jest. Dia adalah framework pengujian JavaScript yang bakal jadi sahabat terbaik buat kode kamu.

Kenapa Sih Kita Perlu "Sahabat" Kayak Jest Ini?

Bayangin deh, kamu bangun rumah impian. Pasti kamu nggak mau kan kalau fondasinya rapuh? Nah, kode juga gitu. Kalau nggak diuji dengan benar, bisa jadi bom waktu yang siap meledak kapan aja.

Dengan Jest, kita bisa "meriksa" kode kita secara otomatis. Ibaratnya kayak punya quality control pribadi buat setiap baris kode yang kita tulis. Jadi, sebelum kode kita "terbang" ke pengguna, kita udah yakin duluan kalau semuanya berjalan sesuai rencana.

Apa Aja Sih Keuntungan Punya "Sahabat" Jest Ini?

• Nggak Bikin Pusing: Jest ini ramah banget buat pemula. Sintaksnya sederhana, nggak ribet, dan gampang dipelajari. Jadi, buat kamu yang baru nyemplung di dunia testing juga nggak bakal langsung minder.
• Bikin Kode Kita Lebih "Pede": Dengan Jest, kita bisa nulis tes untuk setiap bagian kecil kode kita (namanya unit testing). Jadi, setiap kali ada perubahan, kita bisa langsung tahu kalau ada yang "ngaco". Hasilnya? Kode kita jadi lebih stabil dan minim bug.
• Nggak Cuma Tes Fungsi Biasa: Jest punya fitur keren namanya Snapshot Testing. Fitur ini bisa "merekam" tampilan user interface (UI) atau output dari kode kita. Kalau ada perubahan yang nggak sesuai harapan, Jest bakal langsung ngasih tahu. Mantap kan?
• Integrasi? Nggak Masalah!: Jest ini akrab banget sama library dan framework JavaScript populer, terutama React. Jadi, buat kamu yang lagi belajar atau udah mahir pakai React, Jest ini bakal jadi teman setia. Tapi tenang, buat yang pakai Vue.js atau framework lain juga bisa banget pakai Jest.
• Laporan Hasil Tes yang Jelas: Setelah kita jalankan tes, Jest bakal ngasih laporan yang super jelas. Kita bisa langsung tahu tes mana yang berhasil, mana yang gagal, dan kenapa gagalnya. Jadi, proses debugging jadi lebih efisien.

Yuk, Kenalan Lebih Dekat dengan Jest!

Gimana sih cara kerjanya Jest ini? Anggap aja gini:

1. Kita kasih "instruksi" ke Jest (nulis tes): Kita kasih tahu Jest, "Hei Jest, tolong dong cek fungsi penambahan ini. Kalau aku kasih angka 2 dan 3, hasilnya harus 5 ya!"
2. Jest "ngerjain" instruksi kita (menjalankan tes): Jest bakal menjalankan fungsi yang kita tes dengan input yang kita berikan.
3. Jest kasih laporan (hasil tes): Jest bakal bilang, "Oke bos, fungsi penambahan kamu hasilnya 5. Beres!" Atau kalau hasilnya beda, dia bakal ngasih tahu di mana letak salahnya.

Mulai Menggunakan: Instalasi Jest

Untuk mulai menggunakan Jest, pastikan Anda telah menginstal Node.js dan npm (atau yarn) di komputer Anda. Kemudian, buka terminal atau command prompt di direktori proyek Anda dan jalankan perintah berikut:

npm install --save-dev jest
# or using yarn
yarn add --dev jest

Perintah ini akan menginstal Jest sebagai dev dependency (dependensi pengembangan) di proyek Anda.

Selanjutnya, buka file package.json proyek Anda dan tambahkan atau modifikasi bagian scripts seperti berikut:

{
  "scripts": {
    "test": "jest"
  }
}

Dengan konfigurasi ini, Kamu dapat menjalankan semua tes di proyek Anda dengan menggunakan perintah npm test atau yarn test di terminal.

Menulis Tes Pertama Kamu

Mari kita buat contoh sederhana. Misalkan kita memiliki fungsi JavaScript bernama sum di dalam file bernama math.js:

// math.js
function sum(a, b) {
  return a + b;
}

module.exports = sum;

Sekarang, kita akan membuat file tes untuk fungsi ini. Biasanya, file tes diletakkan di dalam folder __tests__ atau memiliki nama yang berakhiran .test.js atau .spec.js. Mari kita buat file bernama math.test.js di direktori yang sama dengan math.js:

// math.test.js
const sum = require('./math');

describe('Sum', () => {
  test('should add two numbers correctly', () => {
    expect(sum(2, 3)).toBe(5);
  });

  test('should work with negative numbers', () => {
    expect(sum(-1, 5)).toBe(4);
  });
});

Mari kita bedah kode di atas:

require('./math'): Mengimpor fungsi sum dari file math.js.

describe('Sum', () => { ... });: describe adalah blok yang digunakan untuk mengelompokkan tes yang berkaitan. Ini membantu dalam mengorganisir tes dan memberikan konteks yang lebih baik pada output.

test('seharusnya menambahkan dua angka dengan benar', () => { ... });: test (atau Anda juga bisa menggunakan it) adalah blok individual yang berisi satu skenario pengujian. Argumen pertama adalah deskripsi dari tes tersebut.

expect(sum(2, 3)).toBe(5);: Ini adalah inti dari sebuah tes.

expect(sum(2, 3)): Memanggil fungsi sum dengan input 2 dan 3, dan kemudian membungkus hasilnya dengan fungsi expect.

.toBe(5): Ini adalah sebuah matcher. Matcher digunakan untuk melakukan assertion atau memeriksa apakah nilai yang diharapkan sesuai dengan nilai aktual. Dalam kasus ini, kita mengharapkan hasil dari sum(2, 3) adalah 5.

Matcher Populer di Jest

Selain toBe, Jest menyediakan berbagai matcher berguna lainnya untuk melakukan berbagai jenis pengecekan:

toEqual(value): Memeriksa kesamaan nilai secara mendalam, termasuk untuk objek dan array.

toBeGreaterThan(number): Memeriksa apakah suatu nilai lebih besar dari angka yang diberikan.

toBeLessThan(number): Memeriksa apakah suatu nilai kurang dari angka yang diberikan.

toBeNull(): Memeriksa apakah suatu nilai adalah null.

toBeUndefined(): Memeriksa apakah suatu nilai adalah undefined.

toBeTruthy(): Memeriksa apakah suatu nilai dianggap truthy (misalnya, bukan false, 0, null, undefined, '', atau NaN). toBeFalsy(): Memeriksa apakah suatu nilai dianggap falsy.

Menjalankan Tes

Setelah Anda membuat file tes, kembali ke terminal Anda dan jalankan perintah:

npm test
# or
yarn test

Jest akan mencari file-file tes di proyek Anda dan menjalankan semua tes yang ditemukannya. Anda akan melihat output yang menunjukkan apakah tes lulus atau gagal, beserta dengan informasi detail jika ada tes yang gagal.

Kesimpulan

Jest adalah framework pengujian JavaScript yang kuat dan mudah digunakan. Dengan fitur-fiturnya yang komprehensif, Jest membantu kita menulis tes yang efektif dan memastikan kualitas kode aplikasi kita. Ini hanyalah pengantar dasar, dan Jest memiliki banyak fitur lanjutan lainnya untuk dieksplorasi. Dengan memahami dasar-dasar ini, Anda sudah selangkah lebih dekat dengan praktik pengembangan web yang lebih baik dan lebih andal.

Tunggu apa lagi? Mari coba uji aplikasi Anda menggunakan Jest, cheers!