Jak zgłosić błąd w przeglądarce

Informowanie dostawców przeglądarek o problemach napotkanych w ich przeglądarkach to integralna część ulepszania tej platformy internetowej.

Pete LePage
Robert Nyman

Zgłoszenie dobrego błędu nie jest trudne, ale wymaga trochę pracy. Chodzi o to, aby łatwo było znaleźć usterkę, dotrzeć do jej głównej przyczyny i najważniejsze sposoby jej usunięcia. Błędy, które szybko postępują, można łatwo odtworzyć i z wyraźnym oczekiwanym zachowaniem.

Potwierdź, że to błąd

Pierwszym krokiem jest określenie, jakie powinno być „prawidłowe” zachowanie.

Na czym polega prawidłowe działanie?

Przejrzyj odpowiednią dokumentację interfejsu API w MDN lub poszukaj powiązanych specyfikacji. Na podstawie tych informacji możesz określić, który interfejs API jest faktycznie uszkodzony i gdzie działa, oraz jakie jest oczekiwane działanie.

Czy ta aplikacja działa w innej przeglądarce?

Różnice w działaniu przeglądarek są zwykle traktowane priorytetowo jako problem interoperacyjności, zwłaszcza gdy przeglądarka, w której występuje błąd, jest nietypowa. Przetestuj najnowsze wersje przeglądarek Chrome, Firefox, Safari i Edge. Możesz to zrobić za pomocą narzędzia takiego jak BrowserStack.

Jeśli to możliwe, sprawdź, czy strona nie zachowuje się celowo w związku z wykrywaniem klienta użytkownika. W Narzędziach deweloperskich w Chrome spróbuj ustawić ciąg User-Agent na inną przeglądarkę.

Czy w ostatniej wersji nie działała prawidłowo?

Czy w przeszłości działało to zgodnie z oczekiwaniami, ale w najnowszej wersji przeglądarki wystąpił błąd? Takie „regresje” można zareagować znacznie szybciej, zwłaszcza jeśli podasz numer wersji, w której wszystko działało, i wersji, w której wystąpił błąd. Sprawdzenie starych wersji przeglądarek przy pomocy narzędzi takich jak BrowserStack jest proste, a bisect-builds (dla Chromium) pozwala bardzo sprawnie wyszukiwać zmiany.

Jeśli problem to regresja i można ją odtworzyć, główną przyczynę zwykle można szybko znaleźć i rozwiązać.

Czy inni mają ten sam problem?

Jeśli Twój problem występuje, prawdopodobnie inni deweloperzy też go używają. Najpierw spróbuj wyszukać błąd na stronie Stack Overflow. Może to pomóc w przełożeniu abstrakcyjnego problemu na określony uszkodzony interfejs API oraz znalezienie krótkoterminowego sposobu obejścia tego problemu, dopóki błąd nie zostanie naprawiony.

Czy została wcześniej zgłoszona?

Gdy będziesz już wiedzieć, na czym polega błąd, sprawdź, czy nie został już zgłoszony. W tym celu przeszukaj bazę danych błędów przeglądarki.

Jeśli znajdziesz błąd, który opisuje problem, daj nam znać, oznaczając go gwiazdką, dodając do ulubionych lub komentując. W wielu witrynach możesz też dołączyć do listy DW i otrzymywać powiadomienia o zmianach.

Jeśli zdecydujesz się dodać komentarz o błędzie, napisz, jak wpływa on na Twoją witrynę. Unikaj dodawania komentarzy typu „+1”, ponieważ narzędzia do śledzenia błędów zwykle wysyłają e-maile przy każdym komentarzu.

Zgłoś błąd

Jeśli błąd nie został wcześniej zgłoszony, pora poinformować o nim dostawcę przeglądarki.

Tworzenie zminimalizowanego przypadku testowego

Mozilla zawiera świetny artykuł na temat tworzenia zminimalizowanego przypadku testowego. Mówiąc w skrócie: opis problemu to świetny początek, ale nic nie przeszkodzi umieścić w błędzie link do demonstracji, który pokazuje problem. Aby maksymalnie zwiększyć szanse na szybki postęp, przykład powinien zawierać minimalną ilość kodu, który jest potrzebny do zademonstrowania problemu. Minimalna próbka kodu to pierwsza rzecz, którą możesz zrobić, aby zwiększyć szanse na naprawienie błędu.

Oto kilka wskazówek, jak zminimalizować liczbę przypadków testowych:

  • Pobierz stronę internetową, dodaj <base href="https://original.url"> i sprawdź, czy błąd występuje lokalnie. Może to wymagać aktywnego serwera HTTPS, jeśli adres URL korzysta z protokołu HTTPS.
  • Przetestuj pliki lokalne w najnowszych kompilacjach w jak największej liczbie przeglądarek.
  • Spróbuj wszystko połączyć w jeden plik.
  • Usuwaj kod (zaczynając od elementów, o których wiesz, że jest niepotrzebne), dopóki błąd nie zniknie.
  • Dzięki kontroli wersji możesz zapisywać zmiany i cofać działania, które działają nieprawidłowo.

Hostowanie zminifikowanego przypadku testowego

Jeśli szukasz dobrego miejsca do przeprowadzenia zminifikowanej wersji testowej, istnieje kilka dobrych miejsc:

Pamiętaj, że wiele z nich wyświetla treść w elemencie iframe, co może powodować odmienne działanie funkcji lub błędów.

Zgłaszanie problemu

Po utworzeniu zminimalizowanego przypadku testowego możesz zgłosić błąd. Wejdź na odpowiednią stronę śledzenia błędów i utwórz nowy problem.

Podaj jasny opis i czynności, które musisz wykonać, aby odtworzyć problem.

Po pierwsze, podaj jasny opis, aby inżynierowie mogli szybko zrozumieć, na czym polega problem, i pomóc w jego sklasyfikowaniu.

When installing a PWA using the `beforeinstallprompt.prompt()`, the
`appinstalled` event fires before the call to `prompt()` resolves.

Następnie podaj szczegółowe instrukcje, które pozwolą odtworzyć problem. Dlatego warto skorzystać z zminimalizowanego przypadku testowego.

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.

Na koniec opisz oczekiwany i rzeczywisty wynik.

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)

Więcej informacji znajdziesz w artykule ze wskazówkami dotyczącymi pisania raportów o błędach na stronie MDN.

Dodatkowe informacje: dodaj zrzut ekranu lub screencasta przedstawiającego problem.

Chociaż nie jest to wymagane, w niektórych przypadkach pomocne może być dodanie zrzutu ekranu lub screencasta problemu. Jest to szczególnie przydatne w przypadkach, gdy odtworzenie błędu wymaga wykonania pewnych czynności. Często warto zobaczyć, co dzieje się w screencaście lub na zrzucie ekranu.

Dołącz szczegółowe informacje o środowisku

Niektóre błędy można odtworzyć tylko w określonych systemach operacyjnych lub tylko na wybranych rodzajach wyświetlaczy (np. o niskiej lub wysokiej rozdzielczości dpi). Pamiętaj, by podać szczegółowe informacje o używanych przez Ciebie środowiskach testowych.

Zgłoś błąd

Na koniec zgłoś błąd. Następnie pamiętaj, aby sprawdzać pocztę e-mail, czy otrzymasz odpowiedź w związku z tym błędem. Zazwyczaj w trakcie sprawdzania i naprawiania błędu inżynierowie mogą mieć dodatkowe pytania, a jeśli mają trudności z odtworzeniem problemu, mogą się z nim skontaktować.