Curso Play
Introducción
Básico
Intermedio

Test con selenium

Selenium es una librería que te permite probar las interfaces de usuario. Permite automatizar las acciones que puede realiza un usuario en la aplicación, de forma que se puede comprar si la interfaz de usuario se comporta correctamente.

Utilizando Selenium IDE

Selenium IDE es una extensión de Firefox que te permite escribir test de Selenium y ejecutarlos directamente desde el navegador. Descarga Selenium IDE http://seleniumhq.org/projects/ide/ y prueba a crear un test en un página.

Utilizando los tags de Play

Play trae integración por defecto con selenium por medio del tag #{selenium /}

1
2
3
#{selenium ‘Test security’}
    …Comandos Selenium…
#{/selenium}

Ejercicio

Vamos a crear una página donde pondremos unas pestaña (tabs). La implementación de las pestañas la haremos nosotros a mano utilizando knockout.js por lo tanto es recomendable que creemos unos test para comprobar que nuestra implementación funciona correctamente.

Solución

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
#{extends ‘main.html’ /} #{set title:‘Tabs’ /}



Vista de la página con tabs



<ul class=“tabs”>
    <li data-bind=“click : function(){viewModel.selectedTab(1)}, css : { active : viewModel.selectedTab() === 1}”>
        <a href=“#”>Tab1</a>
    </li>
    <li data-bind=“click : function(){viewModel.selectedTab(2)}, css : { active : viewModel.selectedTab() === 2}”>
        <a href=“#”>Tab2</a>
    </li>
    <li data-bind=“click : function(){viewModel.selectedTab(3)}, css : { active : viewModel.selectedTab() === 3}”>
        <a href=“#”>Tab3</a>
    </li>
</ul>



<div data-bind=“visible : viewModel.selectedTab() === 1”>
    Contenido de Tab1
</div>



<div data-bind=“visible : viewModel.selectedTab() === 2”>
    Contenido de Tab2
</div>



<div data-bind=“visible : viewModel.selectedTab() === 3”>
    Contenido de Tab3
</div>



<script>
    var viewModel = {
        selectedTab : ko.observable()
    }



<span class="nx">ko</span><span class="p">.</span><span class="nx">applyBindings</span><span class="p">(</span><span class="nx">viewModel</span><span class="p">);</span>   




</script>

Test de selenium

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
#{selenium ‘Testings Tabs!’}



open('/Tabs/tabs')
click('link=Tab1')
assertTextPresent('Contenido de Tab1')
assertTextNotPresent('Contenido de Tab2')
assertTextNotPresent('Contenido de Tab3')

click('link=Tab2')
assertTextPresent('Contenido de Tab2')
assertTextNotPresent('Contenido de Tab1')
assertTextNotPresent('Contenido de Tab3')

click('link=Tab3')
assertTextPresent('Contenido de Tab3')
assertTextNotPresent('Contenido de Tab1')
assertTextNotPresent('Contenido de Tab2')




{/selenium}