Tarayıcı satıcılarına tarayıcılarında buldukları sorunları bildirmek web platformunu daha iyi hale getirmemizin ayrılmaz bir parçasıdır!
İyi bir hatayı bildirmek zor değildir ancak biraz zaman alır. Amaç, neyin bozulduğunu bulmayı, kök nedene ulaşmayı ve en önemlisi bunu düzeltmenin bir yolunu bulmayı kolaylaştırmaktır. Hızlı ilerleme kaydeden hatalar, net bir beklenen davranışla kolayca yeniden oluşturulabilir.
Hata olduğunu doğrulayın
İlk adım, "doğru" davranışın ne olması gerektiğini bulmaktır.
Doğru davranış nedir?
MDN'deki ilgili API belgelerini kontrol edin veya ilgili spesifikasyonları bulmaya çalışın. Bu bilgiler hangi API'nin gerçekten bozuk olduğuna, nerede bozulduğuna ve beklenen davranışın ne olduğuna karar vermenize yardımcı olabilir.
Farklı bir tarayıcıda çalışır mı?
Tarayıcılar arasında farklılık gösteren davranışlar, genellikle birlikte çalışabilirlik sorunu olarak daha yüksek önceliğe sahiptir (özellikle de hatayı içeren tarayıcı garipse). Chrome, Firefox, Safari ve Edge'in en son sürümleri üzerinde test etmeyi deneyin. Bunun için BrowserStack gibi bir araç kullanabilirsiniz.
Mümkünse kullanıcı aracısının algılaması nedeniyle sayfanın kasıtlı olarak farklı bir şekilde davranmadığından emin olun. Chrome Geliştirici Araçları'nda User-Agent dizesini başka bir tarayıcıya ayarlamayı deneyin.
Yakın zamanda yayınlanan bir sürümde bozuldu mu?
Bu işlem geçmişte beklendiği gibi çalışıyor muydu, ancak yakın zamandaki bir tarayıcı sürümünde bozuk muydu? Özellikle çalıştığı bir sürüm numarası ve başarısız olduğu bir sürüm belirtirseniz bu tür "regresyonlar" çok daha hızlı bir şekilde ele alınabilir. BrowserStack gibi araçlar, eski tarayıcı sürümlerini kontrol etmeyi kolaylaştırabilir ve bisect-builds aracı (Chromium için) değişikliği çok verimli bir şekilde aramanıza olanak tanır.
Bir sorun bir regresyonsa ve yeniden oluşturulabiliyorsa temel neden genellikle hızlı bir şekilde bulunup düzeltilebilir.
Başkaları da aynı sorunla karşılaşıyor mu?
Sorun yaşıyorsanız diğer geliştiricilerin de sorun yaşama olasılığı yüksektir. Öncelikle hatayı Stack Overflow'da aramayı deneyin. Bu, soyut bir sorunu bozuk bir API'ye dönüştürmenize ve hata giderilene kadar kısa vadeli bir geçici çözüm bulmanıza yardımcı olabilir.
Daha önce bildirildi mi?
Hatanın ne olduğuyla ilgili bir fikriniz olduğunda, tarayıcı hata veritabanında arama yaparak hatanın önceden bildirilip bildirilmediğini kontrol etmenizin zamanı gelmiştir.
- Chromium tabanlı tarayıcılar: https://crbug.com
- Firefox: https://bugzilla.mozilla.org/
- Safari ve WebKit tabanlı tarayıcılar: https://bugs.webkit.org/
Sorunu açıklayan mevcut bir hata bulursanız hataya yıldız ekleyerek, favorilere ekleyerek veya hataya yorum yaparak desteğinizi ekleyin. Ayrıca, birçok sitede kendinizi CC listesine ekleyip hata değiştiğinde güncelleme alabilirsiniz.
Hatayla ilgili yorum yapmaya karar verirseniz hatanın web sitenizi nasıl etkilediğiyle ilgili bilgi ekleyin. Hata izleyicileri genellikle her yorum için e-posta gönderdiklerinden "+1" tarzında yorumlar eklemekten kaçının.
Hatayı bildir
Hata daha önce bildirilmediyse, sıra tarayıcı sağlayıcısına bunu bildirmeye gelmiştir.
Simge durumuna küçültülmüş bir test durumu oluşturun
Mozilla, küçültülmüş bir test durumunun nasıl oluşturulacağı ile ilgili harika bir makale sunmaktadır. Uzun öyküyü kısaltmak gerekirse, sorunun açıklaması iyi bir başlangıç olsa da, hataya sorunu gösteren bağlantılı bir demo eklemek kadar önemli değildir. Hızlı ilerleme şansını en üst düzeye çıkarmak amacıyla örnek, sorunu göstermek için gereken mümkün olan en az kodu içermelidir. Minimum kod örneği, hatanızın düzeltilme olasılığını artırmak için yapabileceğiniz en iyi şeydir.
Aşağıda, test durumunu en aza indirmek için birkaç ipucu verilmiştir:
- Web sayfasını indirin,
<base href="https://original.url">etiketini ekleyin ve hatanın yerel olarak mevcut olduğunu doğrulayın. URL, HTTPS kullanıyorsa canlı bir HTTPS sunucusu gerektirebilir. - Yerel dosyaları, mümkün olduğunca çok tarayıcının en yeni yapılarında test edin.
- Her şeyi 1 dosyaya sıkıştırmaya çalışın.
- Hata giderilene kadar kodu (gereksiz olduğunu bildiğiniz şeylerden başlayarak) kaldırın.
- Çalışmanızı kaydetmek ve yanlış giden işlemleri geri alabilmek için sürüm denetimini kullanın.
Küçültülmüş test durumunu barındırma
Küçültülmüş test senaryonuzu barındırabileceğiniz iyi bir yer arıyorsanız, yararlanabileceğiniz çeşitli yerler vardır:
Bu sitelerden birkaçının içeriği iframe'de gösterdiğini unutmayın. Bu durum, özelliklerin veya hataların farklı davranmasına neden olabilir.
Sorununuz işleme koyuluyor
Simge durumuna küçültülmüş test senaryonuzu oluşturduktan sonra, bu hatayı bildirmeye hazırsınız demektir. Doğru hata izleme sitesine gidin ve yeni bir sorun oluşturun.
- Chromium tabanlı tarayıcılar - https://crbug.com/new
- Firefox - https://bugzilla.mozilla.org/
- Safari ve WebKit tabanlı tarayıcılar - https://bugs.webkit.org/
Net bir açıklama ve sorunun yeniden üretilmesi için gereken adımları sağlayın
Öncelikle mühendislerin sorunun ne olduğunu hızlıca anlamalarına ve ö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, sorunun yeniden oluşturulması için gereken ayrıntılı adımları sağlayın. Küçültülmüş test senaryonuz burada devreye girer.
What steps will reproduce the problem?
1. Go to https://basic-pwa.glitch.me/, 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.
Son olarak da beklenen ve gerçek sonucu açıklayın.
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 MDN ile ilgili Hata raporu yazma yönergelerine göz atın.
Bonus: Sorunun ekran görüntüsünü veya ekran video kaydını ekleyin
Zorunlu olmasa da bazı durumlarda sorunun ekran görüntüsünü veya ekran görüntüsünü eklemek faydalı olabilir. Bu, özellikle hataların yeniden üretilmesi için bazı adımlar gerektiği durumlarda faydalıdır. Ekran video kaydında veya ekran görüntüsünde ne olduğunu görebilmek genellikle faydalı olabilir.
Ortamla ilgili ayrıntıları ekleyin
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 oluşturulabilir. Kullandığınız test ortamlarının ayrıntılarını eklediğinizden emin olun.
Hatayı gönder
Son olarak, hatayı gönderin. Sonra, hataya verilen yanıtlar için e-postanızı düzenli olarak kontrol etmeyi unutmayın. Genellikle inceleme sırasında ve hatayı düzeltirken mühendislerin ek soruları olabilir veya sorunu yeniden oluşturmakta zorluk yaşarlarsa size ulaşabilirler.