how locate elements chrome
Este é o tutorial nº 7 em nossa Série de Treinamento Online Selenium. Se você quiser verificar todos os tutoriais do Selenium nesta série, verifique esta página .
No tutorial anterior, tentamos lançar luz sobre vários tipos de localizadores no Selenium e seus mecanismos de localização para construir scripts de teste. O tutorial consistia principalmente em uma breve introdução de diferentes tipos de localizadores, como ID, classes, Xpaths, textos de link , Seletores CSS etc. e sua identificação.
Prosseguindo em nosso próximo tutorial, aproveitaríamos a oportunidade para apresentá-lo com uma extensão das estratégias de localização. Assim, no próximo tutorial, estudaríamos o mecanismo para localizar elementos da web no Google Chrome e no Internet Explorer.
Como todos nós estamos bem cientes do fato de que há um rápido crescimento na base de usuários da Internet, as partes interessadas e os programadores estão criando aplicativos da Web que provavelmente funcionarão na maioria dos navegadores.
Portanto, imagine uma situação em que seu aplicativo da web não seja compatível com o Firefox, mas funcione bem com o Chrome e o Internet Explorer.
Agora, como você vai automatizar tal aplicativo usando Selenium? Ou, para ser específico, como você vai localizar elementos da web no Chrome e no Internet Explorer. Portanto, a resposta está à frente neste tutorial.
inicialização de variável estática c ++
O que você aprenderá:
Localização de elementos da web no Google Chrome
Vamos começar entendendo as estratégias de localização no Google Chrome.
Como o Firebug no Firefox, o Google Chrome tem seu própria ferramenta de desenvolvedor que podem ser usados para identificar e localizar elementos da web na página da web. Ao contrário do firebug, o usuário não precisa baixar ou instalar nenhum plugin separado; a ferramenta de desenvolvedor já vem com o Google Chrome.
Siga as etapas abaixo para localizar elementos da web usando a ferramenta de desenvolvedor do Chrome:
Passo 1: A etapa principal é lançar a ferramenta de desenvolvedor do Google Chrome. Pressione F12 para iniciar a ferramenta. O usuário seria capaz de ver algo como a tela abaixo.
Observe que a guia “Elemento” está destacada na imagem acima. Assim, a guia de elemento é aquela que exibe todas as propriedades HTML pertencentes à página da web atual. Navegue até a guia “Elemento” se ela não for aberta por padrão no lançamento.
Você também pode iniciar a ferramenta de desenvolvedor clicando com o botão direito em qualquer lugar da página da web e selecionando 'Inspecionar elemento', que é muito semelhante ao da inspeção do firebug.
Passo 2: A próxima etapa é localizar o objeto desejado na página da web. Uma maneira de fazer o mesmo é clicar com o botão direito no elemento da web desejado e inspecionar. A propriedade HTML pertencente a esse elemento da web seria destacada na ferramenta do desenvolvedor. Outra maneira é passar o mouse pelas propriedades HTML e o elemento da web correspondente será destacado. Assim, desta forma o usuário pode localizar ids, classes, links etc.
Criando um Xpath na ferramenta de desenvolvedor
Já discutimos Xpaths no último tutorial. Também discutimos sua estratégia de criação. Aqui, basearíamos nossa discussão para verificar a validade do XPath criado na ferramenta de desenvolvedor do Chrome.
Passo 1: Para criar XPath na ferramenta Developer, abra a guia do console.
Passo 2: Digite o Xpath criado e coloque-o em $ x (“// input [@ id =’ Email ’]”)
Etapa 3: Pressione a tecla Enter para ver todos os elementos HTML correspondentes ao Xpath especificado. Em nosso caso, há apenas um elemento HTML correspondente. Passe o mouse sobre esse elemento HTML e o elemento da web correspondente será destacado na página da web.
Desta forma, todos os Xpaths podem ser criados e verificados quanto à sua validade no console.
As informações relacionadas ao CSS correspondente ao elemento da web podem ser encontradas na ferramenta de desenvolvedor do Chrome. Consulte a imagem abaixo:
Localizando Elementos da Web no Internet Explorer
Como o Google Chrome, O Internet Explorer também tem sua própria ferramenta de desenvolvedor que podem ser usados para identificar elementos da web com base em suas propriedades na página da web. O usuário não precisa baixar ou instalar nenhum plug-in separado, a ferramenta de desenvolvedor já vem com o Internet Explorer.
Siga as etapas abaixo para localizar elementos da web usando a ferramenta de desenvolvedor do IE:
Passo 1: A etapa principal é lançar a ferramenta IE Developer. Pressione F12 para iniciar a ferramenta. O usuário seria capaz de ver algo como a tela abaixo.
Observe que a guia “HTML” está destacada na imagem acima. Assim, a guia HTML é aquela que exibe todas as propriedades HTML pertencentes à página da web atual. Expanda a guia HTML para visualizar as propriedades de todos os elementos da web pertencentes à página da web atual.
Passo 2: A próxima etapa é localizar o objeto desejado na página da web. Uma maneira de fazer isso é selecionar o elemento HTML e o elemento da web correspondente será destacado. Assim, desta forma o usuário pode localizar ids, classes, links, etc. Confira na imagem abaixo em que a Caixa de texto do email estaria destacada assim que selecionássemos a propriedade HTML correspondente.
Outra forma de localizar o elemento da web é clicar no botão “Localizar” presente no menu superior e clicar no elemento da web desejado dentro da página da web. Como resultado, as propriedades HTML correspondentes seriam destacadas.
Assim, usando a ferramenta de desenvolvedor, um usuário pode encontrar ids, classes, nomes de tags e pode criar Xpaths para localizar elementos da web.
Como a ferramenta de desenvolvedor do Chrome, a ferramenta de desenvolvedor do IE tem uma seção separada que exibe informações relacionadas ao CSS. Confira a imagem abaixo.
Conclusão
Neste tutorial, lançamos luz sobre as estratégias básicas de localização de elementos usando a ferramenta do desenvolvedor para Google Chrome e Internet Explorer.
Próximo Tutorial # 8 : Prosseguindo em nosso próximo tutorial, teríamos o prazer de apresentar a você uma ferramenta mais avançada chamada WebDriver. WebDriver é uma das ferramentas de teste de automação mais atraentes. Assim, em nosso próximo tutorial, direcionaríamos e basearíamos nossas discussões em torno do WebDriver e todos os seus aspectos essenciais.
Leitura recomendada
- Verifique a visibilidade dos elementos da Web usando vários tipos Comandos do WebDriver - Selenium Tutorial nº 14
- Introdução ao Selenium WebDriver - Selenium Tutorial # 8
- Como usar o seletor CSS para identificar elementos da Web para scripts do Selenium - Tutorial do Selenium nº 6
- Scripts Eficientes do Selenium e Cenários de Solução de Problemas - Tutorial # 27 do Selenium
- Depurando Scripts Selenium com Logs (Tutorial Log4j) - Tutorial Selenium # 26
- 30+ Melhores Tutoriais de Selênio: Aprenda Selênio com Exemplos Reais
- Tutorial Cucumber Selenium: Cucumber Java Selenium WebDriver Integration
- Uso de Selenium Select Class para lidar com elementos suspensos em uma página da Web - Selenium Tutorial # 13