Comenzando a mover el navegador

En este post veremos como ejecutar acciones básicas en un navegador Firefox y algunas funciones de la API de Selenium WebDriver.

Copia de a una por vez cada una de las líneas que se detallan a continuación.
Las líneas que comienzan con # no es necesario copiarlas ya que son comentarios y no tendrán ningún tipo de efecto:

#abrimos el navegador

browser=Selenium::WebDriver.for :firefox

#Nos dirigimos a la página de google

browser.navigate.to "http://www.google.com"

#Buscamos el campo de texto de búsqueda y lo guardamos en una variable llamada text_busqueda

text_busqueda = browser.find_element(:name, "q")

#Le enviamos a nuestro campo de texto de búsqueda un texto a buscar "Test automation y algo mas"

text_busqueda.send_keys("Test automation y algo mas")

Analicemos este código:

Tenemos al principio la creación de una instancia de navegador Firefox que la guardaremos en la variable browser que será con la que trabajaremos a lo largo de los pasos a realizar

browser=Selenium::WebDriver.for :firefox

browser es nuestra instancia, nuestra ventana del navegador y será con la que interactuémos a lo largo del test a ejecutar. browser es en realidad nuestro webdriver que contendrá todos los métodos que provee Selenium para trabajar con el navegador.
Para ver ésto podemos hacer lo siguiente:

browser.methods

Verás que se listan todos los métodos disponibles de Selenium Webdriver.
Entre todos los métodos que se listan se encuentra navigate.to :

browser.navigate.to "http://www.google.com"

simplemente este método lo que hace es indicarle al driver que navegue hasta la dirección indicada entre comillas. Aunque navigate tiene otros métodos disponibles. En lugar de indicarle la dirección a navegar a través de la instrucción to, puede indicarse las siguientes acciones:

browser.navigate.back
browser.navigate.forward
browser.navigate.refresh 

back para volver, forward para ir hacia adelante y refresh para refrescar la página (F5).

La siguiente instrucción es:

text_busqueda = browser.find_element(:name, "q")

Aquí estamos usando el método find_element de Selenium WebDriver.
En nuestro caso podríamos traducir esta instrucción de la siguiente manera:

En nuestra instancia browser buscar el elemento (find_element) cuyo atributo name tiene el valor q y guardarlo en una variable denominada text_busqueda.
Veamos en detalle de que elemento estamos  hablando con una imagen:

Como se puede observar en la imagen el elemento 
<input id="gbqfq" ... type="text" value="" ..... name="q" ......>tiene un atributo name cuyo valor es q.
A través de ese atributo Selenium buscará el elemento y generara un objeto de tipo Element. Para corroborar esto último se puede escribir:

text_busqueda.class

Y debe aparecer algo similar a:

1.9.3p392 :012 > text_busqueda

 => #<Selenium::WebDriver::Element:0x..f9f68d484fc787c04 id="{b7a127f2-28bf-5e4c-8c2f-7b3fcc8fc32b}">

de esta manera tendremos el campo de texto identificado en nuestro programa/script bajo el nombre de text_busqueda y podremos aplicarle todos los métodos que nos provee Selenium Webdriver para éste tipo de elemento.
Para conocer que métodos podemos usar con el elemento podemos escribir:

text_busqueda.methods

Entre los métodos que se listan se encuentra nuestro próximo paso que es el uso del método send_keys que, en nuestro caso, es:

text_busqueda.send_keys("Test automation y algo mas")

basicamente, facil de intuir, lo que hace éste método es enviar los caracteres entre comillas al elemento text_busqueda. En definitiva, escribe el texto en el campo de texto text_busqueda.

Mas info sobre el método find_element:

Este método tiene muchas alternativas para buscar los elementos, me refiero a que tiene varias formas de encontrar elementos según los parámetros que se pasen dentro de los paréntesis.
Anotemos de manera generica el método como para luego ver las distintas variantes que admite:

browser.find_element(:localizador, "valor del localizador")

donde :localizador puede ser:

:id
   Para un elemento de este estilo <input type="text" id="usuario".../>
   find_element(:id, "usuario")
:class_name
   Para un elemento de este estilo <input type="text" class="email".../>
   find_element(:class_name, "email"). 
:tag_name
   Para un elemento de este estilo <iframe src="..."></iframe>
   find_element(:tag_name, "iframe")
:name
   Para un elemento de este estilo <input type="text" name="password".../>
   find_element(:name, "password")
:link_text
   Para un elemento de este estilo <a href="http://www.linkedin.com">LinkedIn</a>
   find_element(:link_text, "LinkedIn")
:partial_link_text
   Para un elemento de este estilo <a href="http://www.blogger.com">Test automation y algo mas</a>
   find_element(:partial_link_text, "automation")

:css

   Para un elemento de este estilo <div id="web"><span class="curso">Ruby</span><span class="curso automation">localizando por css</span></div>

   find_element(:css, "#web span.curso.automation")

