Ön uç testleri yazıyorsanız, muhtemelen Mock Service Worker (MSW) ile karşılaşmışsınızdır. Tarayıcı ve Node içinde istekleri yakalamak için kullanılan vazgeçilmez bir kütüphanedir ve birim ile bileşen testleri için rakipsizdir. Bu kılavuz, MSW'nin neleri iyi yaptığını, ölçeklenebilirliğinin nerede bittiğini ve ne zaman barındırılan bir API sahteleme platformunun daha mantıklı olduğunu açıklıyor.
Mock Service Worker Nedir?
Mock Service Worker, ağ isteklerini kaynaktan yakalayan bir JavaScript kütüphanesidir. Tarayıcıda, giden `fetch` ve `XMLHttpRequest` çağrılarını yakalayan bir Service Worker kaydeder. Node'da, aynı işleyicilerin Jest veya Vitest'te çalışması için istek katmanını yamalar. Bir metoda ve yola uyan istek işleyicileri yazar, ardından istediğiniz yanıtı döndürürsünüz.

Tasarım akıllıca. Uygulama kodunuz gerçek ağ API'lerini çağırmaya devam ediyor. MSW araya girip yanıt veriyor, böylece `fetch`'i saplamanıza veya HTTP istemcinizi değiştirmenize gerek kalmıyor. Aynı sahte tanımlar testlerde ve çalışan bir geliştirme derlemesinde çalışır, bu yüzden birçok React ve Vue ekibi bunu tercih eder. Yakalama katmanının nasıl çalıştığını görmek için GitHub'daki MSW kaynak koduna bakabilirsiniz.
Tipik bir işleyici şöyle görünür:
import { http, HttpResponse } from 'msw'
export const handlers = [
http.get('/api/users/:id', ({ params }) => {
return HttpResponse.json({ id: params.id, name: 'Ada Lovelace' })
}),
]
Tüm cazibesi bu. Sahte, kodunuzun yanında yaşıyor, testlerinizle birlikte versiyon kontrolünde ve JavaScript'inizin çalıştığı her yerde çalışıyor.
MSW'nin Parladığı Yerler
MSW, sahtenin ve tüketicinin aynı kod tabanında yaşadığı durumlarda güçlü bir çözümdür. Gerçekten doğru araç olduğu birkaç durum:
- Bileşen ve birim testleri. Bir bileşeni oluşturun, gerçek isteklerini göndermesine izin verin ve önceden hazırlanmış verileri döndürün. Bağlanacak test ikizleri yok. Doğrudan istemciyi casusluk yapmakla karşılaştırıyorsanız, bunun bir API çağrısının Jest sahtesinden nasıl farklılaştığını görün.
- Yerel ön uç geliştirme. Arka uç mevcut olmadan önce kullanıcı arayüzünü oluşturun. Yükleme, hatalar veya boş durumları talep üzerine simüle etmek için işleyicileri değiştirin.
- Deterministik CI. Testler canlı bir sunucuya dokunmaz, bu nedenle ağ koşulları veya paylaşılan hazırlık verileri nedeniyle başarısız olmazlar.
- Tek dil, tek ekip. Sahteyi yazan kişiler onu tüketen kişiler olduğunda, işleyicileri depoda tutmak en basit yoldur.
Eğer durumunuz bu tanıma uyuyorsa, muhtemelen başka hiçbir şeye ihtiyacınız yoktur. MSW ücretsizdir, açık kaynaklıdır ve tam da bunun için inşa edilmiştir.
MSW'nin Zorlanmaya Başladığı Yerler
MSW'yi tek bir depoda harika kılan şey, yani o depoda kod olarak yaşayan sahtelerin olması, daha fazla kişi devreye girdiğinde onu sınırlayan şeydir. Ekiplerin onu geride bırakma eğiliminde olduğu yerler şunlardır.
JavaScript Olmayan Tüketiciler
MSW işleyicileri JavaScript'tir. Mobil ekibiniz Swift veya Kotlin yazıyorsa veya arka uç entegrasyon testleriniz Go veya Python'da çalışıyorsa, işleyicilerinizi içe aktaramazlar. Kendi sahtelerine ihtiyaç duyacaklardır ve bunlar sizinkinden farklılık gösterecektir. Gerçek bir URL üzerinden HTTP ile konuşan dilden bağımsız bir sahte sunucu, dili ne olursa olsun her istemci için çalışır.
Paylaşılan, Her Zaman Açık Sahteler
MSW bir işlem içinde çalışır. Bir QA mühendisinin, tasarımcının veya ortak bir ekibin kendi makinelerinden erişebileceği paylaşılan bir URL yoktur. Birkaç kişinin aynı anda kullandığı tek bir uç noktaya ihtiyaç duyduğunuzda, bir tarayıcı sekmesine bağlı bir Service Worker yerine, kararlı bir adrese sahip barındırılan bir sahte sunucuya ihtiyacınız vardır.
Önce Tasarım ve Şema Odaklı İş Akışları
API'leri kod yazmadan önce OpenAPI'de tasarlıyorsanız, sahtelerin belirtimden otomatik olarak oluşturulmasını istersiniz, böylece sahte sözleşmeyle çelişmez. MSW, işleyicileri el ile yazmanızı bekler. Sahteleri doğrudan bir şemadan oluşturmak farklı bir modeldir. Bu yaklaşımla ilgili daha fazla bilgiyi API sahteleme ve etrafındaki kalıplar hakkındaki bu kılavuzda okuyabilirsiniz.
Ölçekte Gerçekçi, Dinamik Veri
MSW, işleyicinizin kodladığı her şeyi döndürür. Birçok alanda gerçeğe yakın veriler için bu mantığı kendiniz yazarsınız. Faker tarzı üretim ve alan adı çıkarımı sağlayan platformlar, her birini el ile yazmadan gerçekçi yanıtlar verir.
MSW ile Tam Bir API Sahteleme Platformu Karşılaştırması
İşte dürüst bir yan yana karşılaştırma. Soyut olarak hiçbir sütun "daha iyi" değildir; farklı sorunları çözerler.
| Yetenek | Mock Service Worker | Barındırılan API platformu (örn. Apidog) |
|---|---|---|
| JS birim/bileşen testleri içinde çalışır | Evet, yerel | Hayır, bir JS test kütüphanesi değil |
| HTTP üzerinden dilden bağımsız | Hayır (yalnızca JS) | Evet, herhangi bir istemci |
| Tüm ekip için paylaşılan URL | Hayır | Evet, barındırılan sahte sunucu |
| OpenAPI'den sahte oluşturma | Manuel | Şemadan otomatik |
| Akıllı/dinamik veri üretimi | Elle kodlanmış | Dahili |
| Testlerle birlikte deponuzda yaşar | Evet | Paylaşılan projede saklanır |
| Maliyet | Ücretsiz, açık kaynak | Ücretsiz katman + ücretli planlar |
Özet: MSW, ön uç testleri ve yerel geliştirme için doğru seçimdir. Apidog gibi bir platform, sahtenin paylaşılması gerektiğinde, dilden bağımsız olduğunda veya bir spesifikasyon tarafından yönlendirildiğinde doğru seçimdir.
Apidog: Yerine Geçen Değil, Tamamlayan
Açık olmak gerekirse, Apidog, Jest veya Vitest içinde MSW'nin yerini doğrudan almaz. Bir test dosyasına aktardığınız bir JavaScript kütüphanesi değildir. Onu birim testlerinizin üzerindeki bir katman olarak düşünün; sahtelerin tüm ekip için paylaşılan, dilden bağımsız bir kaynak haline geldiği yerdir.
Pratikte şöyle görünür: Apidog'da bir API tasarlar veya içe aktarırsınız ve şemadan otomatik olarak bir sahte uç nokta oluşturur. Sahte, ön uç, mobil ve QA ekip arkadaşlarınızın hepsinin çağırabileceği gerçek bir URL alır. Apidog, alan adlarından çıkarım yaparak yanıtları gerçekçi verilerle doldurur, böylece `email` adlı bir alan bir e-posta, `createdAt` ise bir tarih döndürür. Belirli bir 500 yanıtına veya özel bir uç duruma ihtiyacınız olduğunda özel kurallar da yazabilirsiniz.

