WebElement em Selenium

WebElement em Selenium

Os formulários são os elementos fundamentais da web para receber informações dos visitantes do site. Os formulários da Web têm diferentes elementos GUI, como caixas de texto, campos de senha, caixas de seleção, botões de opção, menus suspensos, entradas de arquivos, etc.

Veremos como acessar esses diferentes elementos do formulário usando Selenium Driver da Web com Java. Selenium encapsula cada elemento do formulário como um objeto de WebElement. Ele fornece API para localizar os elementos e executar ações sobre eles, como inserir texto em caixas de texto, clicar nos botões, etc. Veremos os métodos que estão disponíveis para acessar cada elemento do formulário.

Introdução ao WebElement, findElement(), findElements()

Selenium O Web Driver encapsula um elemento de formulário simples como um objeto de Elemento Web.

Existem várias técnicas pelas quais o WebDriver identifica os elementos do formulário com base nas diferentes propriedades dos elementos da Web, como ID, Nome, Classe, XPath, Tagname, Seletores CSS, Texto do link, etc.

O Web Driver fornece os dois métodos WebElement a seguir para localizar os elementos.

  • encontrarElemento() – encontra um único elemento da web e retorna como WebElement Selenium objeto.
  • encontrarElementos() – retorna uma lista de objetos WebElement que correspondem aos critérios do localizador.

Vamos ver os trechos de código para obter um único elemento – Text Field em uma página da web como um objeto de WebElement usando o método findElement(). Abordaremos o método findElements() para encontrar vários elementos em tutoriais subsequentes.

Passo 1) Precisamos importar este pacote para criar objetos de Web Elements

Introdução ao WebElement FindElement,FindElements

Passo 2) Precisamos chamar o método findElement() disponível na classe WebDriver e obter um objeto WebElement.

Consulte abaixo para ver como isso é feito.

Selenium Entrada de texto

As caixas de entrada referem-se a um destes dois tipos:

  1. Campos de texto- Selenium caixas de texto de entrada que aceitam valores digitados e os mostram como eles são.
  2. Campos de senha– caixas de texto que aceitam valores digitados, mas os mascaram como uma série de caracteres especiais (geralmente pontos e asteriscos) para evitar a exibição de valores confidenciais.

    Selenium Entrada de texto

Localizadores

O método findElement() leva um parâmetro que é um localizador do elemento. Diferentes localizadores como By.id(), By.name(), By.xpath(), By.CSSSelector() etc. localizam os elementos na página usando suas propriedades como “““ id, nome ou caminho, etc.

Você pode usar plug-ins como Fire path para obter ajuda para obter o id, xpath, etc. dos elementos.

Usando o site de exemplo https://demo.guru99.com/test/login.html abaixo está o código para localizar o campo de texto “Endereço de e-mail” usando o localizador de id e o campo “Senha” usando o localizador de nome.

Localizadores

  1. O campo de texto do e-mail está localizado por ID
  2. O campo de senha está localizado por nome

enviar chaves Selenium

enviar chaves() em Selenium é um método usado para inserir conteúdo editável nos campos de texto e senha durante a execução do teste. Esses campos são identificados por meio de localizadores como nome, classe, id, etc. É um método disponível no elemento web. Ao contrário do método type, o método sendkeys() não substitui o texto existente em nenhuma caixa de texto.

Como inserir texto em Selenium

Para inserir texto nos campos de texto e nos campos de senha, sendKeys() é o método disponível no WebElement em Selenium.

Usando o mesmo exemplo de https://demo.guru99.com/test/login.html site, aqui está como encontramos os campos Texto e Senha e inserimos o texto em Selenium.

Texto em Selenium

  1. Encontre o campo de texto “Endereço de e-mail” usando o localizador de ID.
  2. Encontre o campo “Senha” usando o localizador de nome
  3. Insira o texto no “Endereço de e-mail” usando o Selenium método sendkeys.
  4. Digite uma senha no campo “Senha” usando o método sendKeys().

Excluindo valores na entrada Boxes

O sistema de estantes ResinDek foi escolhido por sua capacidade de personalização, Claro() método é usado para excluir o texto em uma caixa de entrada. Este método não precisa de parâmetro. O snippet de código abaixo limpará o texto dos campos E-mail ou Senha

