Como registrar um bom bug do navegador

Informar os fornecedores de navegadores sobre os problemas que você encontra é uma parte essencial para melhorar a plataforma da Web.

Pete LePage
Robert Nyman

Registrar um bom bug, mas isso dá um pouco de trabalho. Seu objetivo deve ser facilitar ao máximo para que os engenheiros de navegadores encontrem o que está quebrado, cheguem à causa raiz e, o mais importante, encontrem uma maneira de corrigir o problema. Os bugs que avançam rapidamente tendem a ser rápidos de reproduzir com um comportamento esperado claro.

Verificar se é um bug

A primeira etapa é descobrir qual deve ser o comportamento "correto".

Qual é o comportamento correto?

Verifique os documentos relevantes da API no MDN ou tente encontrar especificações relacionadas. Essas informações podem ajudar você a decidir qual API está realmente com problemas, onde eles estão e qual é o comportamento esperado.

Ele funciona em outro navegador?

O comportamento que difere entre os navegadores geralmente é priorizado como um problema de interoperabilidade, especialmente quando o navegador que contém o bug é o único diferente. Tente testar nas versões mais recentes do Chrome, Firefox, Safari e Edge, possivelmente usando uma ferramenta como o BrowserStack.

Se possível, verifique se a página não está se comportando de maneira diferente de propósito devido à detecção de user agent. No Chrome DevTools, tente definir a string User-Agent como outro navegador.

Ela parou de funcionar em uma versão recente?

Isso funcionava como esperado no passado, mas parou de funcionar em uma versão recente do navegador? Essas regressões podem ser resolvidas com muito mais rapidez, especialmente se você fornecer um número de versão em que o recurso funcionou e uma versão em que ele falhou. Use ferramentas como o BrowserStack para verificar versões antigas do navegador. Use ferramentas como a bisect-builds (para Chromium) para pesquisar a mudança.

Se um problema for uma regressão e puder ser reproduzido, a causa raiz geralmente poderá ser encontrada e corrigida rapidamente.

Outras pessoas estão com o mesmo problema?

Se você está com problemas, é provável que outros desenvolvedores também estejam. Primeiro, tente pesquisar o bug no Stack Overflow. Isso pode ajudar você a traduzir um problema abstrato em uma API corrompida específica e a encontrar uma solução temporária até que o bug seja corrigido.

Ele já foi informado?

Depois de entender o bug, é hora de verificar se ele já foi relatado pesquisando no banco de dados de bugs do navegador.

Se você encontrar um bug que descreva o problema, adicione seu apoio marcando-o com uma estrela, como favorito ou comentando sobre ele. Em muitos sites, você pode se adicionar à lista de CC e receber atualizações quando o bug mudar.

Se você decidir comentar sobre o bug, inclua informações sobre como ele afeta seu site. Evite adicionar comentários do tipo "+1", já que os rastreadores de bugs costumam enviar e-mails para cada comentário.

Informar o bug

Se o bug não tiver sido relatado antes, é hora de informar o fornecedor do navegador sobre ele.

Criar um caso de teste minimizado

A Mozilla tem um ótimo artigo sobre como criar um caso de teste minimizado. Em resumo, embora uma descrição do problema seja um ótimo começo, nada supera uma demonstração vinculada no bug que mostre o problema. Para maximizar a chance de progresso rápido, o exemplo precisa conter o mínimo de código possível para demonstrar o problema. Um exemplo de código mínimo é a melhor maneira de aumentar as chances de o bug ser corrigido.

Confira algumas dicas para minimizar um caso de teste:

  • Faça o download da página da Web, adicione <base href="https://original.url"> e verifique se o bug existe localmente. Isso pode exigir um servidor HTTPS ativo se o URL usar HTTPS.
  • Teste os arquivos locais nas versões mais recentes do maior número possível de navegadores.
  • Tente condensar tudo em um único arquivo.
  • Remova o código (começando com o que você sabe que é desnecessário) até que o bug desapareça.
  • Use o controle de versões para salvar seu trabalho e desfazer o que der errado.

Hospedar um caso de teste minificado

Se você está procurando um bom lugar para hospedar seu caso de teste minificado, há várias opções disponíveis:

Vários desses sites mostram conteúdo em um iframe, o que pode fazer com que recursos ou bugs se comportem de maneira diferente.

Registrar o problema

Depois de ter seu caso de teste minimizado, você estará pronto para registrar o bug. Acesse o site de rastreamento de bugs correto e crie um novo problema.

Adicione descrições claras e etapas para replicar

Primeiro, forneça uma descrição clara para ajudar os engenheiros a entender rapidamente qual é o problema e ajudar na triagem.

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

Em seguida, forneça as etapas detalhadas necessárias para reproduzir o problema e descreva o resultado esperado e o real.

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)

Para mais informações, confira as diretrizes para escrever relatórios de bugs no MDN.

Bônus: adicione uma captura de tela ou screencast do problema

Embora não seja obrigatório, geralmente é útil adicionar uma captura de tela ou um screencast do problema. Isso é útil principalmente quando os bugs ocorrem após várias etapas ou atividades incomuns. Screencasts e capturas de tela geralmente demonstram melhor o que aconteceu para os engenheiros do navegador.

Incluir detalhes do ambiente

Alguns bugs são reproduzíveis apenas em determinados sistemas operacionais ou em tipos específicos de telas (por exemplo, DPI baixo ou alto). Inclua os detalhes de todos os ambientes de teste usados.

Envie o bug

Por fim, envie o bug. Fique de olho no seu e-mail para receber respostas sobre o bug. Normalmente, durante a investigação, os engenheiros podem ter outras perguntas. Se tiverem dificuldade para reproduzir o problema, eles vão entrar em contato.