Sahte, tasarımınız ve testlerinizle aynı şemadan geldiği için sözleşmeyle uyumlu kalır. Bu, elle yazılmış işleyicilerin garanti edemediği kısımdır. Şemadan sahte oluşturmanın araçlar arasında nasıl karşılaştırıldığını görmek isterseniz, en iyi API sahteleme araçları hakkındaki bu derleme seçenekleri yan yana koyar.

Birçok ekibin benimsediği pratik bir ayrım:
- MSW'yi ön uç deposundaki bileşen ve birim testleri için saklayın.
- Ekipler arası entegrasyon, demolar ve JavaScript dışı herhangi bir tüketici için barındırılan bir sahte kullanın.
Birini seçmiyorsunuz. Her birini uygun olduğu yerde kullanıyorsunuz. Mevcut MSW kurulumunuzun yanında barındırılan tarafı denemek isterseniz Apidog'u indirin.
Bilmeye Değer Diğer MSW Alternatifleri
MSW tek sahteleme kütüphanesi değil ve bir platform tek seçeneğiniz değil. Yığınınıza bağlı olarak:
- Mockoon, kod yerine bir GUI ile yerel sahte sunucuları hızlıca açmak için bir masaüstü uygulamasıdır.
- WireMock, Java tabanlı bir sahte sunucudur, JVM ekipleri ve sözleşme testleri için güçlüdür.
- Stoplight'ın Prism'i, komut satırı aracılığıyla doğrudan bir OpenAPI dosyasından bir sahte oluşturur.
- json-server, prototipleme için bir JSON dosyasını hızlı bir REST API'ye dönüştürür.
Her biri bir şeyden ödün verir. WireMock ve Prism, arka uç ve sözleşme çalışmalarına yatkınken; Mockoon ve json-server, hızlı yerel kurulumlara yatkındır. Engeliniz özellikle "MSW, JavaScript dışı ekip arkadaşlarıma yardımcı olamaz" ise, herhangi bir HTTP tabanlı sahte sunucu bunu çözer. Daha geniş bir ön uç bakış açısı için, ekiplerin React'ta Axios ile API'leri nasıl sahtelediklerini görün.
Sıkça Sorulan Sorular
MSW ücretsiz mi?
Evet. Mock Service Worker, MIT lisansı altında açık kaynak kodludur ve ticari olsun ya da olmasın herhangi bir projede kullanımı ücretsizdir. Yalnızca paylaşılan sahteler için barındırılan bir platforma geçtiğinizde ödeme yapmaya başlarsınız ve Apidog gibi araçlar bunun için de ücretsiz bir katman içerir.
Apidog, birim testlerimde MSW'nin yerini alabilir mi?
Hayır, ve bunu yapmaya çalışmamalısınız. MSW, JavaScript test çalıştırıcınızın içindeki istekleri yakalar. Apidog, içe aktarılabilir bir kütüphane değil, barındırılan bir platformdur, bu nedenle MSW'nin yaptığı gibi Jest veya Vitest içinde yer alamaz. Bunun yerine Apidog'u paylaşılan, ekipler arası veya şema odaklı sahteler için kullanın. Yalnızca test çalıştırıcısı tarafına odaklanıyorsanız, API çağrılarını nasıl taklit edeceğiniz hakkındaki bu kılavuz, kod içi yaklaşımları kapsar.
MSW Node'da mı çalışır, yoksa sadece tarayıcıda mı?
Her ikisinde de. Tarayıcıda MSW, bir Service Worker kullanır. Node'da ise istek katmanını yamalayarak aynı işleyicilerin Jest, Vitest veya herhangi bir Node test ortamında çalışmasını sağlar. Bu çift mod, tam yığın JS ekipleri için en büyük güçlü yönlerinden biridir.
MSW'den barındırılan bir sahte sunucuya ne zaman geçmeliyim?
Sahtenin paylaşılması gerektiğinde geçiş yapın veya daha doğrusu bir tane ekleyin. En net işaretler: JavaScript dışı bir istemcinin buna ihtiyacı var, birden fazla kişi aynı kararlı URL'ye ihtiyaç duyuyor veya API'leri önce belirtimle tasarlıyorsunuz ve sahtelerin OpenAPI'den otomatik olarak oluşturulmasını istiyorsunuz.
Sonuç
MSW, ne için inşa edildiyse o konuda mükemmeldir: ön uç ve birim testleri için JavaScript içindeki istekleri yakalamak. Paylaşılan, barındırılan, dilden bağımsız bir sahte olmaya çalışmaz ve bu gayet iyi. Sahtelerinizin depodan ayrılması gerektiğinde, başka dillerin veya başka ekiplerin onlara ihtiyacı olduğunda veya bir belirtimden oluşturulmalarını istediğinizde, yanına tam bir platform eklemenin zamanıdır.
Apidog, paylaşılan, şema odaklı tarafı ele alır: gerçek bir URL'ye sahip barındırılan bir sahte sunucu, OpenAPI tasarımınızdan otomatik sahteler ve kutudan çıktığı haliyle gerçekçi veriler. MSW'yi güçlü olduğu yerde tutun ve test çalıştırıcınızın ötesindeki her şeyi Apidog'un halletmesine izin verin. Apidog'u indirin ve farkı görmek için ön ucunuzu paylaşılan bir sahteye yönlendirin.
