Testare Automata. Analiza Comparativa Selenium Webdriver Protractor

Tabela de figuri

Figura 1.1 Compilarea programelor in C# [Sursa 2] 8

Figura 1.2 Caracteristicile IDE-ul Visual Studio [Sursa 4] 9

Figura 2.3 Arhitectura Protractor [Sursa 6] 12

Figura 2.4 Arhitectura Node.js [Sursa 7] 15

Figura 2.5 Reprezentrea arhitecturii MVC 17

Figura 2.6 Prezentarea vizuală a caracteristicilor din Bootstrap [Sursa 10] 18

Figura 3.1 Pagina de prezentare a competiției. 20

Figura 3.2 Meniul aplicației WampServer 21

Figura 3.3 Panoul de comandă phpAdmin 22

Figura 3.4 Pagina oficială Gamefeed.ro 23

Figura 3.5 Structura proiectului de testare 24

Figura 3.6 Structura proiectului WordPressSeleniumTests 24

Figura 3.7 Structura proiectului WordPressPageObjects 25

Figura 3.8 Diagrama de clasă pentru Proiectul de testare 26

Figura 3.9 Fereastra de Test Explorer din Visual Studio 36

Figura 3.10 Meniul de execuție a testelor 36

Figura 3.11 Structura proiectului realizat cu protractor 39

Figura 3.12 Lansarea comenzi de runTests 47

Figura 3.13 Finalul executiei testelor 47

Figura 3.14 Mesajul de eroare 48

Figura 3.15 Mesajul de aserție falsă 48

Lista secvențelor de cod

Secvență de cod 2-1 Execuția unui script in Java [5] 11

Secvență de cod 2-2 Exemplul de test [Sursa 6] 13

Secvență de cod 2-3 Exemplu de fișier conf.js [Sursa 6] 13

Secvență de cod 2-4 Exemplu de utilizare a control flow-ului [Sursa 6] 14

Secvență de cod 3-1 Exemplu de metodă de test din proiect 25

Secvență de cod 3-2 Clasa Driver 27

Secvență de cod 3-3 Codul sursă pentru clasa LoginPage 29

Secvență de cod 3-4 Codul sursă pentru clasa MediaPage 32

Secvență de cod 3-5 Codul sursă pentru clasa BaseTest 34

Secvență de cod 3-6 Codul sursă pentru clasa de test MediaTests 35

Secvență de cod 3-7 Codul sursă pentru fișierul de configurare 43

Secvență de cod 3-8 Codul sursă pentru testele media 44

Secvență de cod 3-9 Codul sursă pentru funcționalitatea paginii Media 44

Secvență de cod 3-10 Codul sursă pentru definirea elementelor pagini Media 45

Capitolul I

1. Introducere

1.1 Contextul problemei

În prezent piața software este în continuă dezvoltare. Produsele software apar de la o zi la alta, iar competiția crește o dată cu acestea. Pentru ca un produs software să fie de succes, acesta trebuie să prezinte încredere utilizatorilor. Încrederea aduce cu sine noi clienți, o bună reputație și continuitate.

Un alt atribut important pe care o aplicație sau un produs software trebuie să îl scoată în evidență este calitatea. Nivelul de calitate software afectează încrederea.

Problema cu care multe companii de dezvoltare software se confruntă este păstrarea nivelului de calitate a sistemelor software dezvoltate. Rezolvarea problemei, cât atenuarea acesteia se face prin mentenanța și testarea produsului.

Testarea reprezintă procesul prin care un produs software este analizat din punctul de vedere al cerințelor (impuse de client) pentru a determina diferențele dintre acestea și caracteristicile produsului. Testarea se poate realiza manual sau automat.

Testarea manuală este un proces a cărui scop îl reprezintă căutarea defectelor. În acest context, testerul joacă rolul important al utilizatorului care verifică dacă toate trăsăturile și comportamentul aplicației sunt aceleași cu cele pe care clientul le-a stabilit.

Testarea automată este procesul în care uneltele software execută teste, scrise sub forma unor script-uri (programe sau o secvență de instrucțiuni care sunt interpretate de un alt program), asupra unei aplicații înainte ca aceastsa să fie lansată în producție.

Scopul acestei lucrări este testarea automată a aplicațiilor web prezentând unelte open source pe care un tehnician tester le poate folosi pentru a automatiza tot procesul de utilizare a aplicației și diferențele dintre acestea.

Obiectivele lucrării sunt:

Dezvoltarea unui proiect de testare automată bazat pe Selenium WebDriver în limbajul de programare C#.

Dezvoltarea unui proiect de testare automată baza pe Protractor în limbajul de programare Jabascript.

Modul de rularea testelor pentru fiecare proiect.

Analiza comparativă a celor două proiecte.

Dezvoltarea unei aplicații web destinată testorilor care permite rularea testelor și analiza grafică a rezultatelor date de acestea.

1.2 Structura lucrării

Capitoulul I: „Introducerea” – conține prezentarea problemei, a soluției abordate și a obiectivelor lucrării.

Capitolul II: „Unelte de testarea automată” – conține uneltele utilizate pentru dezvoltarea aplicațiilor de testare, descrierea limbajelor de dezvoltare și descrierea aplicației care este testată.

Capitolul III: „Proiectare și implementare” – acest capitol conține prezentarea proiectelor de testare și a aplicației web care utilizează testele, descrierea implementării soluției pentru dezvoltarea testelor și descrierea aplicației web de testare.

Capitolul IV: „Rezultate” – descrie procesul de rulare a testelor și procesul de interpretare a datelor.

Capitolul V: „Concluzii” – în acest capitol sunt prezentate concluziile finale și observațiile care au rezultat în umra analizei proiectelor de testare automată.

Capitolul II

2.1 Limbaje de dezvoltare

2.1.1 C# [Sursa 1]

C# este considerat un limbaj orientat pe obiecte elegant care permite dezvoltatorilor să creeze o varietate de aplicații care rulează pe framework-ul .NET. Limbajul poate fi folosit pentru a creea aplicații client pentru Windows, servicii Web, aplicații de tipul client-server, aplicații pentru baze de date, lista continuând cu incă o multitudine de tipuri de aplicații ce pot fi dezvoltate folosind acest limbaj. Aceasta doar scoate în evidență caracteristicile limbajului, și anume: eleganță, simplitate, limbaj modern folosit cu scop-de dezovoltare-general orientat pe obiecte.

C# oferă suport pentru principiile de dezvoltare software ca și verificarea de tip puternic, verificarea limitelor mulțimilor, detectarea tentativelor de utilizare a variabilelor neinițializate și colectarea automată a resturilor(memoriei).

Trăgându-se din familia limbajelor de programare C și C++, limbajul C# oferă programatorilor un mediu familiar de dezvoltare favorizănd portabilitatea intre limbaje.

Deoarece limbajul rulează pe framework-ul .NET, dispune de un set de clase de librărie care sunt integrate cu o componenta Windows care include execuția virtuală numită limbaj comun de execuție (CLR common language runtime) care permite compilarea programelor C# printr-un limbaj intermediar IL(language infrastructure).