:xpath
   Demasiado extenso para explicarlo en dos líneas. El método de ubicación de elementos a través de xpath tiene varias desventajas siendo las mas importantes el exceso de calculo computacional para llevarse a cabo, es decir que es mas lento y la mantenibilidad de los test ante cambios en la página. Como para tener una idea, xpath trabaja en base a las posiciones relativas de los elementos dentro de la página respecto de un punto inicial por lo que si se introduce un elemento nuevo o se elimina uno del documento el elemento a buscar por find_element puede no ser encontrado.
Si deseas conocer mas sobre xpath aquí tienes un tuto para ello. Para mi es complicarse la vida :s

Herramientas de trabajo

Para comenzar a trabajar necesitamos ciertas herramientas, así que vamos a instalar las necesarias para ésta primera etapa:

EDITOR DE TEXTO

Personalmente uso y recomiendo Sublime Text 2 que lo puedes descargar desde aquí seleccionando el instalador que corresponda según tu sistema operativo.
Debo mencionar que uso Linux Ubuntu para evitar malos entendidos ya que algunos comandos o comentarios podrán no tener el comportamiento esperado si estás trabajando en Windows u otro SO diferente. En caso de no funcionar un comando o necesites ayuda podrás usar los comentarios para consultas.

En el caso que optes por utilizar Sublime Text 2 sigue las instrucciones en éste párrafo, de lo contrario puedes saltearlo. Una vez instalado y abierto Sublime Text 2 hacemos clic en "Tools" > "Command Palette..." de la barra de menú superior. Se abrirá un pequeño cuadro con varias opciones. Seleccionamos Package Control : Install Package. Aparecerán muchos paquetes para instalar. Estos paquetes son funcionalidades o plugins para Sublime Text 2 que por lo general sirven para agilizar el trabajo con el editor. En nuestro caso instalaremos el paquete (Package) llamado RubyFormat.
Te recomiendo que le heches un vistazo a los diferentes paquetes, hay unos muy interesantes. Puedes también darle un vistazo a este artículo.

INTERPRETE RUBY

Camino sencillo (solo para Windows y MAC): Descargar e instalar RailsInstaller. Un lujo, deja todo funcionando listo para trabajar. Si optas por éste camino pasá directamente a Comanzando con Selenium

Existen varias versiones de Ruby y puede que necesites tener mas de una instalada en tu equipo. Para manejar varias versiones existen, RVM para Mac o Linux y PIK para Windows

Como dije anteriormente los scripts los haremos en código Ruby por lo que ahora debemos instalar solamente el intérprete.
Se puede descargar desde aquí. Descargar e instalar la última versión. Ejecutar el instalador seleccionando todas las opciones. Una vez finalizada la instalación prueba que Ruby se encuentre funcionando. Para eso abre una consola de comandos (Terminal en Linux o cmd en Windows). Una vez abierta la consola escribe irb y presiona Enter. Debe aparecer el prompt

1.9.3pxxx : 001> 

donde xxx es el release de la versión que has descargado. Prueba escribir la siguiente línea y presiona Enter:

puts "Probando Ruby"

debe aparecer:

Probando Ruby
=> nil

Atención: Si estás en un SO Windows debes instalat el Ruby DevKit. Desde aquí puedes descargarlo y luego debes descomprimirlo en la carpeta en la que está instalado Ruby (Seguramente se encuentra en c:\Ruby_1.9.3pxxx). 
Luego abrir una ventana de comandos con Ruby (Inicio>Ruby 1.9.3>Start Command Promt with Ruby) posicionarse en la carpeta en que se descomprimieron los archivos de DevKit.

Escribir la siguiente línea y luego presiona enter

     ruby dk.rb init

Luego escribe y presiona enter nuevamente:

    ruby dk.rb install


Comanzando con Selenium


Si no sale ningún mensaje de error ya estamos en condiciones de comenzar a instalar las gemas necesarias. Las gemas o gems en inglés son paquetes o librerías que contienen métodos/funciones para ejecutar ciertas tareas. En nuestro caso utilizaremos la gema 'selenium-webdriver' que es la que nos permitirá comunicarnos con el browser y ordenarle las acciones para simular el uso del usuario. Para instalarla vamos a la consola y escribimos directamente:

gem install selenium-webdriver

Aparecerán unas líneas indicando el progreso y al final debe aparecer luego el  siguiente mensaje:

Successfully installed selenium-webdriver

Esta gema permite manejar los principales navegadores del mercado como Firefox, Chrome, IE, Safari.

Una vez instalada, escribir en la consola irb y luego presionar enter. Entraremos en el irb de ruby para ingresar comandos y trabajar.

Dentro de irb escribimos:

require 'selenium-webdriver'

debe aparecer:

=>true

Por último y como para que no queden dudas levantemos una instancia de browser Firefox. Escribiremos para ésto:

Selenium::WebDriver.for :firefox

Debe abrirse una ventana de navegador Firefox en blanco

Hasta aquí ya tenemos todo funcionando, es decir que ya nos encontramos en condiciones de realizar un test automatizado ya que disponemos de Ruby, un editor de texto y la gema de Selenium-webdriver instalada. Mas información en:

http://www.sublimetext.com/
http://www.ruby-lang.org/
http://docs.seleniumhq.org/docs/03_webdriver.jsp