Excelencia Corporativa
MATERIAL DE ESTUDIO
Protractor es un framework de pruebas end to end para aplicaciones desarrolladas con angularjs. Protractor permite realizar pruebas en aplicaciones que se ejecutan en un navegador real, facilitando interactuar con él como un usuario lo haría.
Pagina oficial:
https://angular.github.io/protractor/#/
Instalación
Debe instalar la versión más reciente de Nodejs según el sistema operativo que esté utilizando. Para comprobar el correcto funcionamiento de Nodejs puede ejecutar la siguiente instrucción en la consola de comandos.
Nota: La herramienta protractor funciona con Nodejs a partir de la versión 0.10.0 o superior y es instalada a través del gestor de paquetes NPM.
Pagina oficial:
https://nodejs.org/en/
Una vez instalado Nodejs, puede hacer uso del gestor de paquetes de esta plataforma de programación indicando en la consola la instrucción.
npm install -g protractor
-g es una opción para instalar la librería/herramienta en el SO de forma global.
localhost:4444/wd/hub/static/resource/hub.html
Al terminar satisfactoriamente el proceso de instalación de protractor debe actualizar e inicializar el webdriver-manager ejecutando en la terminal las siguientes instrucciones:
Protractor implementa selenium para interactuar con el contenido de aplicaciones web en diferentes navegadores. Por tal motivo, siempre se debe inicializar el webdriver-manager para ejecutar los respectivos Test.
Este por defecto crea un directorio con los archivos conf.js y spec.js en la siguiente ruta:
C:\Users\Usuario del sitema\AppData\Roaming\npm\node_modules\protractor\example
//Conf
// An example configuration file.
exports.config = {
//directConnect: true,
SeleniumAdress: 'http://localhost:4444/wd/hub/static/resource/hub.html',
// Capabilities to be passed to the webdriver instance.
capabilities: {
'browserName': 'chrome'
},
/*multiCapabilities: [{
'browserName': 'firefox'
}, {
'browserName': 'chrome'
}],*/
// Framework to use. Jasmine 2 is recommended.
framework: 'jasmine2',
// Spec patterns are relative to the current working directly when
// protractor is called.
specs: ['Verificar_Referencia.js'],
// Options to be passed to Jasmine.
jasmineNodeOpts: {
defaultTimeoutInterval: 30000
}
};
//Script de escenarios de pruebas --example_spec
describe('angularjs homepage', function() {
it('should greet the named user', function() {
browser.get('http://www.angularjs.org');
element(by.model('yourName')).sendKeys('Julie');
var greeting = element(by.binding('yourName'));
expect(greeting.getText()).toEqual('Hello Julie!');
});
describe('todo list', function() {
var todoList;
beforeEach(function() {
browser.get('http://www.angularjs.org');
todoList = element.all(by.repeater('todo in todoList.todos'));
});
it('should list todos', function() {
expect(todoList.count()).toEqual(2);
expect(todoList.get(1).getText()).toEqual('build an angular app');
});
it('should add a todo', function() {
var addTodo = element(by.model('todoList.todoText'));
var addButton = element(by.css('[value="add"]'));
addTodo.sendKeys('write a protractor test');
addButton.click();
expect(todoList.count()).toEqual(3);
expect(todoList.get(2).getText()).toEqual('write a protractor test');
});
});
});
Conceptos:
1. *.Js
2. browser.get("http://thetestroom.com/jswebapp");
3. browser.sleep(5000);
4. Formas de capturar los elementos:
// find an element using a css selector
by.css('.myclass')
// find an element with the given id
by.id('myid')
// find an element with a certain ng-model
by.model('name')
// find an element bound to the given variable
by.binding('bindingname')
Link que describe los elementos que se pueden capturar y las funciones que se pueden realizar sobre los mismos:
https://angular.github.io/protractor/#/api
Ejercicio 1:
Ingrese a la página: http://www.thetestroom.com/jswebapp/, escriba cualquier cosa y capture el texto que aparece en la parte inferior para luego mostrarlo por consola.
Ejercicio 2:
Diseñar un test que luego de realizar lo descrito en el ejercicio anterior, haga lo siguiente:
presione el botón continuar abriendose una nueva pagina, en esta seleccione un ítem del combobox y vuelva y presione nuevamente el botón continuar.
Ejercicio 3:
Al test del ejercicio 2 agregarle una validación para comparar que el texto ingresado sea el mismo que se está visualizando en la parte de abajo.
También debe realizar una validación que permita confirmar que la URL contiene la palabra "jswebapp".
Nota: Para realizar la actividad anterior pueden consultar: "expect (browser.getCurrentUrl())"
Ejercicio 4:
Para este ejercicio se propone realizar lo implementado en el ejercicio 2, con la diferencia de organizar de forma adecuada los pasos del escenario.
Nota: Para lo anterior hacer uso de la siguiente instrucción:
it ("nombre del paso o transaccion",function(){});
Ejercicio 5:
En protractor existe el "beforeEach", este nos permite definir instrucciones que se ejecutarán antes de cada función definida en un script, hacer uso de esta para organizar el script diseñado anteriormente.
describe ("Testing the JavaScript zoo site",function() {
beforeEach (function() {
browser.get("http://www.thetestroom.com/jswebapp/index.html");
});
it ("Should test by using css expresion",function(){
//css tag
element(by.css('input')).sendKeys("text test");
//css class
element(by.css('.ng-binding')).getText().then (function(text){
console.log(text);
});
//css ids
element(by.css('#continue_button')).click();
//css chaining
element(by.css('button#continue_button')).click();
//css child nodes
element (by.css('table td a')).getText().then(function(text){
console.log(text);
//css atributes
element(by.css('[id="title"]')).getText().then(function(text){
console.log(text);
});
});
});
});
Diferentes formas para capturar datos con Protractor:
Uso del beforeEach y del afterEach
describe ("Adopt an animal on the zoo test site", function()
{
beforeEach(function(){
browser.get("http://www.thetestroom.com/jswebapp");
});
afterEach(function(){
console.log ("After method executed")
});
it ("should able on correct page",function(){
expect(browser.getCurrentUrl()).toEqual("http://www.thetestroom.com/jswebapp/");
});
describe ("should generate correct page", function(){
var textMessage;
beforeEach(function(){
textMessage = "Subscribe to more videosssssssssssssssssssss";
});
it ("should check correct text", function(){
element(by.model("person.name")).sendKeys(textMessage);
element(by.binding("person.name")).getText().then(function(text){
expect(text).toEqual("Subscribe to more videosssssssssssssssssssss");
});
});
/*it ("should check incorrect text", function(){
element(by.model("person.name")).sendKeys(textMessage);
element(by.binding("person.name")).getText().then(function(text){
expect(text).toNotEqual("Subscribe to more videosssssssssssssssssssss");
});
});*/
});
describe ("should check the correct number of items in drop down",function(){
var lengthOfItems;
beforeEach(function(){
// textMessage = "Subscribe to more videosssssssssssssssssssss"
lengthOfItems = 4;
});
it ("should check number of items", function() {
element(by.buttonText("CONTINUE")).click();
element(by.model("animal")).$("[value='1']").click();
element.all(by.css(".ng-pristine option")).then(function(items) {
expect(items.length).toBe(lengthOfItems);
expect(items[1].getText()).toBe("George the Turtle");
});
element(by.partialButtonText("CONT")).click();
});
});
it ("should check user is on the thank you page",function()
{
element(by.buttonText("CONTINUE")).click();
element(by.buttonText("CONTINUE")).click();
expect (browser.getCurrentUrl()).toContain ("confirm");
});
});
SUMINISTRAR VIDEOS
(SITE DE EXCELENCIA)
Video01_ATDD_Protractor
Video02_InstalacionProtractor
Video03_ExampleJS
Video04_ConceptosyEjercicio1
ATDD en Jenkins
"Jenkins es un galardonado, multi-plataforma, integración continua y la entrega continua de aplicaciones que incrementa su productividad. Utilice Jenkins para construir y probar sus proyectos de software de forma continua por lo que es más fácil para los desarrolladores integrar cambios en el proyecto, y lo que es más fácil para los usuarios obtener una versión fresca. También le permite entregar continuamente e Integrar el software hecho por un grupo de desarrolladores rápidamente en una sola versión de manera rapida, con calidad y con una versión estable para salir a producción
Bienvenidos a este Dojo de Integración Continua:
npm install -g cucumber
npm install -g mocha
npm install -g chai
npm install -g chai-as-promised
//Conf
exports.config = {
framework: 'cucumber',
seleniumAddress: 'http://localhost:4444/wd/hub',
specs: ['lib.feature'],
cucumberOpts: {
require: './stepDefinitions.js',
tags: '@dev',
format: 'pretty'
}
}
//Lib.feature
Feature: Autenticandome en Hermes
Como un usuario de Hermes
yo deberia poder autenticarme
con mi usuario y contraseña del LDAP de TNS
@dev
Scenario: Autenticacion en Hermes
Given Yo deberia ingresar a la url de Hermes "http://190.0.8.134:4040"
Then Debo ingresar usuario "alejandro.sierra" y contraseña "silenthill1" visualizando el menu de selección con la opción "Proyecto"
//StepDefinition
// Use the external Chai As Promised to deal with resolving promises in
// expectations.
var chai = require('chai');
var chaiAsPromised = require('chai-as-promised');
chai.use(chaiAsPromised);
var expect = chai.expect;
// Chai expect().to.exist syntax makes default jshint unhappy.
// jshint expr:true
module.exports = function() {
this.Given(/^Yo deberia ingresar a la url de Hermes(?: the website)? "([^"]*)"$/, function(url, next) {
browser.get(url);
next();
});
this.Then(/^Debo ingresar usuario "([^"]*)" y contraseña "([^"]*)" visualizando el menu de selección con la opción "([^"]*)"$/ , function(user,password,result, next) {
element(by.model('credentials.user')).sendKeys(user);
element(by.model('credentials.password')).sendKeys(password);
element(by.name('button')).click();
var tituloLogin = element(by.id("linkTitle")).getText();
expect(tituloLogin).to.eventually.equal(result).and.notify(next);
});
};
FIN