como usar Firebug para criar Scripts de selênio-Tutorial #4

no tutorial anterior, aprendemos como criar scripts de teste automatizados usando selênio IDE e sua funcionalidade de gravação. Nós também capotamos as características populosas do Selenium IDE. Nós visamos abrigar o leitor com as características e comandos mais vitais de Selenium IDE.

apenas um lembrete-este é o nosso quarto tutorial na série de treinamento de selênio livre.

Agora que você está acostumado e capaz de criar scripts automatizados usando o modo de gravação do selênio IDE, vamos avançar com outra ferramenta que desempenha um papel muito importante em nos ajudar a criar scripts de teste eficazes conhecidos como “Firebug”. Firebug nos ajuda a inspecionar as propriedades dos elementos da web e páginas da web.

assim, este tutorial é composto pela instalação do Firebug e sua usabilidade.

tome nota de que o conteúdo deste tutorial não é apenas aplicável no contexto do IDE de selênio; em vez disso, ele pode ser aplicado a cada ferramenta de selênio suite. Assim, eu preferivelmente estaria usando o termo selênio em vez de selênio IDE.

neste tutorial, permite aprender como usar o Firebug add-on para criar scripts de selênio. No processo, também aprenderemos a instalar Firebug.

Introdução ao Firebug

Firebug é um add-on Mozilla Firefox. Esta ferramenta nos ajuda a identificar ou a ser mais particular inspecionando elementos HTML, CSS e JavaScript em uma página web. Ajuda-nos a identificar os elementos de forma única numa página web. Os elementos podem ser encontrados exclusivamente com base em seus tipos de localizadores que estaríamos discutindo mais tarde neste tutorial.

como instalar o Firebug?

para facilitar a compreensão, nós bifurcaríamos o processo de instalação nos seguintes passos.

Step-1: lançar o navegador Mozilla Firefox e navegar para esta página de transferência do Firebug. A URL leva-nos à secção add-ons do Firefox.

Step-2: Clique no botão” Adicionar ao Firefox ” presente na página web. Consulte a figura seguinte para o mesmo.

Step-3: Assim que clicarmos no botão “Adicionar ao Firefox”, aparecerá uma caixa de alerta de segurança, clique no botão “Permitir” agora.

Step-4: Agora o Firefox transfere a adição no fundo e é apresentada uma barra de progresso.

Step-5: Assim que o processo terminar, a janela de instalação de software aparece. Agora clique no botão” Instalar Agora”.

Step-6: Assim que a instalação terminar, um pop up aparece dizendo que o firebug foi instalado com sucesso. Agora escolha fechar este pop up.Nota: Ao contrário do selênio IDE, não somos obrigados a reiniciar o Firefox para refletir a instalação do firebug, mas ele vem prontamente.

Step-7: agora para lançar o firebug, podemos optar pelas seguintes formas:

• Carregue em F12
• carregue no ícone Firebug presente no canto superior direito extremo da janela do Firefox.
• 
• Clique em barra de menus no Firefox -> Desenvolvedor Web -> firebug -> Abra o Firebug.

Passo-8: Agora o firebug pode ser visto no fundo da janela do Firefox.

Agora que baixamos e instalamos firebug, vamos avançar com os tipos de localizadores que estaríamos criando usando firebug.

criando Script selênio usando Firebug

Ao contrário do selênio IDE, no Firebug, nós criamos scripts de teste automatizados manualmente adicionando vários passos de teste para formar um script de teste lógico e consistente.vamos seguir uma abordagem progressiva e entender o processo passo a passo.

Cenário:

• Abrir “https://accounts.google.com”.
• afirmar o título da aplicação
• Indique um nome de utilizador inválido e uma senha inválida e envie os detalhes para a autenticação.

Passo 1-lançar o Firefox e abrir o IDE do selénio a partir da barra de menu.

