Cypress si noua generatie in automatizare

Intr-unul dintre articolele precedente de pe blog am vorbit despre importanta testarii in general si a testarii automate in particular, prezentand unul dintre cele mai populare framework-uri care ne ajuta la automatizarea testelor, WebdriverIO. In continuare voi prezenta un alt framework extrem de folosit in cadrul procesului de testare automata, si anume Cypress.

Ce este si cum a aparut Cypress?

Asa cum am mentionat anterior si cum reiese si din titlul articolului, Cypress („Chiparos” intr-o traducere foarte directa din engleza) este un instrument ce ne permite ca in desfasurarea procesului de testare a aplicatiilor noastre software sa scriem, sa controlam si sa automatizam testele scrise de noi, pentru a verifica succesiv functionalitati si detalii diverse, intr-un mod rapid si eficient.

Cypress este totodata un framework din ceea ce se poate numi noua generatie de astfel de tool-uri din sfera automatizarii, idee sustinuta prin faptul ca este o aplicatie destul de „tanara”, si apoi prin faptul ca a fost construita pentru a se aplica noilor tehnologii software.

Istoria Cypress incepe in anul 2014 cand este infiintata compania cu acelasi nume de catre specialistul software Brian Mann, care a vrut sa puna bazele unui nou framework adaptat cerintelor Web-ului modern, bazat la randul sau pe tot mai multe alte softuri si librarii care i-au crescut complexitatea si inclusiv nevoia de testare mai eficienta. Cum testarea aplicatiilor web devenea tot mai greoaie, Mann a inceput sa lucreze la un nou framework, Cypress.

Desi initiativa a pornit in 2014, a durat cativa ani pana sa fie dezvoltat si testat, in fazele Alpha si Beta, iar la finalul lui 2017 a fost lansata varianta de lucru finala (dar nu si ultima) a acestui framework. Acesta s-a dovedit rapid un instrument de automatizare extrem de fiabil, eficient si adaptat la randul sau noilor cerinte din industria IT, simplificand semnificativ munca celor din QA. Cypress a fost ulterior adoptat de tot mai multe companii si este o solutie tehnica foarte buna pentru a realiza testare automata, atat la un job propriu-zis, cat si daca inveti testare pe cont propriu si vrei sa exersezi.

Cypress este folosit in special pentru testarea aplicatiilor web, fiind potrivit pentru noile tehnologii ce se regasesc astazi in structura lor (cum ar fi librariile React, Angular, Vue, Svelte etc.). Pe langa acestea, Cypress poate fi folosit si pentru testarea de API-uri, fiind deci extrem de versatil si configurabil.

Cu Cypress putem testa fie numai o componenta specifica a unei aplicatii, precum o testare vizuala pentru a vedea daca corespunde cu design-ul din documentatie (Visual Regression Testing), fie putem realiza o suita de teste care sa imite comportamentul obisnuit al unui utilizator, situatie ce se cheama End-to-end Testing (testare de la un capat la altul), ca sa verificam per ansamblu flow-ul aplicatiei.

Instalare, setup si utilizare

Din perspectiva utilizarii, Cypress este destul de asemanator cu WebdriverIO. Ambele framework-uri se folosesc cu limbajul de programare JavaScript (si numai cu acesta), si cu ajutorul mediului de rulare Node.js. Astfel, daca cunosti deja bazele programarii si ai lucrat cu JavaScript, eventual folosind alt framework de automatizare, atunci nu vei avea nicio problema in a invata si utiliza Cypress.

Primul pas ramane mai intai de a instala pe calculatorul nostru aplicatia Node.js, daca nu o avem deja instalata, pentru a putea ulterior rula scripturile de automatizare scrise cu JavaScript, actionand gradual diversele motoare de cautare sau API-uri. Nu trebuie decat sa intram pe site-ul oficial al Node.js, si sa descarcam cea mai recenta versiune a sa pentru utilizatori, apasand butonul din stanga. Apoi urmam pasii de instalare ce ni se afiseaza, majoritatea prin simplu click pe „Next”.

Dupa ce ne-am asigurat ca avem Node.js instalat, putem instala Cypress in directorul proiectului nostru de automatizare. Aici e din nou recomandat sa avem un folder cu proiectele noastre, iar fiecare proiect sa fie tinut separat in propriul sau director, pe o alta partitie decat C (unde avem sistemul de operare). Instalarea Cypress se face, ca si la WebdriverIO, din Terminalul de comanda (Command Prompt), accesat din calculatorul nostru prin comanda „cmd” in campul de cautare de langa „Start”.

Dupa ce l-am deschis, navigam pana in folderul proiectului nostru si acolo folosim comanda de instalare pentru Cypress, pe care o gasim pe site-ul Node Package Manager, de unde putem instala orice framework de care avem nevoie.

