İyi bir hatayı dosyalamak zor değil ama biraz çalışma gerektiriyor. Amaç, neyin bozulduğunu bulmayı kolaylaştırmak, temel nedene ulaşmak ve en önemlisi onu düzeltmenin bir yolunu bulmaktır. Hızlı ilerleme sağlayan hataların, net bir beklenen davranışla yeniden üretilmesi kolay olma eğilimindedir.
Bunun bir hata olduğunu doğrulayın #
İlk adım, “doğru” davranışın ne olması gerektiğini bulmaktır.
Doğru davranış nedir? #
İlgili API belgelerini şu adreste kontrol edin: MDNveya ilgili özellikleri bulmaya çalışın. Bu bilgiler, hangi API’nin gerçekten bozulduğuna, nerede bozulduğuna ve beklenen davranışın ne olduğuna karar vermenize yardımcı olabilir.
Farklı bir tarayıcıda çalışıyor mu? #
Tarayıcılar arasında farklılık gösteren davranışa, özellikle hatayı içeren tarayıcı tuhafsa, birlikte çalışabilirlik sorunu olarak genellikle daha yüksek öncelik verilir. Muhtemelen aşağıdaki gibi bir araç kullanarak Chrome, Firefox, Safari ve Edge’in en son sürümlerinde test etmeye çalışın Tarayıcı Yığını.
Mümkünse, kullanıcı aracısının koklaması nedeniyle sayfanın kasıtlı olarak farklı davranmadığını kontrol edin. Chrome DevTools’ta deneyin ayarlamak User-Agent başka bir tarayıcıya dize.
Son bir sürümde kırıldı mı? #
Bu geçmişte beklendiği gibi çalıştı, ancak yeni bir tarayıcı sürümünde bozuldu mu? Bu tür “gerilemeler”, özellikle çalıştığı yerde bir sürüm numarası ve başarısız olduğu yerde bir sürüm sağlarsanız, çok daha hızlı hareket edilebilir. gibi araçlar Tarayıcı Yığını eski tarayıcı sürümlerini kontrol etmeyi kolaylaştırabilir ve bisect-builds aracı (Chromium için), değişikliğin çok verimli bir şekilde aranmasına olanak tanır.
Bir sorun bir gerilemeyse ve yeniden üretilebiliyorsa, kök neden genellikle hızlı bir şekilde bulunup giderilebilir.
Başkaları da aynı sorunu görüyor mu? #
Sorun yaşıyorsanız, diğer geliştiricilerin de sorun yaşama olasılığı yüksektir. İlk önce, hatayı aramayı deneyin Yığın Taşması. Bu, soyut bir sorunu belirli bir bozuk API’ye dönüştürmenize yardımcı olabilir ve hata düzeltilene kadar kısa vadeli bir geçici çözüm bulmanıza yardımcı olabilir.
Daha önce bildirildi mi? #
Hatanın ne olduğu hakkında bir fikriniz olduğunda, tarayıcı hata veri tabanında arama yaparak hatanın zaten rapor edilip edilmediğini kontrol etme zamanı.
Sorunu açıklayan mevcut bir hata bulursanız, hataya yıldız ekleyerek, favorilere ekleyerek veya yorum yaparak desteğinizi ekleyin. Ayrıca birçok sitede kendinizi CC listesine ekleyebilir ve hata değiştiğinde güncellemeler alabilirsiniz.
Hata hakkında yorum yapmaya karar verirseniz, hatanın web sitenizi nasıl etkilediği hakkında bilgi ekleyin. Hata izleyicileri genellikle her yorum için e-posta gönderdiğinden, “+1” tarzı yorumlar eklemekten kaçının.
Hatayı bildir #
Hata daha önce bildirilmemişse, tarayıcı satıcısına bunu söylemenin zamanı geldi.
Küçültülmüş bir test senaryosu oluşturun #
Mozilla’nın harika bir makalesi var. Küçültülmüş bir test senaryosu nasıl oluşturulur?. Uzun lafın kısası, sorunun açıklaması harika bir başlangıç olsa da, sorunu gösteren hatada bağlantılı bir demo sağlamak gibisi yoktur. Hızlı ilerleme şansını en üst düzeye çıkarmak için örnek, sorunu göstermek için gereken minimum olası kodu içermelidir. Minimal bir kod örneği, hatanızın düzeltilme olasılığını artırmak için yapabileceğiniz bir numaralı şeydir.
Bir test senaryosunu en aza indirmek için birkaç ipucu:
- Web sayfasını indirin, ekleyin
<base href="ve hatanın yerel olarak var olduğunu doğrulayın. URL HTTPS kullanıyorsa bu, canlı bir HTTPS sunucusu gerektirebilir. - Yerel dosyaları olabildiğince çok sayıda tarayıcının en son sürümlerinde test edin.
- Her şeyi 1 dosyada yoğunlaştırmaya çalışın.
- Hata ortadan kalkana kadar kodu kaldırın (gereksiz olduğunu bildiğiniz şeylerden başlayarak).
- Çalışmanızı kaydedebilmek ve ters giden şeyleri geri alabilmek için sürüm kontrolünü kullanın.
Küçültülmüş bir test çalışması barındırma #
Küçültülmüş test durumunuzu barındırmak için iyi bir yer arıyorsanız, uygun birkaç iyi yer vardır:
Bu sitelerin birçoğunun, özelliklerin veya hataların farklı davranmasına neden olabilecek bir iframe’de içerik görüntülediğini unutmayın.
Sorununuzu dosyalama #
Küçültülmüş test durumunuzu aldıktan sonra, bu hatayı bildirmeye hazırsınız. Doğru hata izleme sitesine gidin ve yeni bir sorun oluşturun.
Net bir açıklama ve sorunu yeniden oluşturmak için gereken adımları sağlayın #
İlk olarak, mühendislerin sorunun ne olduğunu hızlı bir şekilde anlamalarına ve sorunu öncelik sırasına koymalarına yardımcı olacak net bir açıklama sağlayın.
When installing a PWA using the `beforeinstallprompt.prompt()`, the
`appinstalled` event fires before the call to `prompt()` resolves.
Ardından, sorunu yeniden oluşturmak için gereken ayrıntılı adımları sağlayın. Burası senin küçültülmüş test durumu içeri gelir.
What steps will reproduce the problem?
1. Go to open DevTools and look at the
console tab.
2. Click the Install button in the page, you might need to interact with
the page a bit before it becomes enabled.
3. Click Install on the browser modal install confirmation.
Ve son olarak, açıklayın beklenenVe gerçek sonuç.
What is the expected result? In the console:
0. INSTALL: Available (logged when `beforeinstallprompt` event fired)
1. INSTALL_PROMPT_RESPONSE: {outcome: "accepted", platform: "web"}
(logged when beforeinstallprompt.prompt()` resolves)
2. INSTALL: Success (logged when `appinstalled` event fired)What is the actual result? In the console:
0. INSTALL: Available (logged when `beforeinstallprompt` event fired)
1. INSTALL: Success (logged when `appinstalled` event fired)
2. INSTALL_PROMPT_RESPONSE: {outcome: "accepted", platform: "web"}
(logged when beforeinstallprompt.prompt()` resolves)
Daha fazla bilgi için göz atın Hata raporu yazma yönergeleri MDN’de.
Bonus: Sorunun ekran görüntüsünü veya ekran görüntüsünü ekleyin #
Zorunlu olmamakla birlikte, bazı durumlarda sorunun ekran görüntüsünü veya ekran görüntüsünü eklemek yararlı olabilir. Bu, özellikle hataların yeniden üretilmesi için bazı garip adımlar gerektirebileceği durumlarda yararlıdır. Bir ekran kaydında veya bir ekran görüntüsünde neler olduğunu görebilmek genellikle yardımcı olabilir.
Ortamın ayrıntılarını dahil edin #
Bazı hatalar yalnızca belirli işletim sistemlerinde veya yalnızca belirli ekran türlerinde (örneğin, düşük dpi veya yüksek dpi) yeniden üretilebilir. Kullandığınız tüm test ortamlarının ayrıntılarını eklediğinizden emin olun.
hatayı gönder #
Son olarak, hatayı gönderin. Ardından, hataya verilen yanıtlar için e-postanıza göz kulak olmayı unutmayın. Tipik olarak, inceleme sırasında ve hatayı düzeltirken mühendislerin ek soruları olabilir veya sorunu yeniden oluşturmakta güçlük çekerlerse bize ulaşabilirler.