Când un program scris in C# este executa assembly-ul este incărcat în CLR pentru a converti codul IL în instrucțiuni de limbaj mașină. Relațiile dintre execuția și compilarea programelor C# cu framework-ul .NET sunt ilustrate în Figura 2.1.

Figura 1.1 Compilarea programelor in C# [Sursa 2]

2.1.2 JavaScript [Sursa 3]

JavaScript face parte din standardul ECMAScript adoptat pentru uniunea cu WWW (World Wide Web), unde a fost adoptat ca limbaj de programare suportat de toate browser-ele web. Deși numele limbajului derivă din Java, acete două limbaje de programare sunt relativ diferite, având puține concepte de bază în comun. Numele a fost adoptat astfel ca și o inteligentă strategie de marketing realizată de cei de la Netscape Communications deoarece când limbajul a fost inițial lansat, Java devenise foarte popular.

JavaScript este un limbaj scriptual ușor de folosit, destinat dezvoltării de aplicații online care leagă obiectele și sursele atat pe partea de client, cât și pe partea de server. Acest limbaj este folosit de către dezvoltatori pentru dezvoltarea paginilor sau aplicațiilor HTML pentru a genera script-uri dinamice cu comportament orientat pe obiecte care pot fi executate atât pe client cât și pe server. Este un limbaj proiectat in special pentru Internet si pentru open și cross-platform.

2.2 Mediul de dezvoltare

2.2.1 Visul Studio [Sursa 4]

Visual Studio este cel mai productiv IDE (Integrated Development Environment) din industria software. IDE-ul conține o suită de unelte care ajută la dezvoltarea aplicațiilor atât desktop cât web. Acesta conține o multitudine de soluții pentru creearea aplicațiilor performante și complexe bazate pe dezvoltarea în echipă cu suport pentru creearea de aplicații Windows, Android, iOS, cloud și web cât și cele cross-platform. În Figura 2.2 sunt prezentate caracteristicile IDE-ul sub formă vizuală.

Figura 1.2 Caracteristicile IDE-ul Visual Studio [Sursa 4]

Visual Studio oferă soluții pentru version control, planificarea agile, livrare continuă și analiza codului sursă. Totodată acesta conține și un editor de text complex ce suportă dezvoltarea codului sursă în limbaje de programare precum: C#, C++, JavaScript, Python, TypeScript, Vsiual Basic, F# și multe altele, care pot fi integrate ca extensii de program sub forma unor plug-in –uri.

În Visual Studio pot fii create și proiecte de teste pentru testarea aplicațiilor web cât și cele web, dispunând de unelte care pot ajuta programatorii în analiza și organizarea codului cât și gradul de acoperire al codului.

Visual Studio 2015 este un IDE complex realizat cu scopul de a dezvolta produse software complexe și un bun mediu în care programatorii pot dezvolta cu ușurință aplicații. De aceea este folosit în realizarea proiectelor de testare atât și a aplicației de testare care vor fi prezentate în decursul lucrării.

2.3 Unelte Folosite

2.3.1 Selenium WebDriver [Sursa 5]

Selenium este o aplicație destinată testării aplicațiilor web. Selenium automatizează browser-ele web simulând acțiunile unui utilizator normal. Acesta dispune de o multitudine de unelte, API-uri sau framework-uri care permite testorilor sa automatizeze complet și fără limite acțiunile mai multor tipuri de browsere.

Principalele browser-e pentru care Selenium oferă suport sunt:

Chrome

Mozilla

Internet Explorer

Safari

Opera

La acestea se mai pot adăuga o mulțime de alte browser-e folosind produsele oferite de sponsori: Sauce Labs, BrowsersStack, SmartBear și mulți alții.

Selenium WebDriver este o interfață pe care Selenium o oferă pentru controlul total al unui browser. Acesta este folosit pentru crearea de framework-uri specializate de testare a aplicațiilor web pentru automatizarea suitelor de teste din regresie, oferind scalarea și distrbuirea scripturilor de testare pe mai multe medii.

Selenium WebDriver este compatibil cu următoarele limbaje de programare:

Java

C#

Ruby

Python

Javascript

Interfața de WebDriver a fost creeată cu scopul de a scăpa de limitările de care API-ul de Selenium RC dispunea. Acesta suportă pagini web dinamice în care elementele paginii se schimbă fără ca pagina să fie reîncărcată. Driver-ul face apeluri direct către browser prin suportul nativ ce îl oferă acel browser.

Folosind WebDriver-ul, testele pot fi rulate pe diferite mașini virtuale in funcție de mediul in care se dorește ca aplicația web să fie testată.

Clasele suport pe care Selenium WebDriver le dispune, oferă dinamicitate în executarea testelor. Astfel se pot scrie teste pentru elemente unor pagini web care sunt încărcate dinamic sau care impun terminarea unui task asincron pentru a putea fi accesat. Acestea pot fi cu ușurință scrise folosing interfața IWebDriverWait, care oferă astfel de metode publice pentru utilizarea elementelor dinamice de pe pagină.

Metodele de căutare a elementelor de pe pagină sunt date de clasa By, acestea fiind:

Id: id-ul unic al elementului;

ClassName: clasa din care face parte elementul;

TagName: tag-ul care definește elementul;

Name: atributul de nume al elementului;

LinkText: text-ul visibil pentru elementul respectiv;

PartialLinkText: text-ul visibil parțial pentru elementul respectiv;

CssSelector: slectorul de tip CSS care definește elementul.

Datorită API-ului complex dar, totodată ușor de folosit, se pot instanția Drivere pentru borwsere cu caracteristici diferite, putând fi adăugate la creearea intanțelor prin Obiectul de DesiredCapabilities.

Selenium WebDriver are capabilitatea de a executa cod de JavaScript transmis sub formă de string ca și parametru al unei metode. Secvența de execuție al unui astfel de cod este foarte simplă după cum puteți vedea și în exemplul următor:

Secvență de cod 2-1 Execuția unui script in Java [5]

2.3.2 Protractor [Sursa 6]

Protractor este un framework de testare automată end-to-end pentru aplicațiile AngulaJS. Este un program Node.js construit peste WebDriverJS, o interfață a Selenium WebDriver realizată cu scopul de dezvolta teste în JavaScript.

Testele scrise cu Protractor ruleaza aplicația web într-un borwser real, simulând acțiunile unui utilizator normal. Acestea sunt compilate de Node.js, care folosind WebDriverJs trimite comenzile către serverul de Selenium ce rulează local, care acesta la rândul lui trimite comenzile WebDriver-ului care utilizează browser-ul pentru a le executa. Aceast proces este ilustrat în urmatoarea figură:

Figura 2.3 Arhitectura Protractor [Sursa 6]

Testele dezvoltate cu Protractor sunt scrise în fișierele de tipul .spec.js. Un astfel de fișier conține descrierea testului și pașii pe care trebuie să îi execute sub formă de funcții. Un exemplu de astfel de fișier este prezentat în secvența de cod 2-2.

