Tests automatitzats d’aplicacions web amb Selenium WebDriver

Logo Selenium

Inici » Actualitat »

Tests automatitzats d’aplicacions web amb Selenium WebDriver

Una fase important del desenvolupament de software és el testing, mitjançant el qual comprovem que el nostre projecte es comporta tal com esperàvem. Però, i si el nostre projecte és una aplicació web?

Una fase important del desenvolupament de software és el testing, mitjançant el qual comprovem que el nostre projecte es comporta tal com esperàvem. Si algun cop has realitzat aquesta etapa, segurament sabràs que existeixen moltes eines en diferents llenguatges que ofereixen llibreries per realitzar testos automatitzats, com per exemple JUnit, TestNG, Unittest, que estan pensades per l’execució de tests unitaris en Java, en el cas de les dues primeres, i tests unitaris en Python, en el cas de la tercera, sense provar la part d’interface. Però, i si el nostre projecte és una aplicació web? Existeix algun framework que ens proporcioni les funcions necessàries per no haver de realitzar els testos manualment? La resposta és sí! I precisament en aquest article parlarem sobre un d’aquests frameworks: Selenium WebDriver.

Què és Selenium?

Selenium és una eina open-source que serveix per automatitzar testos en un navegador web. Està disponible per diferents llenguatges de programació, tals com Java, Python i JavaScript, entre d’altres i permet realitzar les proves en Chrome, Firefox, Safari, Opera i Internet Explorer. Un altre aspecte a destacar és que es pot integrar amb altres frameworks de testing, com per exemple JUnit o TestNG.

En aquest article veurem un exemple de test d’una aplicació web per demanar comandes feta amb Java juntament amb Maven, l’eina per construcció i gestió de projectes.  L’exemple el podeu trobar a https://www.alexecollins.com/tutorial-integration-testing-selenium-part-1/

Configuració

A l’arxiu pom.xml del nostre projecte hem d’afegir Selenium i JUnit a les dependències:

<dependency>
      <groupid>org.seleniumhq.selenium</groupid>
      <artifactid>selenium-java </artifactid>
      <version>3.6.0</version>
</dependency>
<dependency>
      <groupid>junit</groupid>
      <artifactid>junit</artifactid>
      <version>4.12</version>
      <scope>test</scope>
</dependency>
<!-- Opcional: HTMLUnit Driver, navegador headless, es a dir, sense interficie grafica.
Per si no volem que el test s’executi en un navegador “tradicional” -->
<dependency>
      <groupid>org.seleniumhq.selenium</groupid>
      <artifactid>htmlunit-driver</artifactid>
      <version>2.27</version>
</dependency>

També hem d’afegir el Tomcat amb què s’executarà la nostra aplicació web per fer les proves. Per fer això farem servir un plugin de Maven: Cargo plugin. L’afegim al pom.xml de la següent manera:

<build>
       <finalName>${project.artifactId}</finalName>
       <plugins>
           <plugin>
               <groupId>org.codehaus.cargo</groupId>
               <artifactId>cargo-maven2-plugin</artifactId>
               <version>1.2.0</version>

               <executions>
                   <execution>
                       <id>start</id>
                       <phase>pre-integration-test</phase>
                       <goals>
                           <goal>start</goal>
                       </goals>
                   </execution>
                   <execution>
                       <id>stop</id>
                       <phase>post-integration-test</phase>
                       <goals>
                           <goal>stop</goal>
                       </goals>
                   </execution>
               </executions>
               <configuration>
                   <container>
                       <containerId>${tomcat.version}</containerId>
                       <home>${tomcat.path}</home>
                   </container>
                   <configuration>
                       <type>standalone</type>
                       <home>target/${tomcat.version}</home>
                       <properties>
                           <cargo.servlet.port>8080</cargo.servlet.port>
                           <cargo.tomcat.ajp.port>8010</cargo.tomcat.ajp.port>
                       </properties>
                   </configuration>
               </configuration>
           </plugin>
           <plugin>
               <groupId>org.apache.maven.plugins</groupId>
               <artifactId>maven-failsafe-plugin</artifactId>
               <version>2.12</version>
               <executions>
                   <execution>
                       <id>default</id>
                       <goals>
                           <goal>integration-test</goal>
                           <goal>verify</goal>
                       </goals>
                   </execution>
               </executions>
           </plugin>
       </plugins>
   </build>

El que es produeix quan afegim això és que el Cargo plugin, tot just abans de realitzar el test, executarà el Tomcat que es trobarà a la ruta que li passem com a paràmetre (més endavant veurem com es fa això) amb la versió que també li passarem com a paràmetre i, al finalitzar el test, aturarà el mateix Tomcat.