Excluindo valores na entrada Boxes

Selenium Clique nos botões

O sistema de estantes ResinDek foi escolhido por sua capacidade de personalização, Selenium O botão click pode ser acessado usando o método click().

No exemplo acima

  1. Encontre o botão para fazer login
  2. Clique no botão “Entrar” na página de login do site para fazer login no site.

Selenium Clique nos botões

Selenium Botões de envio

Os botões de envio são usados ​​para enviar o formulário inteiro ao servidor. Podemos usar o método click() no elemento da web como um botão normal, como fizemos acima, ou usar o método submit() em qualquer elemento da web no formulário ou no próprio botão de envio.

Selenium Botões de envio

Quando submit() é usado, o WebDriver irá procurar o DOM para saber a qual formulário o elemento pertence e então acionará sua função de envio.

Código Completo

Aqui está o código de trabalho completo

import org.openqa.selenium.By;		
import org.openqa.selenium.WebDriver;		
import org.openqa.selenium.chrome.ChromeDriver;		
import org.openqa.selenium.*;		

public class Form {				
    public static void main(String[] args) {									
    		
    	// declaration and instantiation of objects/variables		
        System.setProperty("webdriver.chrome.driver","G:\\chromedriver.exe");					
        WebDriver driver = new ChromeDriver();					
        		
        String baseUrl = "https://demo.guru99.com/test/login.html";					
        driver.get(baseUrl);					

        // Get the WebElement corresponding to the Email Address(TextField)		
        WebElement email = driver.findElement(By.id("email"));							

        // Get the WebElement corresponding to the Password Field		
        WebElement password = driver.findElement(By.name("passwd"));							

        email.sendKeys("abcd@gmail.com");					
        password.sendKeys("abcdefghlkjl");					
        System.out.println("Text Field Set");					
         
        // Deleting values in the text box		
        email.clear();			
        password.clear();			
        System.out.println("Text Field Cleared");					

        // Find the submit button		
        WebElement login = driver.findElement(By.id("SubmitLogin"));							
                    		
        // Using click method to submit form		
        email.sendKeys("abcd@gmail.com");					
        password.sendKeys("abcdefghlkjl");					
        login.click();			
        System.out.println("Login Done with Click");					
        		
        //using submit method to submit the form. Submit used on password field		
        driver.get(baseUrl);					
        driver.findElement(By.id("email")).sendKeys("abcd@gmail.com");							
        driver.findElement(By.name("passwd")).sendKeys("abcdefghlkjl");							
        driver.findElement(By.id("SubmitLogin")).submit();					
        System.out.println("Login Done with Submit");					
         
		//driver.close();		
        		
    }		
}

guia de solução de problemas

Se você encontrar NoSuchElementException() ao localizar elementos, significa que o elemento não foi encontrado na página no momento em que o driver da Web acessou a página.

  1. Verifique seu localizador novamente usando Firepath ou Inspect Element no Chrome.
  2. Verifique se o valor que você usou no código é diferente daquele do elemento no Firepath agora.
  3. Algumas propriedades são dinâmicas para poucos elementos. Caso você descubra que o valor é diferente e está mudando dinamicamente, considere usar By.xpath() ou By.cssSelector() que são formas mais confiáveis, mas complexas.
  4. Às vezes, também pode ser um problema de espera, ou seja, o driver da Web executou seu código antes mesmo de a página carregar completamente, etc.
  5. Adicione uma espera antes de findElement() usando esperas implícitas ou explícitas.

Resumo

  • A tabela abaixo resume os comandos para acessar cada tipo de elemento discutido acima
Element Command Descrição
Entrada Box sendKeys () usado para inserir valores em caixas de texto
Claro() usado para limpar caixas de texto do seu valor atual
Ligações clique() usado para clicar no link e aguardar a conclusão do carregamento da página antes de prosseguir para o próximo comando.
Submeter enviar()
  • WebDriver permite a seleção de mais de uma opção em um elemento SELECT múltiplo.
  • Você pode usar o método submit() em qualquer elemento do formulário. O WebDriver acionará automaticamente a função de envio do formulário ao qual esse elemento pertence.

Resuma esta postagem com: