Fiddler – un DevTools pentru mobile si web

Procesul de testare al diferitelor aplicatii software este extrem de complex datorita faptului ca trebuie inspectate foarte multe detalii tehnice si non-tehnice, care ulterior se rasfrang asupra experientei utilizatorilor finali.

Pentru a testa cat mai in detaliu si cat mai cuprinzator produsele software, trebuie sa cunoastem si sa folosim o gama variata de instrumente de lucru in QA. Un astfel de instrument util, care ne poate ajuta la verificarea aplicatiilor web, dar si a celor de tip mobile, este Fiddler.

Ce este Fiddler?

Chiar daca nu e probabil cel mai cunoscut tool pentru testare din categoria sa sau in general vorbind, totusi Fiddler este un instrument despre care merita vorbit datorita functiilor acestuia.

Fiddler, in traducere “scripcar” sau “violonist”, este o aplicatie care ne ajuta sa simulam o interfata asemanatoare cu cea a consolei de Developer Tool si mai ales a sectiunii de Network, de aici decurgand principalele functii ale sale care ne ajuta in testarea propriu-zisa.

Ne poate ajuta sa vedem mai bine partea de backend a aplicatiilor testate, ce se intampla in spate, ce call-uri se fac, sa monitorizam traficul de event-uri, sa il inspectam daca ceva nu merge bine, sa analizam ce API-uri sunt folosite si cu ce metode in diferite situatii etc.

Instrumentul Fiddler a fost creat in 2003 de catre programatorul Eric Lawrence, ideea de baza fiind aceea de a simplifica procesul de debugging al produselor web. In 2023, Fiddler a implinit varsta rotunda de 20 ani, si a devenit o aplicatie mult mai complexa decat in 2003.

Ea a pornit ca un instrument de analiza pentru aplicatiile web deoarece nu era deloc un proces simplu la inceputul mileniului, dar in timp a capatat noi functii care i-au largit sfera de aplicabilitate, precum in cazul aplicatiilor mobile, unde nu avem un DevTools la indemana ca in cazul browser-ului.

Cu Fiddler putem sa analizam foarte usor partea de retea (network) sau sa facem troublshooting pe anumite componente software, daca e cazul. Acest tool functioneaza ca un proxy intermediar, plasat intre aplicatia pe care o verificam si reteua de Internet, generand un certificat de autoritate unic pe masina. Tradus mai simplu, este un portal de mijloc, unde vedem ce request-uri HTTP vin si pleaca spre si dinspre aplicatia noastra.

Cum folosim Fiddler. Instalare si setup

Folosirea  tool-ului Fiddler presupune cateva etape premergatoare, nu foarte complicate. El prezinta atat o varianta gratuita, cu functionalitati de baza (pe care o vom folosi in continuare), si una platita, cu setul complet de functii oferit.

Primul pas este sa intram pe site-ul de casa al celor care detin Fiddler, telerik.com, si acolo sa cautam cea mai recenta versiune a aplicatiei, disponibila pe Windows (sau MacOS, dupa caz). Descarcam installer-ul, il pornim, si cu cateva click-uri simple (Run – Next – Agree), ni se va instala aplicatia pe desktop. Putem selecta instalarea doar pentru un user.

Modalul de instalare Fiddler

A doua etapa, dupa instalarea aplicatiei pentru desktop, este sa ne cream un cont personal. Aici vom fi redirectionati catre site-ul telerik.com, unde va trebui sa completam un formular standard cu o adresa de email, o parola si cateva date.

Pagina de logare / creare cont

Dupa ce activam in final contul, vom fi redirectionati la aplicatia instalata, si ne vom putea folosi de ea timp de 10 zile, cat dureaza Free Trial, daca nu platim. Pentru cei interesati, varianta platita Pro este de 10 dolari/ luna, iar cea Enterprise 25 dolari/ luna. Din acest punct, putem sa incepem sa folosim Fiddler pentru a inspecta sau monitoriza anumite traficuri de date din anumite aplicatii.

Pagina principala din aplicatia Fiddler

Exemple de folosire ale lui Fiddler

In continuare vom vedea cateva exemple de folosire practica a acestui instrument de lucru, in limita a ceea ce ne ofera versiunea sa gratuita. Vom incepe cu un prim exemplu pentru partea web.

Un pas important pe care trebuie mai intai sa il facem este acela de a instala un certificat de la o autoritate de certificare care in acest caz reprezinta Fiddler. Odata instalat si acceptat acest certificat, aplicatia va putea monitoriza request-urile HTTP, practic tot ce facem pe un website.

Certificatul de autoritate (CA) Fiddler

Dupa ce am acceptat, din sectiunea Traffic, selectam (daca nu e deja) Live traffic pentru a vedea toate actiunile din web de pe PC-ul nostru, iar pentru mai multe detalii putem activa si optiunea System Proxy.