De aici vom lua comanda de instalare dand click pe ea, apoi o lipim in terminalul nostru si apasam „Enter”; de aici incolo se va instala Cypress in folderul nostru. La finalul instalarii, daca totul s-a desfasurat corect, ni se va deschide interfata aplicatiei Cypress, din care ulterior putem naviga si putem configura natura testului/ testelor noastre. Tot aici putem alege ce tip de testare vrem sa facem, sa configuram anumiti parametri, iar in timpul executiei testelor vom avea si un desfasurator live al acestora, ca sa vizualizam fiecare pas, totul completat cu un raport final, deci foarte multe lucruri utile pentru testare. Detaliile se gasesc in documentatia Cypress.

Avantaje si dezavantaje ale lui Cypress

Asa cum am mentionat tangential si in paragrafele anterioare, Cypress prezinta o serie de mai multe avantaje, tehnice si de utilizare, dar nu este lipsit si de puncte slabe. Primul si probabil cel mai mare avantaj al lui Cypress este reprezentat de faptul ca este un framework modern, construit pentru website-urile care au la baza tehnologii noi si complexe.

Desigur, putem face testare automata si cu alte tool-uri, insa Cypress este construit la randul sau pe baza altor instrumente si librarii, precum Chai, care imbunatatesc semnificativ procesul de testare automata, modul in care selectam elementele din pagina web si le accesam in proiectul nostru de testare.

Un alt avantaj este acela ca Cypress poate fi instalat si utilizat destul de usor, atat de un tester profesionist, cat si de un incepator care nu are prea multa experienta cu testarea automata. Pasii de instalare si configurare sunt accesibili si intuitivi, avantaj prilejuit de interfata acestuia care usureaza accesarea si configurarea ulterioara.

Mai mult, integrarea unor alte librarii in cadrul Cypress diversifica destul de mult modul sau de operare in testare, asigurand un mod facil si clar prin care testele noastre ajung sa verifice diferitele detalii si functii. Cypress ofera inclusiv o serie de teste predefinite, ca sa iti arate cum functioneaza la nivel demonstrativ pe anumite website-uri, ceea ce ajuta foarte mult la intelegerea ideii de testare automata pentru incepatori. Scrierea de teste se bazeaza pe o sintaxa relativ simpla si clara, sub forma unor scripturi ce contin arrow functions.

Printre punctele slabe se enumera faptul ca Cypress este un framework construit pe baza limbajului JavaScript si poate fi utilizat doar cu acesta (sau cu supersetul acestuia, TypeScript), fiind dedicat pentru testarea web si eventual de API. De aici deriva al doilea dezavantaj, si anume ca Cypress nu poate testa orice fel de aplicatie, cum ar fi cele mobile de exemplu, decat daca sunt si ele construite pentru a rula in web.

Un alt minus este acela ca desi e foarte bun pentru a testa aplicatii web in propria sa interfata de rulare, Cypress poate folosi (deocamdata) doar motoarele de cautare construite pe baza Chromium, precum Google Chrome, Microsoft Edge sau Mozilla Firefox. Nu poate testa deci pe alte motoare folosite de utilizatori, precum Brave, Opera sau Safari.

Chiar si asa, Cypress a devenit tot mai popular si folosit in ultimii ani de cand a fost lansat oficial, ajungand la o medie de peste 4,6 milioane de descarcari saptamanale de pe site-ul NPM, trend ce se mentine ascendent. Eficienta acestuia l-a propulsat in topurile celor mai populare si folosite instrumente de automatizare in testare, alaturi de alte framework-uri cunoscute, precum Selenium sau WebdriverIO. Foarte multe companii de top folosesc in mod curent Cypress in procesul lor de dezvoltare si testare, companii printre care se regasesc Slack, Netflix, NBA, Disney, Shopify, LEGO, JPMorgan Chase sau Revolut.

Comparatie intre WebdriverIO si Cypress

Dupa ce am vazut pe rand ce reprezinta atat WebdriverIO, cat si Cypress, care le sunt punctele tari si slabe, consider ca e necesar sa intregim discutia cu o comparatie intre cele doua instrumente de automatizare, astfel incat daca esti la inceput de drum in testare software sa ai toate datele pentru a alege cu care dintre cele doua sa incepi a invata testare automata.

Ambele tool-uri au fost dezvoltate in ultimii cativa ani, si pot fi incadrate in ceea se numeste generic noua generatie de framework-uri pentru testare automata, construite cu JavaScript. Desigur, ele nu sunt singurele astfel de aplicatii, exista multe altele in domeniu.

Ambele sunt folosite extrem de mult pentru partea de testare web, unde actualizarile constante le fac sa fie destul de potrivite pentru a testa website-uri tot mai complexe. Insa aici apar si diferentele, in timp ce WebdriverIO poate fi folosit si pentru testarea aplicatiilor mobile cu ajutorul pachetului Appium, Cypress nu poate testa aplicatii mobile decat daca sunt construite sa ruleze in web. In schimb, Cypress poate automatiza testarea de API-uri, ceea ce WDIO nu poate.

