# Reportar pelo widget URL: /reportar/widget Use o botão do Mira dentro da aplicação testada, sem instalar nada. O widget é o painel do Mira dentro da aplicação testada. Ele só existe nas aplicações em que o time de desenvolvimento instalou o bridge, e só nos ambientes de desenvolvimento, QA e staging. Foi testado no Chrome e no Edge. Quem integra o widget lê [Integrar uma app](/desenvolvedores/integrar). Se a extensão está ativa na aba, o botão do widget some. Use a extensão. ## Abrir o widget [#abrir-o-widget] Clique no botão do Mira, no canto inferior direito da aplicação, ou use o atalho `Alt+Shift+M`. A aplicação também pode colocar a opção num menu próprio. Um painel abre junto do botão, acima dele na metade de baixo da janela e abaixo na de cima.
O menu tem quatro linhas: - **Screenshot**, com a seta para **Página inteira** e **Captura exata**. - **Gravar**, para escolher **Aba** ou **Desktop** e ligar o **Microfone**. - **Elemento**, para apontar um componente da página. - **Novo report**, para escrever primeiro. Com um rascunho em andamento, o topo do menu mostra o título dele: um clique reabre o report, e a lixeira ao lado o descarta depois de uma confirmação. **Rascunhos** lista os outros, e o rodapé tem as **Configurações**. A **Fila de envio** só aparece no rodapé quando um envio falha, já que o reenvio é automático. Rascunhos, fila e configurações abrem no lugar do menu, com **Voltar ao menu** no topo. Menu do widget com Screenshot, Gravar, Elemento e Novo report. Nome planejado: `widget-menu.png`. ## Entrar na primeira vez [#entrar-na-primeira-vez] ### Clicar em Entrar [#clicar-em-entrar] O painel pede login. Clique em **Entrar**: ele mostra um código de aprovação, como `KQ7M-3XHD`.
### Aprovar no Mira [#aprovar-no-mira] Clique em **Aprovar no Mira**. O dashboard abre numa aba nova, pede o seu login se for preciso e mostra o código, a origem, o projeto e o ambiente. Confira que o código é o mesmo do painel e clique em **Aprovar**. ### Voltar à aplicação [#voltar-à-aplicação] O painel percebe a aprovação sozinho e abre o menu. Sua senha não passa pela aplicação testada. O widget lembra de você nessa aplicação por 30 dias. O código vale por 10 minutos e serve para uma aprovação. Se expirar, clique em **Entrar** de novo. ## Reportar [#reportar] 1. Faça uma captura pelo menu, ou escolha **Novo report**. O report abre num diálogo sobre a página. 2. À esquerda fica o anexo escolhido, grande, com as miniaturas de todos os anexos embaixo: screenshots, vídeos, arquivos, links, o elemento, o replay e os dados técnicos. Clique numa miniatura para vê-la, e use **Adicionar** para trazer mais capturas, arquivos e links. 3. À direita fica o formulário. O tipo começa em **Bug**; troque para **Melhoria** ou **Sugestão** se for o caso. Resuma no título e conte o resto na **Descrição**, que aceita Markdown (o botão **Visualizar**, com o ícone de olho, mostra o resultado). **Prioridade** é opcional. Se o projeto tem [templates](/administrar/templates), `Tab` ou **Usar** preenche o campo vazio com o texto do template. 4. Marque os dados técnicos que quer enviar. O rodapé diz quantos anexos vão com o report. 5. Clique em **Criar**: o diálogo fecha e um aviso no canto mostra **Enviando…** e depois **Report enviado**, com **Abrir report** e **Novo report**. O link do report vai para a área de transferência. O aviso some sozinho depois de seis segundos, ou antes, pelo **X** ou por `Escape`, e fica aberto enquanto o mouse ou o foco estão nele. Quando a cópia do link falha, ele fica até ser fechado e mostra o link para copiar à mão. Numa falha de envio, **Tentar novamente** antecipa o reenvio. Diálogo do widget com o screenshot no editor, as miniaturas e o formulário. Nome planejado: `widget-dialog.png`.
Com o formulário aberto, o diálogo não fecha por Escape nem por clique fora. **Descartar**, no rodapé, pede confirmação e apaga o rascunho. Uma nova captura ou gravação esconde o diálogo e o rascunho continua guardado, e o rascunho no topo do menu o reabre. ### Quando usar a Captura exata [#quando-usar-a-captura-exata] A captura comum é instantânea, mas pode errar em gráficos, mapas, vídeos e no conteúdo de iframes. Nesses casos, use **Captura exata**: o navegador pede para você escolher a aba, e a imagem sai exatamente como está na tela. ### Gravar a tela [#gravar-a-tela] Se o projeto tem replay habilitado, clique em **Gravar replay** no formulário antes de reproduzir o problema. Para gravar um vídeo da aba ou do desktop, veja [Gravação de vídeo](/reportar/evidencias#gravação-de-vídeo). Detalhes do replay em [Evidências](/reportar/evidencias#replay). ## Rascunhos [#rascunhos] Cada report fica salvo como rascunho no navegador até ser enviado ou descartado. Uma captura pelo menu, com um rascunho em andamento, guarda esse rascunho e começa outro. **Rascunhos** lista os guardados, do mais recente ao mais antigo, com tipo, título, data e número de anexos. A seta continua o rascunho, e a lixeira o descarta depois de confirmar. O rascunho volta quando você recarrega a página ou abre o widget de novo: título, descrição, tipo, arquivos, links e vídeos gravados. Os screenshots voltam só se a página recarregar no mesmo endereço. Sair da conta apaga os rascunhos do site. ## Configurações [#configurações] A engrenagem do rodapé abre as configurações no próprio painel, com idioma, tema e a sessão. **Voltar ao menu** fecha. ## Depois do envio [#depois-do-envio] O widget copia o link do report quando a página permite `clipboard-write`, e o aviso diz **Link do report copiado**. Sem a permissão, o aviso mostra o link para copiar à mão. **Abrir report** abre o report no dashboard. ## Sem conexão [#sem-conexão] Se o Mira estiver fora do ar ou a sessão expirar, o report fica em **Fila de envio** e é reenviado na próxima vez que você abrir a aplicação. Na fila, **Tentar de novo** antecipa uma tentativa, **Descartar** apaga o report salvo no navegador e **Recarregar** atualiza a lista. ## Próximos passos [#próximos-passos] - [Evidências: capturas, elemento e replay](/reportar/evidencias) - [Boas práticas para escrever um bom report](/reportar/boas-praticas)