In aceasta interfata putem selecta cate un call din lista principala, si sa il inspectam, sa vedem anumite detalii tehnice precum codul HTTP, ce fel de request este, daca a fost sau nu efectuat cu succes, ce metoda a folosit, diferite IP-uri (de client, de protocol etc.), detalii legate de server, durate de incarcare si procesare, si multe altele.

Orice actiune efectuam pe browser, ni se va reflecta aici. E posibil ca internetul sa mai fie intrerupt, ca un mic inconvenient din cauza sistemului Proxy.

Traficul web reflectat in aplicatie

Un al doilea exemplu in care vom folosi Fiddler este legat de inspectarea pentru partea de mobile. In acest caz procedura este putin mai ampla, in sensul ca sunt mai multi pasi pe care trebuie sa ii urmarim, pentru a lega dispozitivul mobile de PC prin aceeasi retea de internet, monitorizata cu Fiddler.

Optiunile pentru mobile

Pasii sunt descrisi foarte bine la sectiunea Remote devices, unde trebuie sa ii bifam pe rand: conectam un telefon de exemplu la aceeasi retea de internet, descarcam acelasi certificat de autoritate Fiddler si il instalam pe telefon, setam un proxy manual cu aceleasi date din aplicatie, si in final putem monitoriza call-urile pe mobile.

Pasii de configurare a dispozitivelor Android la Fiddler

Dupa ce am parcurs pasii respectivi, confirmarea ca telefonul nostru cu Android este conectat e reprezentata de un mesaj cu “Successfully connected at Fiddler” in navigatorul telefonului.

Din acest punct, putem intra pe o aplicatie web, iar request-urile HTTP cu detaliile specifice ne vor aparea pe PC, in interfata Fiddler, ca in exemplul precedent.

Lista de request-uri din Android in Fiddler

O alta optiune pe care o putem regasi in Fiddler este terminalul, care poate fi folosit pentru a executa diferite comenzi. Acesta poate imbraca forma de Command Prompt sau Power Shell (pe Windows), si poate fi folosit la capturarea diferitelor call-uri.

Terminalul deschis din interfata

Avantaje si dezavantaje ale lui Fiddler

Cu siguranta fiecare instrument de lucru are calitati si defecte, iar Fiddler nu face exceptie de la aceasta premisa. Printre calitatile sale, se poate numara faptul ca este o solutie la indemana oricui, ce poate fi accesata usor, prin instalarea unei aplicatii simple si crearea unui cont pe platforma.

Un al doilea avantaj este dat de bogatia sa de functii, fapt ce il transforma intr-un tool versatil, ce poate fi folosit extrem de bine la inspectarea aplicatiilor web si mobile, si la executarea de debugging.

Interfata sa este una destul de intuitiv, iar fiecare functie din Dashboard este insotita de explicarea detaliata a fiecarui pas de setup, cu imagini, scheme si link-uri de documentatie suplimentara.

Din perspectiva cealalta, Fiddler nu exceleaza la capitolul conexiuni fiabile. Mai precis, de multe ori internetul este intrerupt de sistemul sau de Proxy, multe call-uri nu se executa pana la capat in aplicatiile web, iar de aici afectarea analizei tehnice.

Daca in browser am deschise 3 site-uri diferite, e destul de greu sa monitorizez doar unul dintre acestea (sa zicem ca unul e pentru testare, si pe langa ascult muzica in celalalt). Fiddler imi va receptiona toate call-urile de pe toate paginile deschise, desi eu nu vreau asta.

De asemenea, varianta gratuita a lui Fiddler prezinta relativ putine functii ce pot fi aplicate intr-un proces mai amplu de testare software. Multe dintre functionalitatile importante si folosirea acestora fara limite prestabilite sunt disponibile doar in varianta platita, care nu e cea mai ieftina pentru o persoana care plateste din buzunarul propriu.

Concluzii

In incheiere, Fiddler reprezinta un instrument de testare extrem de interesant, care ofera functii utile in special pentru testarea partii de backend a aplicatiilor web si mobile. Este destul de versatil, dar cu unele sincope in exercitarea anumitor optiuni, insa una peste alta, este un tool pe care merita sa il avem in vedere, daca suntem preocupati de tot ce inseamna requests, HTTP, API-uri si metode in cadrul aplicatiilor supuse verificarilor.

Surse consultate si suplimentare

Documentatia generala pentru Fiddler

Cea mai recenta versiune a tool-ului ce poate fi descarcata

Tutorial introductiv pentru folosirea Fiddler

Istoria si contextul aparitiei Fiddler

Cum sa captezi traficul pe dispozitivele mobile cu Android folosind Fiddler

Un alt tool folosit pentru mobile este BrowserStack

Mircea-Gabriel Macarie

https://www.linkedin.com/in/mirceamacarie/

Tech enthusiast și QA engineer, membru al comunității Vlog De IT. Interesat de testare software (QA) în general, de User Experience și Web Development.

Related post

Leave a Reply

Your email address will not be published. Required fields are marked *