paint-brush
Jasmine: Saf Fonksiyonlar ve Temel Testler Konusunda Yeni Başlayanlara Uygun Bir Kılavuzile@marcinwosinek
200 okumalar

Jasmine: Saf Fonksiyonlar ve Temel Testler Konusunda Yeni Başlayanlara Uygun Bir Kılavuz

ile Marcin Wosinek6m2024/02/11
Read on Terminal Reader

Çok uzun; Okumak

Saf işlevler birim testi için mükemmel bir durumdur. Belirli bir girdi için her zaman aynı çıktıyı bekleriz; herhangi bir iç durum söz konusu değildir. Yöntemlerin beklendiği gibi çalışıp çalışmadığını kontrol eden birkaç örneğe ve bazı basit testlere göz atalım.
featured image - Jasmine: Saf Fonksiyonlar ve Temel Testler Konusunda Yeni Başlayanlara Uygun Bir Kılavuz
Marcin Wosinek HackerNoon profile picture

Saf işlevler birim testi için mükemmel bir durumdur. Belirli bir girdi için her zaman aynı çıktıyı bekleriz; herhangi bir iç durum söz konusu değildir. Yöntemlerin beklendiği gibi çalışıp çalışmadığını kontrol eden birkaç örneğe ve bazı basit testlere göz atalım.

Yasemin

Jasmine, JavaScript için bir birim test çerçevesidir. Testleri hem Node.js'de hem de tarayıcıda çalıştırabilir. Angular çerçevesinde kullanılır ve özellikle Angular tabanlı projelerde popülerdir. Vanilla JS projeleri veya diğer çerçeveleri temel alan projeler için sağlam bir seçimdir.

Mutlu Yol Testi

Mutlu yol testi, normal çalışması beklenen bir yöntemi girdilerle test ettiğimiz zamandır. Argümanlar geçerli ve makul aralıklarda. Bu testler, yöntemin işini doğru şekilde yapıp yapmadığını kontrol eder; test senaryoları, yöntemin belgelerinde nasıl açıklandığıyla ilgili basit örnekler olmalıdır.


Sözde kod örnekleri:

  • expect(add(2, 2)).toBe(4) ,


  • expect(concatenate(“Lorem”, “Ipsum”)).toBe(“LoremIpsum”)


Bu testlerin amacı, yöntem anahtarı davranışı bozulduğunda bunu otomatik olarak yakalamaktır.

Yöntemler

Birkaç basit yöntem görelim: Bazı gerçek dünya uygulamalarında ihtiyaç duyabileceğimiz basit işlemler.


Tüm uygulamalar büyük ölçüde basitleştirilmiştir; eğer onlara beklenenden biraz farklı parametreler sağlarsak, tüm yöntemler çirkin bir şekilde bozulacaktır. Kod sağlam olmaktan uzaktır.

selamlaşmak

Kullanıcıyı adı ve soyadıyla karşılayan yöntem:

 export function greet(name, surname) { return `Hello ${name} ${surname}!`; }

kısa tarih

shortDate bir tarih nesnesini alan ve onu kısa dize olarak biçimlendirilmiş olarak döndüren bir biçimlendirme yöntemidir. Kod:

 export function shortDate(date) { return date.toISOString().substring(0, 10); }

üç nokta

ellipsis uzun bir metin dizesi ve isteğe bağlı bir uzunluk parametresi alır ve ardından dizeyi sınıra sığacak şekilde keser:

 export function ellipsis(text, length = 50) { if (text.length > length) { return text.substring(0, length) + "…"; } return text; }

Çevirmek

Bir key ve lang çifti için çevrilmiş dize değerleri sağlayan bir yöntem. Daha gelişmiş çeviri kitaplıklarıyla değiştirilebilecek olanın basitleştirilmiş bir uygulamasıdır.

 export function translate(key, lang = "en") { switch (lang) { case "en": switch (key) { case "hello": return "Hello!"; } case "pl": switch (key) { case "hello": return "Cześć!"; } } }

İndirim uygula

Bir fiyata yüzde indirim uygulama yöntemi. Bu saf uygulama aşırıya kaçmış gibi gelebilir, ancak daha sonra uç durumları araştırmaya başladığımızda her şey çok daha ilginç hale gelecektir.

 export function applyDiscount(price, discountPercentage) { return price - (price * discountPercentage) / 100; }

HesaplaFiyat