Passo 2-indique o endereço da aplicação em ensaio (“https://accounts.google.com”) no interior da caixa de texto URL de Base.

Passo 3 – por padrão, o botão de registro está no estado. Lembre-se de afinar o estado de modo a desactivar o modo de gravação. Observe que se o modo de gravação está em estado, ele pode resultar na gravação de nossas interações com o navegador da web.

Passo 4 – Abra o aplicativo em teste (https://accounts.google.com) no Firefox.

Passo 5-lançar o Firebug no navegador web.

Step 6 – Seleccione o passo de teste vazio no Editor.

Step 7 – Tipo “abrir” no campo de texto do comando presente na área de edição. O comando “Abrir” abre a URL especificada no navegador web.

recomendação: enquanto digita comandos no campo de texto do comando, o usuário pode alavancar a funcionalidade da auto-seleção. Assim, logo que o usuário digite uma sequência de caracteres, as sugestões correspondentes seriam autopovoadas.

o Utilizador também pode carregar na lista disponível no campo de texto do comando para ver todos os comandos fornecidos pelo Selenium IDE.

Step 8-Now, motion towards the Firebug section within the web browser, expand “head” section of the HTML code. Notice the HTML tag <title>. Assim, para afirmar o título da página web, seria necessário o valor do<título tag.

Copie o título da página web que é “Sign in – Google Accounts” no nosso caso.

Passo 9-Seleccione o segundo passo de teste vazio no Editor.

Passo 10-Tipo “assertTitle” no campo de texto do comando presente na área do Editor. O comando” assertTitle ” devolve o título da página actual e compara-o com o título especificado.

Passo 11 – colar o título copiado no Passo 8 para o campo-Alvo da segunda.

o Passo 12 – Agora, selecione a terceira vazio etapa de teste no Painel de Editor

a Etapa 13 – Tipo de comando “type” dentro do comando caixa de texto. O comando “type” introduz um valor no elemento web especificado na interface gráfica.

o Passo 14 – Agora, mude para o navegador da web, leve o cursor do mouse para o “e-Mail” caixa de texto do formulário de login, e pressione o botão direito do mouse.

escolha a opção “inspeccionar o elemento com Firebug”. Observe que o Firebug automaticamente destaca o código HTML correspondente para o elemento web, ou seja, “caixa de texto de E-mail”.

Step 15 – o código HTML na ilustração acima manifesta os atributos de propriedade distintos pertencentes à caixa de texto “Email”. Observe que existem quatro propriedades (ID, tipo, espaço e nome) que identificam unicamente o elemento web na página web. Assim, cabe ao usuário escolher uma ou mais propriedades para identificar o elemento web.

assim, neste caso, escolhemos o ID como localizador. Copiar o valor DO ID e colá-lo no campo Alvo da terceira etapa de teste prefixada com “id=” para indicar selênio IDE para localizar um elemento web com ID como “Email”.

(Clique para ver a imagem ampliada)

criar uma nota, que o Selenium IDE é sensível a maiúsculas e minúsculas, assim, tipo o valor do atributo cuidadosa e rigorosamente a mesma, tal como é apresentado no código HTML.

Passo 16-carregue no botão Procurar para verificar se o localizador seleccionado encontra e localiza o elemento UI designado na página web.

passo 17-Agora, o próximo passo é introduzir os dados de teste na caixa de valores do terceiro passo de teste dentro da área de edição. Indique” InvalidEmailID ” na caixa de texto do valor. O usuário pode alterar os dados de teste como e quando ele é desejado.

Step 18 – seleccione agora o quarto passo de teste vazio no painel de edição

Step 19 – Tipo de comando “type” dentro do campo de texto do comando.

Passo 20 – agora mude para o navegador web, traga o cursor do rato para a caixa de texto “Senha” no formulário de autenticação e carregue com o botão direito.

escolha a opção “inspeccionar o elemento com Firebug”.

Step 21 – The HTML code below manifests the distinct property Attributions belonging to the “Password” text box. Observe que existem quatro propriedades (ID, tipo, espaço e nome) que identificam unicamente o elemento web na página web. Assim, cabe ao usuário escolher uma ou mais propriedades para identificar o elemento web.

assim, neste caso, escolhemos o ID como localizador. Copie o valor DO ID e cole-o no campo-Alvo da terceira etapa de teste prefixada com “id=”.

(Clique para ver a imagem ampliada)

o Passo 22 – Clique no botão Localizar para verificar se o localizador de guias encontra e localiza designado elemento de INTERFACE do usuário na página web.

passo 23-Agora, o próximo passo é introduzir os dados de teste na caixa de valores do quarto passo de teste dentro da área de edição. Indique” InvalidPassword ” na caixa de texto do valor. O usuário pode alterar os dados de teste como e quando ele é desejado.

Passo 24 – Agora, selecione o quinto vazio etapa de teste no Painel de Editor

Passo 25 – Tipo “, clique em” comando dentro do comando caixa de texto. O comando “clique” clica em um elemento web especificado dentro da página web.

passo 26 – agora mude para o navegador web, traga o cursor do rato para o botão “Assinar” dentro do formulário de autenticação e carregue com o botão direito.

escolha a opção “inspeccionar o elemento com Firebug”.

Step 27 – The HTML code below manifests the distinct property Attributions belonging to the “Sign in” button.

escolha o ID como localizador. Copie o valor DO ID e cole-o no campo-Alvo da terceira etapa de teste prefixada com “id=”.

(Clique para ver a imagem ampliada)

o Passo 28 – Clique no botão Localizar para verificar se o localizador pegou encontra e localiza designado elemento de INTERFACE do usuário na página web.

O programa de teste está completo agora. Veja a seguinte ilustração para ver o programa de testes terminado.

Step 29 – reproduzir o script de teste criado e gravá-lo da mesma forma que fizemos no tutorial anterior.

conclusão

neste tutorial, introduzimos ainda outra ferramenta de criação de script ou melhor, uma ferramenta que ajuda a criação de script.

Firebug surpreendentemente tem um grande potencial para localizar elementos da web em uma página da web. Assim, o usuário pode alavancar as capacidades da ferramenta na criação de scripts de teste de automação eficazes e eficientes manualmente.

próximo Tutorial # 5: avançando no próximo tutorial, teríamos uma olhada nos vários tipos de localizadores no selênio e sua técnica de acessibilidade para construir scripts de teste. Enquanto isso, o leitor pode começar a construir seus scripts de teste de automação usando Firebug.