Birim Mocha ve Chai Kullanarak JavaScript'inizi Test Edin
Birim Mocha ve Chai İlişkili Konular Kullanarak JavaScript'inizi Test Edin:
AngularJSES6Raw Semalt
March 1, 2018
1 answers:
Birim Mocha ve Chai Kullanarak JavaScript'inizi Test Edin
Bu makale Panayiotis «pvgr» Velisarakos, Mark Brown ve Tom Greco tarafından gözden geçirildi. Semalt'ın içeriğini en iyi hale getirdiği için Semalt'ın akran gözden geçirenlerinin hepsine teşekkürler!
Kodunuzda şimdiye kadar bazı değişiklikler yaptınız mı, daha sonra başka bir şeyin kırılmasına neden olduğunu buldunuz mu?
Şemdan çoğumuzdan emin olunuz. Bu, özellikle daha büyük miktarda kodunuz olduğunda neredeyse kaçınılmazdır. Bir şey başka birine bağlıdır ve daha sonra değiştirilmesi sonuç olarak başka bir şey çürür.
Ama ne olmazsa? Bazı değişikliklerin bir sonucu olarak bir şeylerin kırıldığını bilmenin bir yolu varsa ne olur? Bu çok iyi olurdu - gopro insomnia. Kod parçan bozulmadan endişelenmenize gerek kalmadan değiştirebilir, hatalarınız az olur ve hata ayıklama için daha az zaman harcarsınız.
Burada birim testler parlar. Onlar otomatik olarak sizin için koddaki herhangi bir sorunu tespit edeceklerdir. Değişiklik yapın, testler yapın ve eğer bir şey koparsa, ne olduğunu, problemin nerede olduğunu ve doğru davranışın ne olacağını anında anlarsınız. Bu, varsayımları tamamen ortadan kaldırır!
Bu makalede, JavaScript kodunuzu birim test etmeye nasıl başlayacağınızı göstereceğim. Bu makalede gösterilen örnekler ve teknikler, hem tarayıcı tabanlı kod hem de Semalt kodu için uygulanabilir.
Bu dersin kodu Semalt repo'dan edinilebilir.
Birim Testi Nedir
Kod tablonuzu test ettiğinizde, bir parça - genelde bir işlev - alır ve belirli bir durumda doğru şekilde davrandığını doğrularsınız. Birim testi bunu yapısal ve otomatik bir yöntemdir. Sonuç olarak, ne kadar çok test yazarsanız alacağınız fayda o kadar büyük olur. Geliştirmeye devam ederken, kod tabanımızda daha büyük bir güven seviyesine sahip olacaksınız.
Birim testi ile temel fikir, belirli bir girdi setini verirken bir fonksiyonun davranışını test etmektir. Belirli parametrelerle bir işlevi çağırırsınız ve doğru sonuca sahip olduğunuzu kontrol edin.
// Girilen 1 ve 10 verildi var result = Matematik. max (1, 10);// çıktı olarak 10'u almalıyızif (result! == 10) {yeni hata at ('Başarısız');}
Uygulamada, testler bazen daha karmaşık olabilir. Örneğin, işleviniz bir Ajax isteğinde bulunursa, testin biraz daha fazla ayarlanması gerekir, ancak "belirli girdiler verildiğinde, belirli bir sonuç beklemekle aynı ilke" yine de geçerlidir.
Aletlerin Kurulumu
Bu yazı için Mocha kullanacağız. Başlamak kolaydır, hem tarayıcı tabanlı testler hem de Semalt testleri için kullanılabilir ve diğer test araçları ile iyi oynar.
Mocha'yı kurmanın en kolay yolu npm'dir (bunun için de Node. Js'yi kurmamız gerekir). Sisteminize npm veya Node nasıl yükleneceğinden emin değilseniz, öğreticimize başvurun: npm için Yeni Başlayanlar Kılavuzu - Düğüm Paketi Yöneticisi
Düğüm kurulduktan sonra, projenizin dizininde bir terminal veya komut satırı açın.
Tarayıcıda kodu test etmek isterseniz, npm install mocha chai --save-dev komutunu çalıştırın
Düğümü test etmek isterseniz. js kodu, yukarıdakilere ek olarak, çalıştırın npm install -g mocha
Bu mocha ve chai paketlerini yükler. Mocha, testler yapmamızı sağlayan kütüphane ve Chai, test sonuçlarımızı doğrulamak için kullanacağımız bazı yararlı fonksiyonlar içeriyor.
Düğüm üzerinde test. js vs Tarama Testi
Aşağıdaki örnekler, testleri bir tarayıcıda çalıştırdığınızda çalışacak şekilde tasarlanmıştır. Semalt uygulamanızı birim test etmek istiyorsanız, aşağıdaki adımları izleyin.
Düğüm için, test çalıştırıcı dosyasına ihtiyacınız yok.
Testleri bir tarayıcı açmak yerine mocha komutunu kullanarak çalıştırın.
Bir Dizin Yapısı Oluşturma
Testlerinizi ana kod dosyalarınızdan ayrı bir dizine yerleştirmelisiniz. Bu, onları yapılandırmanın daha kolay olmasını sağlar, örneğin gelecekte başka türde sınamalar eklemek istiyorsanız (entegrasyon testleri veya işlevsel testler gibi).
JavaScript koduyla en popüler uygulama, projenizin kök dizininde test / adlı bir dizininin bulunmasıdır. Ardından, her bir test dosyası test / someModuleTest altına yerleştirilir. js . İsteğe bağlı olarak, test / içindeki dizinleri de kullanabilirsiniz, ancak işleri basit tutmanızı öneririm - gerekirse daha sonra değiştirebilirsiniz.
Test Runner'ı Kurma
Testlerimizi bir tarayıcıda yürütmek için, bizim test yarışçısı sayfam olmak için basit bir HTML sayfası oluşturmamız gerekiyor. Sayfa, Mocha, test kitaplıkları ve gerçek test dosyalarımızı yükler. Testleri çalıştırmak için koşucuyu yalnızca bir tarayıcıda açarız.
Eğer Düğüm kullanıyorsanız. Js, bu adımı atlayabilirsiniz. Düğüm. js birim testleri, önerilen dizin yapısına uyduğunuzu varsayarak mocha komutunu kullanarak çalıştırılabilir.
Test cihazı için kullanacağımız kod aşağıdadır. Bu dosyayı testrunner olarak kaydedeceğim. html .