Testes com Selenium WebDriver

O Selenium WebDriver é a união de duas ferramentas e visa facilitar a criação de testes automatizados para interfaces de aplicações web. A intenção das novas versões do Selenium (a partir da 2.0) é focar no desenvolvedor para que ele gere também os códigos dos testes. Neste post vamos explicar em alguns passos como começar a fazer seus próprios testes.

No nosso exemplo vamos utilizar como linguagem de programação o Java e como ambiente de desenvolvimento o Eclipse. Para executar os testes utilizaremos o JUnit.

O primeiro passo é adicionar os JARs para que consigamos utilizar o WebDriver. Para fazer o download da última versão vá até http://code.google.com/p/selenium/downloads/list. Descompacte o arquivo e adicione os JARs ao seu projeto no Eclipse clicando com o botão direito do mouse em cima da raiz do seu projeto e depois em "Properties".

No menu esquerdo clique em "Java Build Path", selecione a aba "Libraries" e clique em "Add External JARs...". Navegue até a pasta onde estão os arquivos que você fez download, selecione todos e clique em "Abrir". Depois clique em "OK". Pronto, você já pode começar a gerar seus códigos de testes!

A partir de agora começaremos o nosso teste. Neste exemplo vamos mostrar passo a passo como criamos um teste para verificar a interface de autenticação do nosso sistema.

public class LoginTest {
 
 @Test
 public void loginTest() {
  WebDriver driver = new FirefoxDriver();
  driver.get("localhost:8080/elsa/login");
 }

}

Inicialmente nosso teste não verifica nada, apesar de ficar com a barra verde ele apenas abre uma janela do Firefox com o endereço do nosso servidor de testes. Roubamos... mas precisamos partir de algum lugar!

Após verificar que a janela do navegador abriu corretamente a tela de autenticação do sistema vamos tentar realizar a autenticação.

public class LoginTest {
 
 @Test
 public void loginTest() {
  WebDriver driver = new FirefoxDriver();
  
  driver.get("localhost:8080/elsa/login");
  
  driver.findElement(By.id("username")).sendKeys("usuario");
  driver.findElement(By.id("password")).sendKeys("senha");
  driver.findElement(By.id("loginButton")).click();
 }

}

Com o WebDriver buscamos pelos elementos exibidos na tela através dos seus identificadores e inserimos os valores desejados para usuário e senha. Além de buscar pelos elementos da página por seus id’s também é possível buscar pelo nome da tag, do name, do link e até mesmo do estilo CSS aplicado ao elemento.

A partir daqui nos damos conta que em qualquer teste do nosso sistema teremos que passar pela tela de login, então podemos utilizar o padrão chamado de Page Objects. Para tanto, criamos uma classe chamada LoginPage que inicialmente terá um método que fará login no sistema.

public class LoginPage {
 
 public void login(WebDriver driver){
  driver.findElement(By.id("username")).sendKeys("usuario");
  driver.findElement(By.id("password")).sendKeys("senha");
  driver.findElement(By.id("loginButton")).click();
 }
}

E agora sim podemos realizar nosso teste, na classe LoginTest.

public class LoginTest {
 
 public LoginPage loginPage;
 public WebDriver driver;
 
 @Before
 public void setup() {
  loginPage = new LoginPage();
  
  driver = new FirefoxDriver();
  driver.get("localhost:8080/elsa/login");
 }
 
 @Test
 public void loginTest() {
  loginPage.login(driver);
  
  String welcomeMessage = driver.findElement(
    By.xpath("/html/body/div/div[4]/div/ul/li/span")).getText();

  assertEquals("Bem vindo ao Prontuário Eletrônico Online do ELSA.",
    welcomeMessage);
 }

}

Aqui já passamos a instanciar LoginPage e o WebDriver no método setup que está anotado com @Before e, desta forma, é executado sempre antes de cada método anotado com @Test. Além disso, buscamos o valor da mensagem de boas vindas através do método findElement e utilizamos como parâmetro a busca de um elemento presente na página pelo xpath correspondente. Finalmente, fizemos uma asserção para garantir que a mensagem que aparece é a esperada.

Agora que nosso teste está pronto executamos esperando a barra verde que instantaneamente fica vermelha, informando que o nosso teste falhou. Aqui vale uma breve explicação. Como estamos trabalhando com ambiente web, devemos saber que nem sempre a resposta é imediata para as requisições feitas para os servidores onde estão as aplicações. Então o melhor a ser feito para contornarmos o problema é implementarmos uma condição esperada de parada com um timeout, desta maneira o teste pode ser executado com mais confiabilidade.

Para tanto, será necessários fazer algumas mudanças no método loginTest.

@Test
public void loginTest() {
 loginPage.login(driver);
  
 ExpectedCondition<Boolean> expectedCondition = new ExpectedCondition<Boolean>() {
  public Boolean apply(WebDriver webDriver) {
   webDriver.findElement(By.xpath("/html/body/div/div[4]/div/ul/li/span"));
   return true;
  }
 };

 Wait<WebDriver> wait = new WebDriverWait(driver, 15);
 wait.until(expectedCondition);
  
 String welcomeMessage = driver.findElement(
    By.xpath("/html/body/div/div[4]/div/ul/li/span")).getText();

 assertEquals("Bem vindo ao Prontuário Eletrônico Online do ELSA.",
    welcomeMessage);
}

Agora sim, nosso teste é executado e temos a barra verde!

Basicamente implementamos a condição de parada esperada que, neste caso, é o surgimento da própria mensagem de boas vindas do sistema. Depois, instanciamos o wait com o nosso driver e um timeout de 15 segundos e esperamos que a condição seja satisfeita por no máximo 15 segundos, caso contrário o teste falhará.

Claro que o exemplo depende das credenciais utilizadas para realizar o login e apenas ele não garante que a tela de login do nosso sistema está funcionando. Como teste complementar podemos acessar o sistema com uma senha errada e fazer uma asserção em cima da mensagem de falha de login.