Bu, belirli bir fiyata birden fazla birim satın alırken toplam fiyatı hesaplar. Ayrıca ilginç uç durumlar eklendikten sonra işler daha da karmaşıklaşacaktır.

 export function calculatePrice(unitPrice, quantity) { return unitPrice * quantity; }

JS Kodunu Tamamlayın

JS kodunun tamamı, src/main.js :

 export function greet(name, surname) { return `Hello ${name} ${surname}!`; } export function shortDate(date) { return date.toISOString().substring(0, 10); } export function ellipsis(text, length = 50) { if (text.length > length) { return text.substring(0, length) + "…"; } return text; } export function translate(key, lang = "en") { switch (lang) { case "en": switch (key) { case "hello": return "Hello!"; } case "pl": switch (key) { case "hello": return "Cześć!"; } } } export function applyDiscount(price, discountPercentage) { return price - (price * discountPercentage) / 100; } export function calculatePrice(unitPrice, quantity) { return unitPrice * quantity; }

Yasemin Testleri Ekleme

Jasmine'i eklemek için klasörü bir npm paketine dönüştürerek başlayalım:

 $ npm init -y Wrote to …/package.json: …


Daha sonra Jasmine paketini kurabiliriz:

 $ npm install --save-dev jasmine added 42 packages, and audited 43 packages in 2s 13 packages are looking for funding run `npm fund` for details found 0 vulnerabilities


Daha sonra Jasmine tarafından kullanılan klasörleri ve dosyaları oluşturabiliriz:

 $ npx jasmine init (no output)


Bu komut aşağıdakileri üretir:

  • spec/*.spec.js dosyalarını teste koyabileceğimiz bir klasör ve


  • spec/support/jasmine.json —Jasmine yapılandırmasını içeren bir dosya.

Birim Testleri

Aşağıdaki birim testleri için yalnızca mutlu yola odaklanıyorum; makul girdiler için sonucun beklendiği gibi olup olmadığını kontrol ediyorum. Test kendi kendini açıklayıcı nitelikte olmalıdır, o yüzden gelin onlara bir göz atalım:

 import { greet, shortDate, ellipsis, translate, applyDiscount, calculatePrice, } from "../src/main.js"; describe("main", () => { describe("greet", () => { it("should greet by name and surname", () => { expect(greet("Lorem", "Ipsum")).toEqual("Hello Lorem Ipsum!"); }); }); describe("shortDate", () => { it("should format correclty date", () => { const date = new Date("2023-11-02"); expect(shortDate(date)).toEqual("2023-11-02"); }); }); describe("shortDate", () => { it("should shorten long text at 50 chars", () => { expect( ellipsis( "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a faucibus massa." ) ).toEqual("Lorem ipsum dolor sit amet, consectetur adipiscing…"); }); it("should leave short text unchanged", () => { expect(ellipsis("Lorem ipsum sin dolor")).toEqual( "Lorem ipsum sin dolor" ); }); it("should shorten to custom length", () => { expect(ellipsis("Lorem ipsum sin dolor", 10)).toEqual("Lorem ipsu…"); }); }); describe("translate", () => { it("should translate to supported langauges", () => { expect(translate("hello", "en")).toEqual("Hello!"); expect(translate("hello", "pl")).toEqual("Cześć!"); }); }); describe("applyDiscount", () => { it("should lower the price accordingly", () => { expect(applyDiscount(120, 25)).toEqual(90); expect(applyDiscount(8, 50)).toEqual(4); }); }); describe("calculatePrice", () => { it("should find a price of many products", () => { expect(calculatePrice(4, 3)).toEqual(12); expect(calculatePrice(9, 0.5)).toEqual(4.5); }); }); });

( spec/main.spec.js dosyası)

Testleri Çalıştırma

Testleri çalıştırmak için aşağıdaki betiği package.json dosyasına ekleyebiliriz:

 .. "scripts": { "test": "jasmine" }, …


Bunu yerine getirdiğimizde, npm run test testlerimizi çalıştırır:

 $ npm run test > [email protected] test > jasmine Randomized with seed 76873 Started ........ 8 specs, 0 failures Finished in 0.004 seconds Randomized with seed 76873 (jasmine --random=true --seed=76873)

Özet

Bu yazıda basit bir JS kodu örneğine ve bunun birim testlerle nasıl kapsanabileceğine bir göz attık. Kod örneğinin tamamını GitHub'da bulabilirsiniz.


Burada da yayınlandı