describe('angularjs homepage', function() {

it('should greet the named user', function() {

// Load the AngularJS homepage.

browser.get('http://www.angularjs.org');

// Find the element with ng-model matching 'yourName' – this will

// find the <input type="text" ng-model="yourName"/> element – and then

// type 'Julie' into it.

element(by.model('yourName')).sendKeys('Julie');

// Find the element with binding matching 'yourName' – this will

// find the <h1>Hello {{yourName}}!</h1> element.

var greeting = element(by.binding('yourName'));

// Assert that the text element has the expected value.

// Protractor patches 'expect' to understand promises.

expect(greeting.getText()).toEqual('Hello Julie!');

});

});

Secvență de cod 2-2 Exemplul de test [Sursa 6]

Pentru a rula teste dezvoltatorul se folosește de fișiere de configurare care fac setările Server-ului de Selenium. Un astfel de fișier poate conține unele setări globale care sunt folosite de framework-ul de testare. Exemplul de fișier de configurare este dat în următoare secvență de cod.

// An example configuration file

exports.config = {

// The address of a running selenium server.

seleniumAddress: 'http://localhost:4444/wd/hub',

// Capabilities to be passed to the webdriver instance.

capabilities: {

'browserName': 'chrome'

},

// Spec patterns are relative to the configuration file location passed

// to protractor (in this example conf.js).

// They may include glob patterns.

specs: ['example-spec.js'],

// Options to be passed to Jasmine-node.

jasmineNodeOpts: {

showColors: true, // Use colors in the command line report.

}

};

Secvență de cod 2-3 Exemplu de fișier conf.js [Sursa 6]

O caracteristică importantă a framework-ului Protractor este cotrol flow-ul pentru WebDriver deoarece API-ul de WedDriverJS se bazează pe promises.

Un promise este un obect care reprezintă o valoare sau calculul unei valori. Orice promise începe într-o stare de așteptare care poate fi rezolvată cu succes printr-o valoare sau poate fi respinsă printr-o eroare. Dacă un promise este tranziționat dintr-o stare de așteptare, nu mai își poate schimba starea.

API-urile de WebDriverJS sunt complet asincrone, însemnând că orice funcție apelată de API returnează un promise. Astfel driverul conține o coadă de promes-uri numite si control flow, pentru a menține execuția instrucțiunilor organizată. Un astfel de exemplu este prezentat în următoarea secvență de cod:

it('should find an element by text input model', function() {

browser.get('app/index.html#/form');

var username = element(by.model('username'));

username.clear();

username.sendKeys('Jane Doe');

var name = element(by.binding('username'));

expect(name.getText()).toEqual('Jane Doe');

// Point A

});

Secvență de cod 2-4 Exemplu de utilizare a control flow-ului [Sursa 6]

La execuția acestei secvențe, în punctul A nici o funcție nu a fost executată deoarece browser.get este apelat la începutul flow-ului iar name.getText este la capătul flow-ului. Valoarea pentru name.getText în puntul A este un obiect promise nerezolvat pentru care se așteaptă starea finală.

2.3.3 Node.js [Sursa 7]

Node.js este o platformă software construită motorul de JavaScript V8 din Chrome , astfel oferă posibilitatea dezvoltatorilor de a construi aplicații web sclabile cu ușurință.

Node.js folosește un model de tipul event-driven , non-blocking I/O ceea ce îl face eficient la dezvoltarea aplicațiilor real-time care sunt distribuite pe mai multe dispozitive. Javascript a fost introdus în node deoarece este un limbaj asincron cu modele bazate pe evenimente ce este bun în cazul dezvoltării aplicațiilor web scalabile. Un alt motiv îl reprezintă caracteristicile limbajului:

Familiaritatea

Utilitatea

Execuția rapidă

Ușor de compilat

JSON

Arhitectura platformei Node.js este împărțită pe trei strate:

Stratul de bază, care conține toate componentele ce formează miezul (core) platformei

Stratul de mijloc, care acționează ca și un modul de comunicare între strate.

Stratul de top, care ete format din toate API-urile de JavaScript.

Figura 2.4 Arhitectura Node.js [Sursa 7]

2.3.4 Node JS Tools pentru Visual Studio [Sursa 8]

Node.js Tools pentru Visual Studio este un plugin opne source valabil pentru Visual Studio care trasnformă aplicația într-un Node.js IDE, dezvoltat de comunitatea Microsoft.

Unealta suportă:

Intellisense

Profilling (analiza dinamicp a codului)

Consola de npm manager

Fișiere de tipul TypeScript

Debug local sau remote

Servicii de Azure Web Sites sau Cloud.

Node.js Tools permite dezvoltatorilor sa creeze proiecte node.js în Visual Studio, având stocate toate referințele și sursele asociate din proiect în fișierul de proiect de extensie .njsproj care permite afișarea acestora în explorer-ul soluției din Visual Studio.

Tipurile de proiecte care pot fi create folosind Node.js Tool:

Node.js Conlose Application

Node.js Web Application

Node.js Express Application

Node.js Azure Application

Node.js Express 3 Azure Application de tipul Basic sau Starter

Basic Node.js Express 4 Azure Application

Creeare proiectelor cod sursă existent dezvoltate prin alt IDE

2.3.5 MVC 5 [Sursa 9]

MVC este un framework de dezvoltare web care combină arhitectura de model-view-controller (MVC), practicile și tehnicile de dezvoltare agile cu platforma ASP.NET.

ASP.NET MVC furnizează o separare a conceptelor de dezvoltare datorită arhitecturii MVC. Deși pattern-ul MVC nu este nou, acesta a dobândit o mare popularitate în dezvoltarea aplicațiilor web datorită următoarelor caracteristici:

Extensibilitate

Control strict asupra HTML-ului și HTTP-ului

Testabilitate

Un sistem de rutare puternic

API modern

Este Open Source

Arhitectura MVC este prezentată in următoarea figură:

Figura 2.5 Reprezentrea arhitecturii MVC

Web MVC 5 este un template de proiect în Visual Studio care integrează framework-ul ASP.NET și toate caracteristicile acestuia ducăndu-i următoarele îmbunătățiri:

Autentificarea pe baza ASP.NET Identity pe baza de Oauth

Bootstrap pentru un UI (interfață grafică) ușor de personalizat și responsive pentru dispozitivele mobile

Filtre de autentificare care specializeaza logica de autentificare per actiune, per contoller sau globală

Rutarea pe atribute care folosește atributele pentru a defini rutele aplicației

Bootstrap este cel mai popular framework de dezvoltare a proiectelor web responsive în HTML, CSS și JavaScript. Folosit pentu dezvoltarea front-end, Bootstrap permite dezvoltatorilor folosireaCSS preprocessors (Sass și Less), scalarea eficientă a aplicațiilor și paginilor web cu o singură colecție a codului sursă și folosirea plugin-urilor jQuery.