Instalarea ambelor softuri este destul de intuitiva, configurarea este si ea destul de abordabila si personalizabila in functie de necesitati. Pentru a le folosi, este deci nevoie sa cunosti bazele limbajului JavaScript si Node.js. O diferenta vine totusi pe partea de invatare a lor. Cypress ofera pe site-ul lor propriu mai multe resurse extrem de bune si utile pentru a deprinde lucrul cu acesta, pe cand WDIO nu ofera in sine asta, desi tutoriale pe internet se gasesc destule.

Legat de selectarea elementelor, in cazul WebdriverIO tu trebuie sa cauti in codul HTML acei selectori de care ai nevoie pentru a ii transpune in cod astfel incat sa automatizezi functiile. La Cypress poti face la fel, dar in paralel are incorporata si o functie proprie prin care poti pur si simplu dai click pe un anumit element din pagina si iti selecteaza automat selectorul acelui element pentru a-l folosi in testare.

Atat Cypress, cat si WebdriverIO beneficiaza de sprijinul comunitatilor open-source, lucru ce le aduce constant imbunatatiri ce cresc capacitatea si calitatea testarii efectuate. De mentionat este si ca ambele sunt construite la randul lor pe alte librarii si astfel integreaza mai multe functionalitati necesare in automatizare. De aici poate rezulta un punct slab, ca pentru a le folosi trebuie sa te obisnuiesti sa folosesti documentatiile lor proprii, care sunt destul de stufoase, dar si documentatiile altor framework-uri integrate, precum Chai sau Mocha, pentru a intelege cat mai bine ce trebuie sa cauti sau sa faci.

Un alt punct slab pentru amandoua este ca pot fi folosite numai cu limbajul JavaScript (ori TypeScript). Chiar daca acesta este unul dintre cele mai populare limbaje de programare din lume, este posibil ca nu toata lumea sa fi inceput a invata programare cu acesta. Astfel, chiar daca stii bine un alt limbaj folosit si in testare automata, precum Python, Java sau C#, daca vrei sa lucrezi cu Cypress ori WDIO, mai intai trebuie sa cunosti bazele JavaScript urmat apoi de Node.js.

Cu oricare dintre cele doua vei incepe aventura invatarii in testare automata, nu vei da gres. Ambele sunt destul de mult folosite in acest proces in intreaga lume, iar invatarea devine din ce in ce mai abordabila: odata ce ai inteles pe unul dintre ele, iti va fi mai usor sa le deprinzi pe urmatoarele. Iar dupa ce le-ai inteles, poti sa inveti linistit si alt framework cu alt limbaj de programare in functie de nevoi sau de jobul pe care il ai. Eu am inceput mai intai cu WebdriverIO si apoi mi s-a parut mai usor sa trec la Cypress; ideea e practica cat mai multa, sa te joci cu cat mai multe elemente si functii de pe website-uri, pentru a le automatiza.

Concluzii

In incheiere, reamintesc ideea ca Cypress este unul dintre cele mai folosite instrumente de automatizare a testarii din industria IT. Faptul ca este usor de instalat, configurabil, versatil si avand o interfata de lucru destul de intuitiva sunt argumente care il incadreaza la categoria solutiilor foarte bune de automatizare in testare.

Acesta face parte, impreuna cu WebdriverIO si multe alte aplicatii asemanatoare din noua generatie de framework-uri de testare automata cu JavaScript, fiind aplicatii dezvoltate si gandite pentru Web-ul modern, tot mai complex ca functionalitati. Daca vrei sa inveti testare automata, Cypress este una din cele mai la indemana si mai populare solutii din domeniu, fiind accesibila pentru incepatori si folosita destul de mult de companiile IT.

Surse consultate si aditionale despre Cypress

1. Site oficial Cypress: https://www.cypress.io/
2. Documentație Cypress: https://docs.cypress.io/guides/getting-started/installing-cypress
3. Istoria Cypress: https://www.cypress.io/about-us/our-story/
4. Cursurile lor proprii de învățat Cypress + alte resurse: https://learn.cypress.io/
5. Canalul lor de Youtube (cu materiale explicative), serverul lor de Discord, blogul și pagina de GitHub a Cypress
6. Despre noua generație de framework-uri pentru testare automată cu JavaScript: https://blog.qasource.com/next-gen-javascript-based-automation-frameworks
7. Comparatii intre Cypress si WebdriverIO sunt 👉 aici, 👉 aici si 👉 aici.
8. Topuri in care apare Cypress sunt numeroase, cum ar fi acestea: top 1️⃣, top 2️⃣, top 3️⃣, top 4️⃣.
9. Companii care folosesc Cypress: https://stackshare.io/cypress.