Ja tenim configurat Selenium i podem començar a programar les proves. Un aspecte important a considerar és que Selenium s’espera trobar tots els testos a la ruta ../src/test/java/[NomDelTest]IT.java . Dit això, procedim a crear un arxiu per exemple IndexPageIT i escrivim el nostre test, que comprovarà que la pàgina d’inici de la nostra aplicació mostra el missatge “Hello World”:

package tutorial;
import org.junit.After;
import org.junit.Before;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.htmlunit.HtmlUnitDriver;
import static org.junit.Assert.assertTrue;
import org.junit.Test;


public abstract class IndexPageIT {
	/* Super-class for all tests */

	private String siteBase;

	private WebDriver drv;
	public void setDrv() {
        		String drvPath = System.getProperty("webdriver.path");
        		String browser = System.getProperty("webdriver");
        		if (browser == null) {
        		drv = new HtmlUnitDriver();
			}
			else {
				if (browser.equals("firefox")) {
					System.setProperty("webdriver.gecko.driver", drvPath);
					drv = new FirefoxDriver();
				}
				else if (browser.equals("chrome")) {
					System.setProperty("webdriver.chrome.driver", drvPath);
					drv = new ChromeDriver();
				}
			}

		}

	public void setSiteBase(){
		siteBase = "http://localhost:8080/selenium_integration_test/";
	}

	@Before
	public void setUp(){
		setDrv();
		setSiteBase();
		drv.manage().deleteAllCookies();
		drv.get(siteBase);
	}

	@After
	public void tearDown() {
		drv.quit();
	}

	@Test
	public void testWeSeeHelloWorld() throws InterruptedException {
		drv.get(siteBase);
		Thread.sleep(4000);  // Let the user actually see something!
		String pageSource = drv.getPageSource();
		assertTrue(pageSource.contains("Hello World"));
	}
}


 

Primer de tot, fixem-nos ara en el mètode setDrv(): obté els paràmetres webdriver i webdriver.path que li passem nosaltres al Maven. El primer serveix per especificar quin navegador volem utilitzar, en aquest exemple podem fer servir Chrome o Firefox i, el segon, és la ruta on es troba el driver del navegador, que Selenium el necessita per poder controlar-lo. Si volguéssim fer servir el Chrome, hauríem de descarregar aquest driver d’aquí: https://sites.google.com/a/chromium.org/chromedriver/downloads i, si volem el Firefox, d’aquí: https://github.com/mozilla/geckodriver/releases. Si no especifiquem cap navegador a l’hora d’executar el test (que més endavant veurem com es fa), Selenium farà servir un navegador headless, que vol dir que és un navegador que no té interfície gràfica. Això és molt útil si per exemple volem executar els tests en un servidor remot.

Pel que fa als mètodes setUp() i tearDown(), com podeu veure estan programats per executar-se abans i després de cada test, respectivament. El primer configura el driver del navegador que volem utilitzar, guarda l’URL base en una variable, borra les cookies i obté la pàgina principal, mentre que ell segon mètode tanca el navegador.

Per últim, tenim el test que, com podeu veure, és molt senzill. El que fa és obtenir l’URL base de la web i el driver del navegador amb el qual volem realitzar el test, que seguidament farà un GET de la pàgina d’inici i n’obtindrà el codi font per tal de comprovar que es mostra el “Hello World”.

 

Execució dels tests

Per executar els tests, en aquest exemple farem servir Apache Tomcat 7 i el navegador Google Chrome. Abans d’això, assegureu-vos que teniu la ruta de l’executable de Maven al PATH i també una variable d’entorn JAVA_HOME amb la ruta del JDK 8. Un cop això, obrim la terminal i executem:

mvn verify -Dtomcat.version=tomcat7x -Dtomcat.path=RUTA_TOMCAT -Dwebdriver=chrome -Dwebdriver.path=RUTA_CHROMEDRIVER

Si volem utilitzar el navegador headless HtmlUnit, només li passem els paràmetres tomcat.version i tomcat.path.

Un aspecte important a tenir en compte és que, perquè els tests s’executin correctament, haurem de tancar el navegador completament.

Resultats

Un cop finalitzat els tests, ens mostrarà el següent missatge:

En cas que algun test falli, podem anar al directori NomDelProjecte/target/failsafe-reports/ i allà trobarem diversos arxius .txt que corresponen als tests que s’han executat i que contenen informació que pot ajudar a trobar l’error.

Com heu vist, Selenium és una eina molt útil i potent per realitzar testos automatitzats en aplicacions web, i el que és millor és que no només està disponible per Java sinó també per altres llenguatges.

 

Documentació i més informació

  • Web de Selenium: http://www.seleniumhq.org/
  • Web de Maven: https://maven.apache.org/
  • Repositori de Github de l’exemple en el qual es basa aquest article: https://github.com/alexec/tutorial-selenium