Figura 2.6 Prezentarea vizuală a caracteristicilor din Bootstrap [Sursa 10]

Capitolul III

3.1 Analiza cerințelor

Ideea de bază a lucrării a pornit de la necesitatea de a automatiza procesul de testare al unei aplicații web. Astfel toată suita de teste aflată în regresie poate fi transformată în scripturi care rulează pe unul sau mai multe medii de testare configurate astfel încât să simuleze un mediu real în care un utilizator obișnuit folosește aplicația.

În cazul testării manuale a unei aplicații, testele trebuie introduse în regresie, adaptate și verificate des. Totodată acestea trebuie rulate periodic pentru validarea rulării corecte a aplicației. Acest proces este costisitor și consumă timp, care ar putea fi folosit cu alt scop la dezvoltare produsului software.

Această lucrare urmărește aplicarea mai multor soluții pentru problema îmbunătățirii procesului de testare prin dezvoltarea a două tipuri de proiecte teste, folosind principii diferite de proiectare și limbaje diferite. Astfel un proiect este implementat folosind Selenium WebDriver în C#, iar celălalt folosind Protractor în JavaScript

Produsul testat este aplicația WordPress, pe care a fost construit un website de prezentare al unui concurs susținut de Gamefeed.ro.

3.1.1 Descrierea aplicației de prezentare Dota2KillSecure

Dota2KillSecure este o aplicație dezvoltată prin intermediul platformei WordPres care are ca scop prezentarea concursului susținut de Gamefeed.ro pentru campionatul național de DOTA2.

Website-ul conține patru pagini:

Home

Register

News

Regulament

Pagina Home descrie scopul campionatului, detaliile despre concurs, regulile generale ale competiției și detalii despre Gamefeed.ro.

Pe pagina de Register se găsește concurenții au posibilitatea de a se înscrie în concrus până la data specificată în pagină.

Pagina de News conține posturile cele mai recente scrise de Admin cu detalii despre concurs și despre site-ul de socializare a gamerilor din Romania Gamefeed.ro. Aici utilizatorul are posibilitatea de a lăsa comentarii la posturile accesate.

La Regulament este prezentat în totalitate regulamentul concursului cât și detaliile organizatorice.

Figura 3.1 Pagina de prezentare a competiției.

3.1.2 Platforma WordPress [Sursa 11]

WordPress este o aplicație gratuită în care utilizatorul are posibilitatea să creeze un website de prezentare sau un blog. Aceasta a fost construită de o comunitate de voluntari și dispune de sute de plugin-uri si teme vizule pe care utilizatorul el poate folosi.

Folosind platforma WordPress, un utilizator poate creea website-ul dorit în orice fel. Acesta are posibilități nelimitate cand vine vorba de design, iar partea cea mai favorabilă este ca totul este construit într-un view responsive, astfel site-ul putând fi accesta de pe orice dispuzitiv mobil.

3.1.3 WAMP server

WampServer este un mediu de dezvoltare web pentru Windows care oferă utilizatorilor posibilitatea de a creea aplicatii web cu Apache2, PHP si o bază de date MySQL. Aplicația este construită cu scopul de a dispune utilizatorilor un mod intuitiv de a creea la rândul lor aplicații web și oferă următoarele funcționalități: [12]

Administrarea serviciilor prin Apache si MySQL

Comutarea accesului la aplicații live sau local

Administrarea serverelor

Accesul la fișierele de log

Accesul la fișierele de setare

Aplicația este disponibila în partea dreaptă a barei de Windows fiind reprezentată grafic de un W. La apăsarea acestei imagini, utilizatorul va accesa un meniu din care are posibilitatea de deschide panoul de control phpAdmin, după cum puteți observa și în următoarea figură.

Figura 3.2 Meniul aplicației WampServer

În panoul de comandă, utilizatorul are accesul la bazele de date existente asupra cărora are drepturi de ale modifica, a le accesa, a exporta sau importa alte baze de date, a genera noi useri, a face interogări pe una dintre acestea și totodată de a creea noi baze de date. Tot aici, userul poate accesa și schimba setările serverului.

Figura 3.3 Panoul de comandă phpAdmin

Scopul utilizării acestei aplicații în cadrul lucrări a fost de a hosta local platforma WordPress pe care a fost dezvoltat website-ul Dota2KillSecure.

3.1.4 Gamefeed.ro

Gamefeed.ro este o nouă rețea de socializare dedicată gamerilor din România. Platforma oferă un mediu în care aceștia pot să interacționeze și să împartă interese comune, implicăndu-se în discuții sau concurând în competiții de gameing locale și naționale. De asemenea Gamefeed.ro aduce ultimele știri din lumea jocurilor, accesul la evenimentele organizate de useri și accesul la secțiunea marketplace prin care utilizatorii pot adăuga anunțuri despre vânzarea, cumpărarea sau schimbul de produse în materie de gameing. O scurtă introducere a platformei este prezentată în pargraful următor de către creatorul platformei Gamefeed,ro, Vușcan Bogdan.

„Cine suntem? 

Legenda spune că a fost o dată ca niciodată un website, început prin 2007-2008. Numele nu îl mai știm dar era ceva de genul Fanatik-PSP.com, sau PSP-Fanatik.ro. Da, acesta era! 
Lumea PSP-ului din păcate apune încet, drept urmare am decis abordarea unui nou stil de comunitate pentru gameri. De astăzi, gamerii români pot să socializeze într-un mediu mai familiar lor, "ca pe facebook". Așa s-a nascut GameFeed.ro. ” [13]

Figura 3.4 Pagina oficială Gamefeed.ro

3.2 Dezvoltarea proiectului de testare realizat cu Selenium WebDriver

3.2.1 Stuctura proiectului

Proiectul de testare este format dintr-un proiect de tipul librărie de clase care este referențiat în proectul de teste, formănd soluția de testare cu Selenium WebDriver.

Figura 3.5 Structura proiectului de testare

Proiectul WordPressSeleniumTests conține suita de teste propriu-zise scrise într-o manieră lizibilă, astfel încât orice persoană poate deduce funcționalitatea unui test. Spre exemplul codul din secțiunea următoare sugerează că orice user este capabil de a vedea cele mai recente posturi de pe pagina de prezentare Dota2KillSecure de pe pagina News.

Figura 3.6 Structura proiectului WordPressSeleniumTests

[TestMethod]

public void User_can_view_recent_posts()

{

HomePage.goToNews();

Assert.IsTrue(HomePage.viewRecentPosts());

}

Secvență de cod 3-1 Exemplu de metodă de test din proiect

Proiectul WordPressPageObjects conține clase care defefinesc paginile aplicației Dota2KillSecure, paginile platformei WordPress și două clase pentru WebDriver-ul dinamic și static după cum ilustrează și figura de pe pagina următoare.

Figura 3.7 Structura proiectului WordPressPageObjects

Această delimitare între proiecte are scopul de a separa obiectele care conțin referințe către API-ul de Selenium de proiectul de testare și pentru a folosi o structură modulară care faforizează reutilizarea claselor pentru scrierea de noi teste fară a introduce noi funcționalități în proiect.

