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

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

Pete LePage
Robert Nyman

Zgłoszenie dobrego błędu, ale wymaga trochę pracy. Twoim celem powinno być jak największe ułatwienie inżynierom przeglądarek znajdowania tego, co jest zepsute, znajdowania przyczyny problemu i co najważniejsze – znajdowania sposobu na jego rozwiązanie. Błędy, które szybko prowadzą do postępu, są zwykle łatwe do odtworzenia i mają wyraźnie określone oczekiwane działanie.

Potwierdź, że to błąd

Pierwszym krokiem jest ustalenie, jakie powinno być „prawidłowe” działanie.

Jakie jest prawidłowe działanie?

Sprawdź odpowiednie dokumenty API na stronie MDN lub znajdź powiązane specyfikacje. 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 działa w innej przeglądarce?

Zachowanie, które różni się w różnych przeglądarkach, jest zwykle traktowane priorytetowo jako problem ze zgodnością, zwłaszcza gdy przeglądarka z błędem jest jedyną, która się wyróżnia. Spróbuj przetestować najnowsze wersje przeglądarek Chrome, Firefox, Safari i Edge, najlepiej za pomocą narzędzia takiego jak BrowserStack.

Jeśli to możliwe, sprawdź, czy strona nie zachowuje się inaczej z powodu podsłuchiwania przez 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 funkcja działała zgodnie z oczekiwaniami, ale nie działa w ostatniej wersji przeglądarki? W przypadku takich regresji można szybciej podjąć działania, zwłaszcza jeśli podasz numer wersji, w której funkcja działała, i numer wersji, w której przestała działać. Aby sprawdzić starsze wersje przeglądarek, możesz użyć narzędzi takich jak BrowserStack. Aby znaleźć zmianę, użyj narzędzi takich jak bisect-builds (w przypadku Chromium).

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 masz problemy, istnieje duże prawdopodobieństwo, że mają je też inni deweloperzy. 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ł on zgłoszony wcześniej?

Gdy już określisz, na czym polega błąd, sprawdź, czy został on już zgłoszony, wyszukując go w bazie danych błędów przeglądarki.

Jeśli znajdziesz błąd opisujący problem, możesz go oznaczyć jako ulubiony, dodać do ulubionych lub skomentować. W wielu witrynach możesz dodać siebie do listy DW i otrzymywać powiadomienia o zmianach w błędach.

Jeśli zdecydujesz się dodać komentarz o błędzie, napisz, jak wpływa on na Twoją witrynę. Unikaj dodawania komentarzy w stylu „+1”, ponieważ lokalizatory błędów wysyłają e-maile dotyczące każdego komentarza.

Zgłaszanie błędu

Jeśli błąd nie został jeszcze zgłoszony, poinformuj o nim dostawcę przeglądarki.

Tworzenie zminimalizowanego test case

Mozilla udostępniła świetny artykuł o tworzeniu zminimalizowanego test case. Krótko mówiąc, opis problemu to dobry początek, ale nic nie zastąpi załączonego w błędzie pliku demonstracyjnego, 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. Minimalny kod sample to najważniejsza rzecz, jaką możesz zrobić, aby zwiększyć szanse na naprawienie błędu.

Oto kilka wskazówek dotyczących minimalizowania przypadku testowego:

  • Pobierz stronę internetową, dodaj <base href="https://original.url"> i sprawdź, czy błąd występuje lokalnie. Jeśli adres URL używa protokołu HTTPS, może być potrzebny działający serwer HTTPS.
  • Przetestuj pliki lokalne w najnowszych wersjach jak największej liczby przeglądarek.
  • Spróbuj wszystko połączyć w jeden plik.
  • Usuń kod (zaczynając od elementów, które są niepotrzebne), aż błąd zniknie.
  • Używaj kontroli wersji, aby zapisywać swoją pracę i odwracać zmiany, które nie wyszły dobrze.

Hostowanie zminiaturyzowanego przypadku testowego

Jeśli szukasz dobrego miejsca do hostowania uproszczonego przypadku testowego, masz do wyboru kilka opcji:

Pamiętaj, że wiele z tych witryn wyświetla treści w ramce iframe, co może powodować nieprawidłowe działanie funkcji lub błędy.

Zgłoś problem

Gdy masz zminimalizowany przypadek testowy, możesz zgłosić błąd. Otwórz odpowiednią stronę śledzenia błędów i utwórz nowy problem.

Dodaj jasne opisy i kroki, które chcesz powielić

Najpierw podaj jasny opis, aby pomóc inżynierom szybko zrozumieć, na czym polega problem, i pomóc w jego klasyfikacji.

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. Właśnie w takich przypadkach przydaje się zminiaturyzowane test case.

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 wskazówkach dotyczących tworzenia zgłoszeń błędów na stronie MDN.

Bonus: dodaj zrzut ekranu lub nagranie ekranu przedstawiające problem

Chociaż nie jest to wymagane, często warto dołączyć zrzut ekranu lub screencast przedstawiający problem. Jest to szczególnie przydatne, gdy błędy występują po kilku krokach lub nietypowej aktywności. Filmy i zrzuty ekranu często lepiej obrazują, co się stało, dla inżynierów zajmujących się przeglądarkami.

Dołącz szczegóły środowiska

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, aby podać szczegóły wszystkich wykorzystanych środowisk testowych.

Przesyłanie błędu

Na koniec zgłoś błąd. Sprawdź skrzynkę e-mail, aby zobaczyć odpowiedź na zgłoszenie błędu. Zazwyczaj w trakcie sprawdzania inżynierowie mogą mieć dodatkowe pytania. Jeśli mają problem z odtworzeniem problemu, mogą się z Tobą skontaktować.