Contoh Unit Test dalam PPL

Kris Tianto
Basic People
Published in
2 min readApr 4, 2019

Halo semua! Pada story kali ini, saya akan memberikan sedikit gambaran mengenai unit test sederhana yang dapat dibuat untuk mengetes apakah suatu komponen dalam React sudah sesuai dengan yang dibuat. Bagi kamu yang belum membaca story mengenai TDD, dapat dilihat di sini.

Salah satu contoh test untuk komponen pada React

Pada contoh di atas, ada dua test sederhana yang dapat dilakukan, yaitu menguji apakah komponen berhasil di-render tanpa mengalami crash dan menguji apakah komponen berhasil di-render sesuai dengan rancangan yang dibuat sebelumnya.

Hal pertama yang dilakukan adalah meng-import hal-hal yang digunakan dalam membuat test, yaitu react, react-dom, dan shallow. Kita juga perlu meng-import file komponen yang akan kita uji. Selanjutnya, untuk membuat test yang menguji apakah komponen berhasil di-render tanpa crash, kita bisa membuat suatu <div> kosong, lalu memasukkan komponen tersebut ke dalamnya. Selanjutnya, untuk menguji apakah komponen berhasil di-render sesuai dengan rancangan yang dibuat, kita bisa menggunakan sebuah snapshot untuk membandingkan hasil render dengan yang dirancang. Contoh snapshot dapat dilihat dari gambar di bawah.

Contoh snapshot

Sejauh ini, implementasi unit test yang dibuat untuk komponen pada React masih bersifat sederhana. Dan ke depannya, unit test tersebut dapat dikembangkan lagi untuk mengetes hal-hal lainnya.

Sekian sharing dari saya. Semoga bermanfaat.

--

--