În figura de pe pagina următoare este ilustrată diagrama de clasă a întregului proiect de testare cu relațiile între clase dintre proiectele de teste respectiv de obiecte ale paginilor.

Figura 3.8 Diagrama de clasă pentru Proiectul de testare

3.2.2 Implementarea soluției cu Selenium WebDriver

În proiectul de clase WordPressPageObjects sunt definite toate clasele pentru paginile aplicației testate și clasele de Driver.

Selenium WebDriver este adăugat la referințele proiectului folosind funcționalitatea IDE-ul Visual Studio de Manage NuGet Packages prin care se pot instala și administra pachete, framework-uri și librării proiectului.

În continuare va fi prezentată implementarea claselor de Driver și a unelor clase de tipul Page.

Clasa Driver este clasa care definește instanța de WebDriver prin care se pot trimite comenzi browser-ului. Aceasta conține referințele pentru librăriile de Selenium și Firefox precum și instanța statică de WebDriver, Instance.

using OpenQA.Selenium;

using OpenQA.Selenium.Firefox;

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

namespace WordPressPageObjectClass

{

public class Driver

{

internal static IWebDriver Instance { get; set; }

public static void initialize()

{

Instance = new FirefoxDriver();

Instance.Manage().Window.Maximize();

turnonWait();

}

public static void turnonWait()

{

Instance.Manage().Timeouts().

ImplicitlyWait(TimeSpan.FromSeconds(6));

}

public static void turnoffWait()

{

Instance.Manage().Timeouts().

ImplicitlyWait(TimeSpan.FromSeconds(0));

}

public static void close()

{

turnonWait();

Driver.Instance.Close();

}

}

}

Secvență de cod 3-2 Clasa Driver

În secvența de cod prezentată anterior, motivul pentru care instanța Instance este declarată static este că toate clasele de tipu Page au nevoie de această instanță pentru accesul la metodele din WebDriver pentru identificarea elemntelor paginilor web.

Metoda statică initialize() creează o nouă instanță de tipul FireFoxDriver care lansează browser-ul FireFox căruia i se trimite apoi comanda de Maximize() care redimensionează fereastra browser-ului pe tot ecranul.

Metoda statică close() are rolul de a închide browser-ul. Această metodă se apelează la sfârșitul rulării unui test.

Clasa LoginPage și LoginCommand definesc metodele și atributele care sunt folosite pentru a decrie funcționalitățile paginii de login a platformei WordPress.

using OpenQA.Selenium;

using OpenQA.Selenium.Interactions;

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading;

using System.Threading.Tasks;

namespace WordPressPageObjectClass.Pages

{

public class LoginPage

{

public static void goTo(string loginUrl)

{

Driver.Instance.Navigate().GoToUrl(loginUrl);

}

public static void logout()

{

new LoginCommand().logout();

}

public static LoginCommand loginAs(string username)

{

return new LoginCommand(username);

}

}

public class LoginCommand

{

private string username;

private string password;

public LoginCommand(string username)

{

this.username = username;

}

public LoginCommand()

{ }

public LoginCommand withPassword(string password)

{

this.password = password;

return this;

}

public void login()

{

Driver.Instance.

FindElement(By.Id("user_login")).Clear();

Driver.Instance.

FindElement(By.Id("user_login")).

SendKeys(username);

Driver.Instance.

FindElement(By.Id("user_pass")).Clear();

Driver.Instance.

FindElement(By.Id("user_pass")).

SendKeys(password);

Driver.Instance.

FindElement(By.Id("wp-submit")).Click();

}

public void logout()

{

Actions viewPostAction =

new Actions(Driver.Instance);

viewPostAction.MoveToElement(Driver.Instance.

FindElement(By.

Id("wp-admin-bar-my-account"))).

Perform();

Driver.Instance.

FindElement(By.Id("wp-admin-bar-logout")).

FindElement(By.TagName("a")).Click();

}

}

}

Secvență de cod 3-3 Codul sursă pentru clasa LoginPage

În secvența de cod de mai sus sunt descrise metodele pentru:

Accesarea paginii prin metoda goTo()

Logarea unui user pe pagină prin metoda loginAs()

Delogarea unui user prin metoda logout()

După cum se poate observa, ambele metode loginAs() și logout() returnează un obiect de tipul LoginCommand. Acest obiect definește acțiunile user-ului pe pagină, folosindu-se de WebDriver pentru a defini toatele elementele cu care un user poate avea interacțiuni transformându-le în comenzi pentru browser. Astfel metoda login() definește elementele pentru introducerea datelor userului care pot fi introduse de la tastatură și al butonului de login pe care se poate face acțiunea de click. Metoda logout() definește o acțiune a driver-ului pentru poziționarea pe un element care atunci când este în event-ul de focus va da accesul la submeniul care conține butonul de logout pe care se poate efectua click.

Clasa MediaPage definește metodele care sunt folosite pentru a descrie funcționalitatea acestei pagini, și anume încărcarea unui fișier pe pagină sau vizualizarea historicului de fișiere încărcate.

using OpenQA.Selenium;

using OpenQA.Selenium.Support.UI;

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading;

using System.Threading.Tasks;

namespace WordPressPageObjectClass.Pages

{

public class MediaPage

{

public static bool uploadMedia(string fileFullPath)

{

return new MediaCommands(fileFullPath).upload();

}

public static bool viewUploadedFiles()

{

return Driver.Instance.

FindElements(By.

CssSelector("#the-list tr")).Count > 0;

}

}

public class MediaCommands

{

private string filesToUpload;

public MediaCommands(string file)

{

this.filesToUpload = file;

}

private Task<bool> waitForUpload()

{

TaskCompletionSource<bool> task =

new TaskCompletionSource<bool>();

try

{

var items = Driver.Instance.

FindElement(By.Id("media-items"));

Thread.Sleep(3000);

var notUploaded = true;

while (notUploaded)

{

var status = items.

FindElement(By.TagName("a")).Text;

if (status == "Edit")

notUploaded = false;

}

task.SetResult(!notUploaded);

}

catch (Exception ex)

{

task.SetException(ex);

}

return task.Task;

}

public bool upload()

{

Driver.Instance.

FindElement(By.CssSelector("a.add-new-h2")).

Click();

Thread.Sleep(2000);

var uploadButton = Driver.Instance.

FindElement(By.Id("plupload-browse-button"));

var inputFiles = Driver.Instance.

FindElements(By.TagName("input"))[1];

inputFiles.SendKeys(filesToUpload);

Thread.Sleep(2000);

uploadButton.Click();

var task = waitForUpload();

task.Wait(TimeSpan.FromSeconds(30));

var uploaded = task.Result;

return uploaded;

}

}

}

Secvență de cod 3-4 Codul sursă pentru clasa MediaPage

În secvența de cod de mai sus sunt descrise metodele pentru:

Încărcarea unui fișier pe pagină prin metoda uploadMedia()

