gui testing tutorial
Um guia completo para testes de GUI: Tutorial de teste de interface do usuário
O que é teste de GUI?
O Teste de GUI é um processo de teste da interface gráfica do usuário do aplicativo para garantir a funcionalidade adequada de acordo com as especificações. Envolve a verificação dos componentes do aplicativo, como botões, ícones, caixas de seleção, cor, menu, janelas, etc.
perguntas e respostas da entrevista de automação qa
A dinâmica visual de um aplicativo da web desempenha um papel fundamental na aceitação de um aplicativo com o usuário.
Consequentemente, esta aceitação resulta em trazer uma escravidão de longo tempo dos clientes com a aplicação do cliente. Nesta era de digitalização, a interface do usuário está mudando rapidamente e é uma fortaleza fundamental para atrair uma nova multidão de possíveis clientes.
O que você aprenderá:
- Teste de interface do usuário
- Abordagem para teste de IU
- Defeitos de IU de ocorrência comum
- Principais requisitos de teste de usabilidade e interface do usuário
- Alguns componentes básicos
- Alguns componentes avançados
- Estados dos componentes da IU
- Ferramentas de teste de GUI
- Exemplos de casos de teste de GUI
- Conclusão
- Leitura recomendada
Teste de interface do usuário
Para garantir que a estética visual do aplicativo da web seja bem aceita, os testes de IU e usabilidade tornam-se um aspecto-chave da prática geral de QA. Qualquer aplicativo que pode ser acessado por meio de um URL é um aplicativo baseado na web. Nesses aplicativos, testamos principalmente o front end do aplicativo que deve ser usado pelo usuário final.
Cada navegador exibe páginas da web de maneira diferente, por isso é importante que a página tenha a mesma aparência em navegadores diferentes. Se uma página da web for exibida distorcida e não gerenciada, isso levará os visualizadores a sair da página. Portanto, um site deve passar por testes de IU para obter melhores resultados.
O teste de navegador compreende os dois tipos abaixo:
Teste de funcionalidade
Teste de diferentes funções em todo o aplicativo. Envolve a validação de todas as navegações, bem como todos os valores de campo que estão presentes nas páginas front-end usando todos os cenários positivos e negativos.
Teste de IU
Testando o fator de aparência da página da web. O fator de aparência inclui tipo de exibição, fonte, alinhamento, botão de opção, caixa de seleção etc.
- As áreas cobertas nos testes de IU são usabilidade, aparência, controles de navegação / barras de navegação, instruções e estilo de informação técnica, imagens, tabelas, acessibilidade, etc.
- Para testar a acessibilidade, temos que verificar as diretrizes de acessibilidade de conteúdo da W3C-Web.
Clique Aqui para obter a diretriz W3C.
Abordagem para teste de IU
Selecionamos um subconjunto de casos de teste de casos de teste funcionais que cobrem todas as funcionalidades do aplicativo.
A segunda etapa é modificar esses casos de teste de acordo com os requisitos de teste de IU.
A próxima etapa será executar esses casos de teste; comparar o resultado com os resultados esperados e, se houver alguma diferença, levantar a questão para o mesmo. Não é possível testar em todos os navegadores. Normalmente, o cliente decide em qual navegador é necessário testar.
Como sabemos, cada navegador exibe uma página da web de maneira diferente, portanto, não podemos esperar que todos os navegadores exibam uma página da web exatamente semelhante.
Por exemplo, drop-down no windows-firefox será diferente do mac-firefox. Esses problemas são aceitáveis, pois são utilitários de sistema operacional e precisamos aceitá-los como tal.
Navegador de base: Normalmente o aplicativo é desenvolvido visando um navegador que deve ser usado principalmente por usuários finais, é denominado como o navegador base.
Defeitos de IU de ocorrência comum
- Problemas de alinhamento de botão
- Espaço inconsistente entre rótulos ou caixas de texto
- Rótulos quebrados, ou seja, rótulo de linha única sendo exibido em duas linhas
- Desalinhamento entre caixas de texto, ícones de informação, rótulos ou menus suspensos
- Sobreposição de campos
- Campos incompletos
- Os dados da página estão desalinhados; alguns deslocados no tempo para cima ou para baixo
- Em qualquer navegador, ao selecionar alguma ação, a ação correspondente não está acontecendo
- O redimensionamento não está funcionando como esperado
- Tempo de expiração da sessão muito curto ou muito longo para alguns navegadores
- Problemas específicos do navegador - Poucos campos não são editáveis depois de inserir dados em um navegador, mas podem ser editados em outro navegador
Principais requisitos de teste de usabilidade e interface do usuário
Os principais requisitos de teste de IU do aplicativo da web são:
- Disponibilidade de vários componentes em uma IU
- Vários estados do componente UI
Componente:
Um componente é um bloco de construção, que pode ser usado com a combinação de vários outros componentes para formar um aplicativo. Os componentes podem ser reutilizados em todo o aplicativo.
Exemplos de um componente incluem botão, campo de texto, sugestão automática, caixa de seleção, lista suspensa etc.
Alguns componentes básicos
Caixa de seleção: Uma ou mais opções podem ser selecionadas no componente da caixa de seleção
Botões do rádio: Quando apenas uma opção precisa ser selecionada, os botões de rádio são úteis
Alguns componentes avançados
1. Acordeão: Vários itens podem ser empilhados verticalmente usando este componente. Cada item pode ser expandido para visualizar o conteúdo nele. Mais de um item também pode ser expandido.
2. Pão ralado: Este é um componente muito útil que auxilia na navegação do site. O usuário pode identificar sua localização atual no site a partir deste componente.
3. Carrossel: Vários conjuntos de itens de informação podem ser incorporados em um componente de carrossel. Localizadores de caminhos na parte inferior indicam que mais itens estão presentes. As setas ajudam na navegação dentro do carrossel. Normalmente, a navegação em carrossel é configurada como um loop contínuo.
Clique Aqui para obter informações mais úteis sobre os componentes da IU
Estados dos componentes da IU
A disponibilidade de componentes é puramente baseada nas diretrizes de requisitos do projeto. Isso vai variar de um projeto para outro.
Os vários estados da IU para um componente básico são:
- Estado não preenchido
- Estado preenchido e em foco
- Estado normal e estado padrão
- Hover State
- Estado desativado
- Estado Mascarado
Estado não preenchido:
Antes de inserir qualquer valor em um componente, ele é considerado um estado não preenchido. O estado Não preenchido exibe o texto do espaço reservado, se houver. A seguir está um componente de campo de texto.
Estado Preenchido:
Um componente com um valor digitado pelo usuário é o estado preenchido.
No estado de foco:
O usuário revisita um componente que já está preenchido. O componente deve exibir o cursor, indicando que o componente específico está sendo focado
Estado normal:
A exibição de um componente com o valor já inserido pelo usuário na tela é descrito no estado normal.
Estado padrão:
Um componente que exibe o valor preenchido automaticamente do servidor / back-end. Este valor também pode ser editado pelo usuário em alguns cenários.
Hover State:
Passe o mouse sobre o componente realça o componente, indicando a ação de passar o mouse.
Antes de pairar:
Ao pairar:
como desenvolver software de inteligência artificial
Estado desativado:
O componente está desabilitado e o usuário não pode editar os campos.
Estado habilitado
Estado desativado
Estado Mascarado:
Dados confidenciais como a senha podem ser ocultados usando este componente.
Os principais requisitos de teste de USABILIDADE do aplicativo da web são:
- Família de fontes
- Tamanho da fonte
- Cor
- Espaçamento entre letras
- Altura da linha
- Validação de fundo
- Preenchimento / opacidade
- Medidas dos componentes, como comprimento, largura e largura
- Localização / espaçamento entre os componentes em uma tela
Os recursos de usabilidade acima podem ser testados no código ou usando o elemento inspect no aplicativo. Outra maneira mais fácil é usar add-ons. Os complementos podem variar de acordo com o navegador no qual o aplicativo deve ser testado.
Detalhes de vários complementos do navegador
| Nome | Detalhes de uso | Compatibilidade |
|---|---|---|
| Page Ruler | Este add-on auxilia no teste de largura e altura dos componentes. As posições superior, esquerda, direita e inferior dos componentes também podem ser descobertas | Chrome e Firefox |
| Inspetor da web | O inspetor da web exibe a fonte, a cor do texto e a cor de fundo do apenas clicando no ícone do inspetor da web e passando o mouse sobre a seção a ser testada | Chrome e Safari |
| Bug de fogo | Firebug é um complemento de código aberto para monitorar CSS, HTML, DOM, XHR e JavaScript da página da web. Esta é uma alternativa ao elemento inspect, compatível com Firefox. | Raposa de fogo |
| ColorZilla | É um complemento de seletor de cores usado para analisar a cor da página da web | Chrome e Firefox |
| Meça isto | É usado para testar a largura, altura e alinhamento dos elementos em pixels. | Chrome, Safari e Firefox |
Vantagens dos Add-Ons:
- Poupa tempo
- Fácil de usar
- É rentável
Limitação de add-ons:
- Erro de paralaxe ao usar medição
- Compatível entre aplicativos
- Compatível com vários navegadores
Referências para add-ons:
- Inspetor da Web: Apple Dev Tools
- Firebug: Wiki Firebug
- Meça isto
- Colorzilla
Ferramentas de teste de GUI
Várias ferramentas estão disponíveis no mundo da tecnologia que podem ajudar os testadores nos testes de IU.
- Selênio
- HP Unified Functional Testing
- Pepino
- IU codificada
- Na realidade
Uma lista detalhada de ferramentas GUI está disponível no próprio softwaretestinghelp.com! Por favor clique Aqui .
Exemplos de casos de teste de GUI
1) Verifique o funcionamento das setas do carrossel e localizadores de caminho
dois) Verifique se o campo de senha está aceitando valores apenas em um estado mascarado
3) Verifique se o botão ‘salvar’ permanece inativo até que todos os campos obrigatórios sejam inseridos
4) Verifique se o usuário tem permissão para navegar até o topo da página usando a barra 'Superior'
5) Verifique se a mensagem adequada é exibida quando os filtros aplicados não recuperam nenhum resultado
6) Verifique a navegação nos links disponíveis nos cabeçalhos e rodapés
7) Verifique se o alinhamento dos botões de opção está correto
8) Verifique se várias opções nas caixas de seleção podem ser selecionadas ao mesmo tempo
9) Verifique se o título de cada seção está em negrito
10) Verifique a mudança de cor dos hiperlinks clicando
Conclusão
Um site é a alma de muitas empresas. É muito necessário garantir que ele tenha uma boa aparência e funcione de maneira semelhante em diferentes navegadores e plataformas. Portanto, o teste de IU é muito importante e garantirá uma grande base de clientes e agregação de valor ao negócio.
Leitura recomendada
- Melhores ferramentas de teste de software 2021 (QA Test Automation Tools)
- Teste Alfa e Teste Beta (um guia completo)
- Download do e-book do Testing Primer
- Teste Funcional Vs Teste Não Funcional
- Guia completo de teste de verificação de compilação (teste BVT)
- O que é teste de interface? Conheça Seus Tipos, Estratégia e Ferramentas
- Guia de terceirização de controle de qualidade: empresas de terceirização de teste de software
- Tipos de teste de software: diferentes tipos de teste com detalhes