Vizualizarea fișierelor deja încărcate prin metoda viewUploadedFiles()

După cum se poate observa, metoda de uploadMedia() returnează un obiect de tipul MediaCommands(). Acest obiect definește acțiunile unui user de a încărca pe pagină un fișier. La instanțarea acestui obiect se transmite numele fișierului prin parametrul constructorului. La apelarea metodei upload() se va face click pe header-ul paginii pentru adăugarea unei noi pagini, se vor trimite fișierele către elementul de input, se va apasă pe butonul de upload și se va lansa un task care așteaptă ca elementul care a fost încărcat pe pagină să treacă la statusul Edit, acest lucru semnalizează terminarea cu succes a acțiunii de upload care va returna un obiect de tipul bool care descrie starea de încărcare.

Proiectul de WordPressSeleniumTests conține o suită de teste care se folosesc clasele proiectului WordPressPageObjects pentru a descriere și demonstra funcționalitatea unui caz. Proiectul conține două fișierede date TestData și UserTestData.

Fișierul TestData conține date de test precum:

Credențialele pentru autentificarea pe platorma WordPress

Fișierele de încărcat pe platformă

Data pentru post și pagini

Fișierul UserTestData conține date precum:

Numelele utilizatorilor de test

Comentariile utilizatorilor pentru pagina Dota2KillSecure

Date generale pentru testarea aplicației

Clasa de test BaseTest definește metodele de inițializare și clean-up și este folosită ca și super clasă pentru celelalte teste care o moștenesc.

using System;

using Microsoft.VisualStudio.TestTools.UnitTesting;

using WordPressSeleniumTests;

using WordPressPageObjectClass;

using WordPressPageObjectClass.Pages;

namespace WordPressSeleniumTests

{

[TestClass]

public class BaseTest

{

[TestInitialize]

public void init()

{

Driver.initialize();

LoginPage.goTo(TestData.loginUrl);

LoginPage.loginAs(TestData.username).

withPassword(TestData.password).

login();

}

[TestCleanup]

public void clean()

{

LoginPage.logout();

Driver.close();

}

}

}

Secvență de cod 3-5 Codul sursă pentru clasa BaseTest

Metodele din secvența de cod ilustrată anterior sunt moștenite de fiecare test, astfel se reutilizează funcționalitatea de logare si delogare pentru fiecare test in parte.

Metoda init() apelează funcția de inițializare pentru Driver care deschide browser-ul căruia i se pot trimite comenzi. Tot aici se apelează metodele pentru logarea adminului pe platforma de WordPress folosind credențialele din fișierul TestData.

Metoda clean() apelează funția de logout() care va deloga utilizatorul curent de pe platofrma WordPress, iar apoi va închide browser-ul.

Clasa de test MediaTest definește metodele pentru funționalitatea de încărcare a unui fișier pe pagina de Media și pentru vizualizarea istoricului de fișiere încărcate.

using System;

using Microsoft.VisualStudio.TestTools.UnitTesting;

using WordPressPageObjectClass.Pages;

namespace WordPressSeleniumTests.Media

{

[TestClass]

public class MediaTests:BaseTest

{

[TestInitialize]

public void Navigate_to_media()

{

NavigationMenu.NavigateToMedia();

}

[TestMethod]

public void upload()

{

string result = Admin_can_upload_media().state;

Assert.IsTrue(result=="Passed");

}

[TestMethod]

public void viewMedia()

{

Assert.IsTrue(Admin_can_view_uploaded_media().

state=="Passed");

}

}

}

Secvență de cod 3-6 Codul sursă pentru clasa de test MediaTests

Metodele prezente în secvența de cod anterioară descriu funcționalitatea de upload.

Metoda de inițializare Navigate_to_media() încapsulează funcționalitatea de navigare, astfel se apelază la începutul fiecărei metode de test din clasa TestMedia pentru a scăpa de duplicare de cod și a favoriza modularitea.

Metoda de upload() apelează funcția de upload care conține apeluri către pagina de Media pentru încărcarea fișierelor, returnând starea finală a testului.

Metoda de viewMedia() apelează funcția de view care conține apeluri către pagina de Media pentru vizualizarea fișierelor deja încărcate, returnând starea finala a testului.

3.2.3 Rularea testelor

Visual Studio conține o fereastră numită Test Explorer care permite testorului să ruleze toate testele vizibile din soulție, astfel rularea unui test poate fi declanșată doar de câteva click-uri în fereastră.

În această fereastră testele pot fi grupate pe diferite categorii:

Not Run Tests

Passed tests

Failed tests

Testorul are capabilitatea de a rula testele din oricare categorie simultan sau doar un test. Acesta mai poate să ruleze toate suitele test descoperite la apăsarea butonului de Run All din fereastră.

Figura 3.9 Fereastra de Test Explorer din Visual Studio

Pentru a rula un test din cele prezente în fereastra de Test Explorer se face click dreapta pe acesta iar un meniu cu posibilitățile de executare va apărea. Testorul va putea selecta modul de execuție a testului în degub( pentru a rula testul pas cu pas) sau run (pentru a rula testul fără orpire) după cum se poate observa și în următoarea figură.

Figura 3.10 Meniul de execuție a testelor

3.2.4 Avantaje și dezavantaje

Implementarea unui astfel de framework de testare automată a aplicațiilor web aduce următoarele avantaje și dezavantaje.

Avantaje

Structura soluție bazată pe două proiecte, unul care definește obiectele paginilor testate împreună cu funcționalitatea acestora, iar unul care conține teste care se folosesc de obiectele de tip pagină pentru a descrie funcționalitatea acestora, este utilizată pentru dezvoltarea unui framework de testare scalabil ce permite reutilizarea și creearea de noi teste care refolosesc paginile deja construite.

Soluția este dezvoltată astfel încât să suporte rularea pe una sau mai multe mașini virtuale cu medii de testare diferite. Aceasta trebuie integrată la un build de dezvoltare care poate fi executat pe un server de integrare continuă cu accesul la agenți de testare (mașini virtuale) care au mediul deja configurat, de exemplu Team Foundation Server.

Testele au fost dezvoltate folosind pattern-ul Object Page pentru a avea o separea clară a codului pentru teste care descrie funcționalitatea testată și codul specific paginilor care conține definirea elementelor de UI și metodele de execuție.

Testele pot fi rulate individual pentru a observa timpul de execuție și oportunitățile de îmbunătățire a aplicației testate.

Testele sunt scrise într-o manieră lizibilă pentru ca orice persoană din echipa de dezvoltare să înțeleagă funcționalitatea testată.

Dezavantaje

Deoarece testele folosesc clasa Driver, instanța de driver va fi statică, iar instanțierea de noi drivere va cauza ca executarea următoarelor teste să se realizeze pe instanța nouă, iar din acest motiv nu se pot lansa în execuție teste în paralel. Aceasta problemă se poate rezolva prin folosirea driverului dinamic si a claselor de pagini dinamice.

Pentru a rula testele pe aceeași instanță de browser trebuie realizat un test de integrare care să folosească toate clasele de pagină. Acest fapt presupune dezvoltarea de noi teste cauzând duplicare de cod.

Orice modificări aduse la clasa de bază se vor reflecta asupra întreaga suită de teste care o moștenesc.

Momentan datele de test sunt inconsistente având puțini useri și date de intrare.

Mediu în care testele rulează este local ceea ce nu oferă o siguranță la rularea aplicației în parametri normali pentru celelalte medii în care utilizatorii o vor folosi.

3.3 Dezvoltarea proiectului de testare realizat cu Protractor

3.3.1 Structura proiectului

Soluția de testare realizată cu Protractor, spre deosebire de celaltă soluție, conține doar un proiect de tipul nodejs project. Acesta conține fișierele de configurare a testelor, fișierele de teste propriu-zise, fișierele cu obiectele paginii și fișierele cu logica de funcționare a aplicației testate.

Figura 3.11 Structura proiectului realizat cu protractor

Folderul business-functions conține fișierele javascript care conțin logica de funcționalitate a aplicației testate, fără a folosi apeluri către framework-ul de Protractor.

Folderul page-objects conține fiserele javascript care definesc elementele paginii folosindu-se de apelurile către framework-ul Protractor pentru a le identifica.

Folderul tests conține fișierele de javascript care definesc cazurile de testare care fac apeluri către funcțiile care conțin logica de funcționalitate a aplicației.

Fișierele de configurare initializează parametri de rulare a testelor și configurarea mediului de testare.

Fișierul runTests.cmd conține comanda de rulare a testelor.

3.3.2 Implementarea soluției cu Protractor

Soluția de testare implementând framework-ul Protractor are următoarele constrângeri:

Toate fișierele de test trebuie să redenumite sub forma numele_testului.spec.js

Toate testele care vor fi rulate trebuie adăugate în fișierul config.global.js

NodeJs trebuie instalat local sau pe mașina care rulează testele cât și modulele de node pentru framework-urile folosite:

Chai pentru accesul la librăria de assert

Cheerio pentru folosirea core-ului de jQuery

Engine-ul ES6 pentru promises și generators

Lodash pentru accesul la librăriile javascript pentru consistență, modularitate și perfomanță

Mocha pentru rularea testelor în node.js

Node-Harmony pentru detectarea erorilor de conecțiune, respectiv timeout ale serverului

Q pentru crearea de promises asincrone

Suspend pentru folosirea de promises și simplificarea control flow-ului

Implementarea proiectului a fost realizată în Visual Studio folosind NodeJs Tools pentru a obține template-ul pentru proiectele de node, dar soluția nu este constrânsă de un anumit IDE, aceasta putând fi dezvoltată folosind cel mai simplu editor de texte Notepad.

După cum dictează implementarea framework-ului Protractor trebuie respectate constrângerile descrise anterior. Astfel în continuare vor fi prezentate secvențe de cod pentru un caz de testare.

Fișierul config.globa.js trebuie sa păstreze fomatul conținutului secveneței prezentate anterior. Acesta conține:

adresa hub-ului pentru serverul de Selenium

suita de teste

referințele către framework-urile utilizate și configurațiile necesare

parametrii de configurare a web-serverului pentru testare

capabilitățile pentru browser

exports.config = {

seleniumAddress: 'http://localhost:4444/wd/hub',

suites: {

login: './tests/login.spec.js',

dashboardFunctions:

'./tests/dashboard/dashbordFunction.spec.js',

postsFunctions: './tests/posts/postFuncitons.spec.js',

mediaFunctions: './tests/media/mediaFuncitons.spec.js',

pagesFunctions: './tests/page/pagesFunction.spec.js',

logout: './tests/logout.spec.js',

usersFunctions: './tests/users/usersFunctions.spec.js'

},

directConnect: true,

framework: 'mocha',

mochaOpts: {

slow: 30000,

timeout: 120000

},

onPrepare: function() {

global.assert = require('chai').assert;

global.suspend = require('suspend').promise;

require('./utilities/elementFinder');

browser.manage().window().maximize();

},

params:{

server:'localhost',

defaultCredentials:{

username: testData.username,

password: testData.password

}

},

capabilities: {

'browserName': 'chrome'

//'browserName': 'firefox'

//'browserName': 'internet explorer'

}

}

Secvență de cod 3-7 Codul sursă pentru fișierul de configurare

Fișierul de test mediaFunctions.spec.js conține referințe către pagina de navigare, funcționalitățile paginii media și datele de test. Acesta folosește framework-ul mocha pentru definirea testului păstrand structura tipică de test. Astfel pentru partea de inițializare a testului este funcția before, pentru clean-up este funcția after, iar clean-up după executarea testelor se face prin funcția afterEach. Funcția it are rolul de metodă de test sau pas de execuție al testului.

describe("WordPress platform ", function () {

Navigate = require('../../page-objects/navigationMenu.js'),

MediaFunctions = require('../../business-functions/wordpress-functions/media.js');

testData = require('../testData');

var wordePressMenu = new Navigate();

var mediaFunctions = new MediaFunctions();

beforeEach(function () {

return suspend(function* () {

yield wordePressMenu.navigatToMedia();

})();

});

it('should be able to give the admin the possiblity to upload media files', function () {

return suspend(function*() {

yield mediaFunctions.

uploadMedia(testData.filesToUpload);

})();

});

it('should be able to give the admin the possiblity to view the uploaded media files', function () {

return suspend(function*() {

yield mediaFunctions.viewUploadedFiles();

})();

});

});

Secvență de cod 3-8 Codul sursă pentru testele media

În secvența de cod menționată, pasul care se execută pentru inițializarea fiecărei funcșie de test constă în navigarea la pagina de Media a platformei WordPress.

Prima funcție de test validează funcționalitatea de upload a paginii Media, iar a doua funcție are rolul de a valida funcționaliatea pentru vizualizarea istoricului fișiere încărcate pe pagină.

Fișierul media.js conține definițile pentru metodele de uploadMedia() și viewUploadedFiles care se folosesc de obiectele paginii Media pentru apelul funcțiilor corespunzătoare descrise de funcționalitatea metodei. Totodată după executarea aplelurilor se realizează și validarea datelor obținute.

MediaPage = require('../../page-objects/mediaPage.js');

/**

* @constructor

*/

var Media = function () {

};

/**

* Validates if the admin can upload media to WordPress.

* @return {!webdriver.promise.Promise.<Object>} Test results.

*/

Media.prototype.uploadMedia = function (fileFullPath) {

return suspend(function*() {

var mediaPage = new MediaPage();

yield browser.sleep(1000);

var fileUploaded = yield mediaPage.uploadFile(fileFullPath);

assert.ok(fileUploaded , 'Admin should be able to upload files');

})();

};

/**

* Validates if the admin can view the uploaded files.

* @return {!webdriver.promise.Promise.<Object>} Test results.

*/

Media.prototype.viewUploadedFiles = function () {

return suspend(function*() {

var mediaPage = new MediaPage();

yield browser.sleep(1000);

var listOfFilesDisplayed = yield mediaPage.

viewListOfMediaFiles();

assert.ok(listOfFilesDisplayed , 'Admin should be able to upload files');

})();

};

module.exports = Media;

Secvență de cod 3-9 Codul sursă pentru funcționalitatea paginii Media

Fișierul mediaPage.js conține definițiile elementelor de UI și metodelor upload și view. Aici se fac apelurile către API-ul framework-ului Protractor pentru a trimite comenzile către browser.

/**

* @constructor

*/

var MediaPage = function () {

browser.ignoreSynchronization = true; // non AngularJS

this.addNewMedia = element(by.css('a.add-new-h2'));

this.listOfMediaFiles = element.all(by.css('#the-list tr'));

};

MediaPage.prototype.waitForUpload = function () {

var that = this;

return suspend(function*() {

var items = element(by.id('media-items'));

yield browser.sleep(5000);

var notUploaded = true;

while (notUploaded) {

var status = yield items.element(by.tagName('a')).

getText();

if (status == 'Edit')

notUploaded = false;

}

return !(notUploaded);

}).bind(this)();

};

MediaPage.prototype.uploadFile = function (filePath) {

var that = this;

return suspend(function*() {

yield that.addNewMedia.waitFor();

yield that.addNewMedia.click();

yield browser.sleep(2000);

var uploadButton = element(by.id('plupload-browse-button'));

var inputFiles = element.all(by.tagName('input')).get(1);

yield inputFiles.sendKeys(filePath);

yield uploadButton.click();

var uploaded=yield browser.wait(that.waitForUpload(), 20000);

return uploaded;

}).bind(this)();

};

MediaPage.prototype.viewListOfMediaFiles = function () {

var that = this;

return suspend(function*() {

var mediaFiles = yield that.listOfMediaFiles.count();

return mediaFiles > 0;

}).bind(this)();

};

module.exports = MediaPage;

Secvență de cod 3-10 Codul sursă pentru definirea elementelor pagini Media

În secvența de cod de mai sus metoda uploadFile() are rolul de a încărca un fișier pe pagină. Aici se va transmite fișierul transmis ca parametru elementului de input după care se va aștepta ca upload-ul să se finalizez, aceasta implică schimbarea statusului în Edit, returnând statusul.

Metoda viewListOfMediaFiles() are rolul de a determina dacă lista de fișiere încăracată. Aici se va returna true dacă lista este populată, sau false în cazul contrar.

3.3.3 Rularea testelor

Rularea testelor se face prin executarea comenzii de runTests.cmd din fișierul soluției din command promt.

La executarea comenzii fereastra de browser se va deschide iar testele se vor exectua în ordinea în care au fost introduse în fișierul de config.global.js. Se vor afișa testele care sunt executate împreună cu timpul de execuție.

Figura 3.12 Lansarea comenzi de runTests

Figura 3.13 Finalul executiei testelor

La finalul execuțeiei se va afișa numărul total de teste care au trecut și care au picat cât și timpul total de execuție.

Testele marcate cu culoarea roșie reprezintă testele picate. Mesajele pe care le poate afișa framework-ul de testare sunt de două tipuri, ori de aserție falsă ori de eroare.

În cazul mesajului de eroare va trebui analizat codul care a provocat eroarea pentru a determina dacă s-au făcut modifcări de UI sau dacă elementul nu a fost corect definit.

Figura 3.14 Mesajul de eroare

În cazul în care mesajul este de aserție falsă testul este picat iar problema trebuie semnalată developer-ilor.

Figura 3.15 Mesajul de aserție falsă

3.3.4 Avantaje și dezavantaje

Implementarea unui framework de testare automată folosind Protractor aduce următoarele avantaje și dezavantaje.

Avantaje

Framework-ul este ușor extensibil și scalabil

Dezvoltarea framework-ului în javascript aduce cu sine și avantajele limbajului și în special folosirea funcțiilor asincrone. Pentru a folosi funcțiile sincrone într-un mod simplu sunt folosite cele două tehnologii promises și generators.

Framework-ul folosește o arhitectură ierarhizată pe pattern-ul de functional test architecture care se compune din page objects pattern și buisiness functions.

Folosirea mai multor framework-uri precum mocha pentru testare și chai pentru librăria de aserții. Astfel se pot adăuga noi pachete pentru librăriile de node care pot îmbunătăți procesul de testare și dezvoltare a framework-ului.

Poate fi integrat folosind team city pe un server de integrare continuă care rulează un build care poate executa testele pe mai multe mașini virtuale pentru a testa diferite medii.

Dezavantaje

Momentan datele de test sunt inconsistente având puțini useri și date de intrare.

Mediu în care testele rulează este local ceea ce nu oferă o siguranță la rularea aplicației în parametri normali pentru celelalte medii în care utilizatorii o vor folosi.

Datorită constrângerilor oferite de folosirea framework-ului Protractor, testele sunt mai complexe.

Fișierele de test nu sunt lizibile, fiind necesare cunoștințe de javascript pentru a le întelege.

Executarea mai multor teste în paralel nu este implementată.

3.3 Aplicația de testare

3.3.1 Arhitectura aplicației

3.3.2 Implementarea aplicației

3.3.3 Utilizarea aplicației

Capitolul IV

4.1 Rezultate comparative

Capitolul V

5.1 Concluzie

5.2 Directia de dezvoltare

Capitolul VI

Referințe bibliografice

[1]  C# Language Specification (PDF) (4th ed.). Ecma International [Online]. URL valabil: http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-334.pdf

[2] Introduction to the C# Language and the .NET Framework [Online]. URL valabil:

https://msdn.microsoft.com/en-us/library/z1zx9t92.aspx

[3] "ECMAScript Language Specification" (PDF) [Online]. URL valabil:

http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf

[4] Official Visual Studio WebSite [Online]. URL valabil:

https://www.visualstudio.com

[5] Official Selenium Webdriver Documentation [Online]. URL valabil:

http://www.seleniumhq.org/docs/03_webdriver.jsp

[6] Official Protractor Documentation [Online]. URL valabil:

https://angular.github.io/protractor/#/

[7] “Node.js: Lightweight, Event driver I/O web development”(PDF) [Online] URL valabil:

http://informatics.nic.in/uploads/pdfs/26b47a73_node.js.pdf

[8] Official NodJS Tools Documentation [Online] URL valabil:

https://github.com/Microsoft/nodejstools/wiki

[9] Steven Sanderson, ”Pro ASP.NET MVC 2 Framework”, Second Edition, United States of America, Apress 2010

[10] Official Bootstrap Website [Online] URL valabil:

http://getbootstrap.com/

[11] Official WodPress Website [Online] URL valabil:

https://wordpress.org/

[12] Official WAMPServer Website [Online] URL valabil:

http://www.wampserver.com/en/

[13] Official Gamefeed.ro Website [Online] URL valabil:

http://gamefeed.ro/